在部署前后端分离的Vue3+Flask项目时，配置nginx后发现http能正常访问，但https出现错误。错误提示为 Mixed Content，尝试通过设置meta标签和nginx的Content-Security-Policy未解决问题。最终发现，问题在于前端请求URL缺少斜杠，添加斜杠后解决了https访问问题。
一、背景：
前后端分离，前端：vue3，后端：flask
前端打包合并到后端后，需要将该项目部署到正式服务器，并为其配置域名。配置完成后，却出现了http能访问，https无法访问的问题，报错如下：
Mixed Content: The page at 'https://...' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://...'. This request has been blocked; the content must be served over HTTPS.
二、尝试
碰到这个问题的人不少，但是解决方法都类似，都是通过某种方法将http请求强制转成https请求。
第一种：
在页面中加入如下<meta>标签
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" />第二种：
nginx配置如下语句
add_header Content-Security-Policy "upgrade-insecure-requests;connect-src *"
这两种方法我都尝试过了，它们的结果是一致的，
最低0.47元/天 解锁文章
2335
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
