解决Mixed Content: The page at https://* was loaded over HTTPS, but requested an insecure XMLHttpReque

这篇具有很好参考价值的文章主要介绍了解决Mixed Content: The page at https://* was loaded over HTTPS, but requested an insecure XMLHttpReque。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

目录

项目场景

问题描述

原因分析

解决方案

一些问题


项目场景

https协议的网站下请求http的资源


问题描述

https协议的网站请求http协议的资源被浏览器任务不安全,请求被拦截并且报了以下错误:

原文: 

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

译文:

混合内容:https://*上的页面是通过HTTPS加载的,但是请求了一个不安全的XMLHttpRequest端点http://*.此请求已被阻止;内容必须通过HTTPS提供


原因分析

发生该错误的原因由浏览器的安全机制引起的,一个最好的解决办法就是都是用http的请求,也免去了申请证书,但浏览器一直报不安全的话可能会散失一些用户。所以还是得安排上https协议,如果要请求的资源服务器支持https协议,我们只需要把请求的http改成https即可;如果不支持的话可以选择给资源服务器安排上ssl证书,但很多时候我们没办法自行更改资源服务器,下面给大家提供我个人解决该问题的方案!


解决方案

我使用的是Nginx服务,因此我可以利用Nginx的反向代理来解决该问题,配置如下:

将以下配置放置在http{}

server {
    listen       443 ssl;
    # 你的域名
    server_name  xxxx.com;

    # 你的证书 crt对应的是公钥 key对应的是私钥
    ssl_certificate      xxxxx.crt;
    ssl_certificate_key  xxxxx.key;

    ssl_session_cache    shared:SSL:1m;
    ssl_session_timeout  5m;

    ssl_ciphers  HIGH:!aNULL:!MD5;
    ssl_prefer_server_ciphers  on;

    # 访问根路径跳转页面
    # 如:https://xxxx.com/
    location / {
        root   html;
        index  index.html index.htm;
    }

    # 访问/api的时候代理到服务器端部署的后端服务
    # 如:https://xxxx.com/api
    location /api {
        proxy_pass http://127.0.0.1:8080;
    }
    
}

注意看配置中说明的注释,如果有疑问或者不对的地方请在评论区发言!!!

一些问题

无法通过https协议访问 / 无法通过域名访问

1. 先确定一下域名是否正确的指向服务器端的公网IP地址

2. 其次保证Nginx配置文件中的域名是否和你的域名一致

3. 服务器端防火墙是否开放了443端口号

4. 可能是Nginx安装的时候没有配置with-http_ssl_moudle模块

提示您的连接不是私密连接 

关于这个问题给出下面几个解决方式:

1. 清除DNS缓存

2. 保证客户端服务端的时间一致

3.  尝试更换证书(我更换了证书就解决了)

# 原先我用的是cloudflare上面申请的证书,后面我使用dnspod的证书就好了(一年免费)

crt和key这两个文件怎么生成? 

 在你申请了证书之后会给你提供公钥和私钥两个部分的内容,把公钥的内容复制粘贴到记事本上,后缀改为.crt就行;私钥部分也复制粘贴到另一个记事本上把后缀改成.key就行。文章来源地址https://www.toymoban.com/news/detail-781663.html

