https服务器访问http资源报Mixed Content混合内容错误

1 报错内容

Mixed Content: The page at 'https://xxx' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://xxx'. This request has been blocked; the content must be served over HTTPS.

2 报错原因

页面通过 HTTPS 加载,但是尝试通过 XMLHttpRequest 请求一个 HTTP 资源。现代浏览器为了安全考虑,默认会阻止这种不安全的请求,报混合错误,这篇文章给出前端的解决方式。

3 解决方式

我这个报错是vue项目中出现的,找到这个项目的index.html文件,在headl里加上以下内容,然后生产环境就能正常访问了:

html 复制代码
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
相关推荐
灵感__idea15 分钟前
Hello 算法:众里寻她千“百度”
前端·javascript·算法
yinuo39 分钟前
轻松接入大语言模型API -04
前端
袋鼠云数栈UED团队1 小时前
基于 Lexical 实现变量输入编辑器
前端·javascript·架构
cipher2 小时前
ERC-4626 通胀攻击:DeFi 金库的"捐款陷阱"
前端·后端·安全
UrbanJazzerati2 小时前
非常友好的Vue 3 生命周期详解
前端·面试
AAA阿giao2 小时前
从零构建一个现代登录页:深入解析 Tailwind CSS + Vite + Lucide React 的完整技术栈
前端·css·react.js
兆子龙3 小时前
像 React Hook 一样「自动触发」:用 Git Hook 拦住忘删的测试代码与其它翻车现场
前端·架构
兆子龙3 小时前
用 Auto.js 实现挂机脚本:从找图点击到循环自动化
前端·架构
SuperEugene3 小时前
表单最佳实践:从 v-model 到自定义表单组件(含校验)
前端·javascript·vue.js
昨晚我输给了一辆AE863 小时前
为什么现在不推荐使用 React.FC 了?
前端·react.js·typescript