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">
相关推荐
IT_陈寒14 分钟前
Vite性能优化实战:5个被低估的配置让你的开发效率提升50%
前端·人工智能·后端
IT_陈寒16 分钟前
Java性能调优的7个被低估的技巧:从代码到JVM全链路优化
前端·人工智能·后端
掘金安东尼41 分钟前
前端周刊第439期(2025年11月3日–11月9日)
前端·javascript·vue.js
码农刚子1 小时前
ASP.NET Core Blazor进阶1:高级组件开发
前端·前端框架
有蝉1 小时前
vue-office——支持多种文件(docx、excel、pdf)预览的vue组件库,支持vue2/3。也支持非Vue框架的预览。
vue.js·pdf·excel
道可到1 小时前
重新审视 JavaScript 中的异步循环
前端
起这个名字1 小时前
微前端应用通信使用和原理
前端·javascript·vue.js
QuantumLeap丶1 小时前
《uni-app跨平台开发完全指南》- 06 - 页面路由与导航
前端·vue.js·uni-app
CSharp精选营1 小时前
ASP.NET Core Blazor进阶1:高级组件开发
前端·.net core·blazor
Sheldon一蓑烟雨任平生1 小时前
Vue3 组件库 Element Plus
vue.js·vue3·element plus·element ui·vue3 常用组件库