到了这里,关于解决Mixed Content: The page at https://* was loaded over HTTPS, but requested an insecure XMLHttpReque的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Mixed Content: The page at ‘xxx‘ was loaded over HTTPS, but requested an insecure XMLHttpRequest end

    由于项目中后端提供的数据接口的地址是采用的 http 协议的,但是他们将项目部署到线上的时候,是放在 php服务器里面的,开启了 https 访问协议。在https中请求http接口或引入http资源都会被直接blocked(阻止),浏览器默认此行为不安全,会拦截。 https地址中,如果加载了ht

    2024年02月06日
    浏览(49)
  • mixed content the site was loaded over a secure connection but the file at was loaded over an insecu

    mixed content the site was loaded over a secure connection but the file at was loaded over an insecure connection 问题: 在https地址试图通过a标签跳转到http下载地址时,浏览器报错 mixed content the site https://xxx was loaded over a secure connection but the file at http://yyy was loaded over an insecure connection 原因 推测是触发了

    2024年02月14日
    浏览(58)
  • was loaded over HTTPS, but requested an insecure错误解决

    1、问题:今天客服老师在群里反馈一个加密上传图片的组件上传图片失败,问我是不是对图片格式进行了限制。我在控制台打开一下,爆出了这样的一个错误 The page at \\\' https://oms.luojilab.com/oms-host#/ledgers/user \\\' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint \\\' http://ddima

    2024年02月12日
    浏览(48)
  • 解决 Https 站点请求 Http 接口服务后报 the content must be served over HTTPS 错误的问题

    之前将自己所有的 Http 站点全部更新为 Https 站点,但是在请求后台接口服务的时候还是 Http 请求,导致部署之后,直接在控制台报 This request has been blocked; the content must be served over HTTPS; 的错误 因为我不想耗费精力,将所有的后台接口服务也更新为支持 Https 请求,所以访问了

    2024年02月16日
    浏览(51)
  • 【WEB前端】【报错解决】This request has been blocked; the content must be served over HTTPS....

    部署WEB项目后,开启了强制HTTPS,产生如下错误: 报错的原因就是当前页面是https协议加载的,但是这个页面发起了一个http的ajax请求,这种做法是非法的。HTTPS页面里动态的引入HTTP资源,比如引入一个js文件,会被直接block掉的.在HTTPS页面里通过AJAX的方式请求HTTP资源,也会被

    2024年02月13日
    浏览(42)
  • https请求报错block:mixed-content问题的解决办法

    本文将深入探讨HTTPS请求中出现的block:mixed-content错误,解释这一错误的含义、产生原因,并给出相应的解决方法。通过本文,读者将能够了解如何有效地处理这一常见的网页安全问题。 当用户在通过HTTPS协议访问网页时,如果网页中尝试通过HTTP协议加载资源(如图片、脚本、

    2024年04月26日
    浏览(32)
  • Did not attempt to load JSON data because the request Content-Type was not ‘application/json‘

    在使用flask-restfull进行API开发的时候。一旦我使用类似下面的代码从url或者form中获得参数就会出现报错:Did not attempt to load JSON data because the request Content-Type was not ‘application/json’。 代码如下: 解决方法如下

    2024年02月16日
    浏览(68)
  • 【谷歌浏览器】中(Mixed Content错误,即是https请求http在浏览器中出现的错误)的解决方法

    一、问题详情 Mixed Content: The page at ‘https://xxx’ was loaded over HTTPS, but requested an insecure test ‘http://xxx’. This request has been blocked; the content must be served over HTTPS. 注:上图中蓝色标记的【test】是http请求最后一级目录的,也就是展示当前出现问题的目录。 二、解决方

    2024年02月13日
    浏览(58)
  • 解决浏览器报 Mixed Content

    错误原因分析: HTML页面是通过HTTPS加载的,但是其他资源文件(如图片,视频,样式表文件,脚本)是使用HTTP方式加载的。之所以称为混合内容,是因为在一个网页中同时使用了HTTP和HTTPS,而最初的请求方式为 HTTPS。 现代浏览器可能会阻止此类内容,或者显示关于此类内容

    2024年02月15日
    浏览(35)
  • 解决The plain HTTP request was sent to HTTPS port

    现在越来越多的网站要求 http 访问转为更为安全的 https 访问,很多使用nginx部署的前端应用可以很方便的使用反向代理来实现,切换后,用http访问就会出现 \\\"The plain HTTP request was sent to HTTPS port\\\"的错误页面。 将此错误页面重定向到指定的https地址即可 假设端口号是8443: 另外,

    2024年02月11日
    浏览(99)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包