https访问http接口的终极解决方案


这几天做业务碰到了https需要访问http接口的问题,遂在网上寻找解决方案,但大部分无法解决,在接口只支持http的情况下需要别的解决方案。

常规解决方案

1.资源使用 //api.example.com,不写资源请求协议,自动适配

2.配置CSP,也是类似自动适配的方案

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

经过测试,以上两个常规方案只是「让浏览器在发起HTTP请求时,先尝试HTTPS协议」,也就是只是自动适配而已,而访问那些原本就没有部署https的接口,还是无法访问的,针对这种情况完全就是摆设。

终极解决方案

既然前端改不动接口协议,那就让服务器做中间人:

浏览器(HTTPS) → 伪装成HTTPS请求 → Nginx → 真实HTTP接口
server {
...

    location /proxy-api/ {
        # 配置真实接口地址
        proxy_pass http://api.example.com/;
        
        # 伪装请求头(某些接口校验Host)
        proxy_set_header Host api.example.com;
        proxy_set_header X-Real-IP $remote_addr;
    }
...
}

调用实例

//原调用地址
axios.get('http://api.example.com/data')

// 改为代理地址
axios.get('/proxy-api/data') 

这套方案相当于给HTTP接口套了层HTTPS马甲,实测可用。

以上。(注意配置nginx代理接口地址最后面的斜杠不要落下 :D)


发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注