AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

【报错解决】【Vue】与后端交互时，http与https跨域问题

2022-11-13 1360
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 【报错解决】【Vue】与后端交互时，http与https跨域问题问题

问题

q1.png

xhr.js:220 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.

场景

Vue前端，Java后端，网站开启了强制https

上传项目后发生了以上报错。

解决方法

在index.html文件中添加


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

注意

我后端早就写了对跨域问题的处理的

文章标签：
Java
JavaScript
前端开发
关键词：
HTTP https
HTTPS HTTP
后端交互
vue后端
HTTPS后端
萌狼蓝天
目录
相关文章
热爱技术的小郑
|
2月前
|
JavaScript NoSQL Redis
Vue中实现修改邮箱、手机号等流程的大致过程、验证码由后端的redis生成验证（版本1.0）
这篇文章记录了在Vue中实现修改手机号和邮箱的大致流程，包括使用过滤器部分隐藏展示的手机号和邮箱，以及通过点击触发路由跳转的便捷方式。文章还描述了旧号码和新号码验证的界面实现，其中验证码由后端生成并通过弹窗展示给用户，未来可以接入真正的手机验证码接口。此外，还提供了修改邮箱的页面效果截图，并强调了学习是一个永无止境的过程。
热爱技术的小郑
32 0
Vue中实现修改邮箱、手机号等流程的大致过程、验证码由后端的redis生成验证（版本1.0）
六卿
|
15天前
|
前端开发 JavaScript
node反向代理，解决跨域（http-proxy-middleware）
使用node.js和http-proxy-middleware库实现反向代理，解决跨域问题，允许前端请求通过代理访问不同端口的服务。
六卿
19 3
1288912195458132
|
2月前
|
算法 Java 测试技术
java 访问ingress https报错javax.net.ssl.SSLHandshakeException: Received fatal alert: protocol_version
java 访问ingress https报错javax.net.ssl.SSLHandshakeException: Received fatal alert: protocol_version
1288912195458132
106 1
热爱技术的小郑
|
2月前
|
JavaScript 前端开发
Vue中传递自定义参数到后端、后端获取数据（使用Map接收参数）
这篇文章讲述了如何在Vue中通过Axios二次封装传递自定义参数到后端，并展示了后端如何使用Map接收这些参数，以及如何避免参数转换错误和统一接口设计的方法。
热爱技术的小郑
116 1
土木林森
|
2月前
|
前端开发 Java Spring
Spring与Angular/React/Vue：当后端大佬遇上前端三杰，会擦出怎样的火花？一场技术的盛宴，你准备好了吗？
【8月更文挑战第31天】Spring框架与Angular、React、Vue等前端框架的集成是现代Web应用开发的核心。通过RESTful API、WebSocket及GraphQL等方式，Spring能与前端框架高效互动，提供快速且功能丰富的应用。RESTful API简单有效，适用于基本数据交互；WebSocket支持实时通信，适合聊天应用和数据监控；GraphQL则提供更精确的数据查询能力。开发者可根据需求选择合适的集成方式，提升用户体验和应用功能。
土木林森
74 0
土木林森
|
2月前
|
负载均衡 Java API
深度解析SpringCloud微服务跨域联动：RestTemplate如何驾驭HTTP请求，打造无缝远程通信桥梁
【8月更文挑战第3天】踏入Spring Cloud的微服务世界，服务间的通信至关重要。RestTemplate作为Spring框架的同步客户端工具，以其简便性成为HTTP通信的首选。本文将介绍如何在Spring Cloud环境中运用RestTemplate实现跨服务调用，从配置到实战代码，再到注意事项如错误处理、服务发现与负载均衡策略，帮助你构建高效稳定的微服务系统。
土木林森
59 2
广州爱奇迪-伍华聪
|
3月前
|
开发框架 前端开发 JavaScript
ABP框架测试信息---Winform端、动态网站、Vue&Element管理后端等
ABP框架测试信息---Winform端、动态网站、Vue&Element管理后端等
广州爱奇迪-伍华聪
48 1
。思索
|
2月前
|
JavaScript 前端开发 安全
VUE——APP，后端，前端三端AES加密解密
VUE——APP，后端，前端三端AES加密解密
。思索
57 0
技术混子
|
3天前
|
前端开发 NoSQL 关系型数据库
探索后端开发：从零到精通的旅程
【9月更文挑战第36天】在数字时代，后端开发是构建强大、可靠和高效应用程序的核心。本篇文章将带你踏上一段奇妙之旅，从基础概念到高级实践，揭示后端开发的奥秘。无论你是初学者还是有经验的开发者，这篇文章都将为你提供宝贵的知识和启发。让我们一起探索后端开发的世界，发现它的无限可能！
技术混子
17 3
游客moiomvrp3vyac2
|
4天前
|
前端开发 JavaScript 数据库
探索后端开发：从新手到专家的旅程
【9月更文挑战第35天】在数字世界的后台，后端开发是支撑起整个互联网的骨架。本文将带你走进后端的世界，从基础概念到高级应用，一起探索如何构建强大而灵活的后端系统。无论你是初学者还是有经验的开发者，都能在这段旅程中找到新的启示和成长的机会。
游客moiomvrp3vyac2
98 61

热门文章

最新文章

  • 1
    [原创]对于运行ASP.NET程序时，提示：无法启动程序“http://localhost:3532/Default.aspx”。的解决办法
  • 2
    Detecting HTTP Load Balancers using Halberd
  • 3
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html><head><meta http-equiv="Cont
  • 4
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html><head><meta http-equiv="Cont
  • 5
    http://www.cnblogs.com/jikey/archive/2009/12/07/1618772.html
  • 6
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html><head><meta http-equiv="Cont
  • 7
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html><head><meta http-equiv="Cont
  • 8
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html><head><meta http-equiv="Cont
  • 9
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html><head><meta http-equiv="Cont
  • 10
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html><head><meta http-equiv="Cont
  • 1
    HTTPS代理搭建技巧分享​
    173
  • 2
    【Go语言专栏】Go语言中的HTTPS与TLS配置
    478
  • 3
    【计算机网络】http协议的原理与应用，https是如何保证安全传输的
    190
  • 4
    DataWorks操作报错合集之在阿里云 DataWorks 中，代码在开发测试阶段能够成功运行，但在提交后失败并报错“不支持https”如何解决
    91
  • 5
    SpringBoot配置HTTPS及开发调试
    81
  • 6
    HTTP协议与HTTPS协议
    70
  • 7
    https://developer.aliyun.com/article/1495767
    73
  • 8
    静态代理IP是否支持HTTP和HTTPS？
    82
  • 9
    秒懂HTTPS接口（原理篇）
    378
  • 10
    8-20|https://gitlab.xx.com/api/v4/projects/4/trigger/pipeline Request failed状态码400
    84

    • 相关课程

    更多
  • Java Web开发-Web应用、Tomcat、HTTP请求与响应
  • 云安全基础课- HTTP协议基础

    • 相关电子书

    更多
  • 十分钟上线-使用函数计算构建支付宝小程序服务
  • CDN助力企业网站进入HTTPS时代
  • 机器学习在互联网后端技术中的应用

    • 相关实验场景

    更多
  • 通过HTTPS加速网关快速部署网站加密
    • 下一篇
    阿里云对象存储OSS怎么收费？包年包月和按量付费价格表