解决Mixed Content: The page at https://* was loaded over HTTPS, but requested an insecure XMLHttpReque

一、报错内容描述

这种错误的出现是由于网页上同时加载了安全的HTTPS内容和非安全的HTTP内容，这会导致浏览器阻止加载混合内容，以保护用户数据安全和隐私。

二、出现问题的原因

  最近在做项目遇到了页面展示来自其他服务的图片地址，这时候浏览器提示了
  Mixed Content:ol/index' was loaded over HTTPS, but requested an insecure image 'http://202.*.*.*/static/img/5Rf9PjFcxekba8yTAch4qDJHsSY7gelPj9Qqa9D8.jpg'. This request has been blocked; the content m。 经查找资料，大概意思就是HTTPS服务不能访问来自于HTTP的协议，不安全的策略

三、解决思路

 首先想到了利用nginx反向代理功能转发到B服务请求。
 下面是例子，根据自己的ip去设定哈

	location ~ ^/static/img/(.*)$ {  
        proxy_pass http://1.1.1.1/static/img/$1;  
        proxy_set_header Host $host;  
        proxy_set_header X-Real-IP $remote_addr;  
	} 

这里有个小细节，需要特别注意下

图片地址最好不要带有http://ip 相关字眼，否则浏览器还是会提示被拒绝访问。

好了，到此为止完美的解决了该问题。 如果小伙伴们觉得有用欢迎点赞哈