157. 线上http 协议更新为https，本地http-proxy踩坑

原文链接：github.com/ly525/blog/…

关键字： http-proxy，代理、https

npm http-proxy 启用 https 的方式：

问题描述：

1. Local http:127.0.0.1:8088 -> Server https://www.xxx.com/api/v1
2. 后端环境：Django 1.11
3. 前端配置环境：

package.json dev 配置：
"dev": "webpack-dev-server --inline --progress  --config build/webpack.dev.conf.js",
复制代码

proxyTable: {
      '/api/v1': {
        // target: 'https://www.xxx.com/',
        changeOrigin: true,
      },
},
复制代码

4. Bug：

data: {detail: "CSRF Failed: Referer checking failed - 
Referer is insecure while host is secure."}
复制代码

5. 解决：

package.json dev 配置： 添加https，浏览器访问：https:127.0.0.1:8088 即可
"dev": "webpack-dev-server --inline --https --progress  --config build/webpack.dev.conf.js",
复制代码

1. How to run Vue.js dev serve with https?
2. stackoverflow.com/questions/1…
3. stackoverflow.com/questions/4… 中包含了 vue-cli3的解决方案。

附送另外一个Bug：

Bug：

detail: "CSRF Failed: Referer checking failed -
 https://127.0.0.1:8088/ does not match any trusted origins."
复制代码

需要后端修改验证规则（Django）：

CSRF_TRUSTED_ORIGINS = [
    # may have to include host AND port
    '127.0.0.1',
    '127.0.0.1:8088',
]
复制代码

转载于:https://juejin.im/post/5c07d43fe51d4570b57ad817