在 uniapp 项目调用后端接口时遇到了一个这样的错误:
仔细一看原来是在项目中混合使用 http、https 导致的,网站使用的是 https ,由于浏览器的安全机制,屏蔽了 http 请求,只能通过有数字证书的 https 请求,所以在进行 http 请求的时候被阻止了。
http 和 https
首先来看一下 http 和 https 的区别:
- http 是超文本传输协议,信息是以明文形式传输,所以 http 不适合传输一些敏感信息
- https 则是具有安全性的ssl/tls加密传输协议
浏览器默认 http 请求是不安全的,所以会拦截
在浏览器中,安全的连接可以看到标识:
不安全的链接可以看到标识::
解决http、https 混合的问题
在项目中,有时不可避免的同时使用到 http、https,在无法统一的情况下,可以尝试如下几种解决方案:
方案一
搜索这个报错,网上大部分的解决方案都是在 index.html 的 <head> 标签中添加一段代码:
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"/>
方案二
在 manifest.json 文件中修改 Web 配置,将 https 取消勾选,记得配置完成后重启项目
方案三
如果使用了前两种方案,接口请求依旧是有问题的,可以试试这一种,亲测有效:
点击浏览器地址栏前面的不安全,打开网站设置,将不安全的内容设置为允许:
配置完成后,重新请求接口,成功。
以上方案都是前端解决的方式,除此之外还可以在后端在服务器上设置响应头来解决。