我们都知道HTTPS的页面是发送不了HTTP请求的,那么是什么原因导致HTTPS页面不能发送HTTP请求呢?如果有发送的需求,怎么样才能发送?最近刚好遇到了这个问题,而且搜了半天没搜到靠谱的答案,所以有了本文。

1. 故事起源

我在《Jquery ajax, Axios, Fetch区别之我见》中提到过,Fetch作为一种不同于XHR的请求方式,展示了它更多API,以及符合ES规范的良好前景;更不用说它可以支持POST跨域。刚好工作上有用post方法上报效果数据的请求,我小手一挥,不用后台兄弟们麻烦了,我可以搞定,把效果上报换成了Fetch,美滋滋。

过了一段时间,后台跑过来说,现在还有些其他HTTP站点的数据上报。我试了一下,移动端根本就没有发出这个请求,这……

2. 为什么HTTPS页面发送不了HTTP请求

有些人说是跨域问题,真的是这样吗?

同源策略:1. 协议相同 2. 域名相同 3.端口相同

尽管HTTPS访问HTTP确实不符合同源策略中的协议相同,但是在现代浏览器里,即使是域名相同的请求,也是会出现以下报错,而不是跨域报错。

这也很好理解,毕竟混合内容的安全策略是在浏览器端判定的,而是否能跨域要看服务器返回的Response头,请求都被浏览器block掉了,也就不存在是否跨域的问题。

那什么是混合内容?

混合内容:初始 HTML 内容通过安全的 HTTPS 连接加载,但其他资源(例如,图像、视频、样式表、脚本)则通过不安全的 HTTP 连接加载[1]。因为页面通过 HTTPS 加载的初始请求是安全的,但是又加载了不安全的HTTP内容,因此称之为混合内容。

因为HTTPS的S本身就是Secure的意思,现代浏览器最初会针对此类型的内容显示警告,以向用户表明此页面包含不安全的资源。但是即使显示警告,页面也已经加载,用户的安全仍然受到了威胁。所以没过多久,Chrome和Firefox就直接阻断掉了这类的请求。

这就是HTTPS页面为什么发送不了HTTP的原因。

2. 突破方式

尽管现在主流浏览器都已经block掉了HTTPS页面上的HTTP请求,但是我们还是可以通过被动混合内容来发送get请求。

被动混合内容:指的是不与页面其余部分进行交互的内容,包括图像、视频和音频内容 ,以及无法与页面其余部分进行交互的其他资源。

主动混合内容: 指的是能与页面交互的内容,包括浏览器可下载和执行的脚本、样式表、iframe、flash 资源及其他代码。[1]

因为攻击者可以通过不安全的HTTP内容来攻击安全的HTTPS页面,所以这类请求被严格阻断掉了————这也是为什么我们的Fetch请求被干掉了。所以我们可以在迫不得已的情况下,用img.src的方式来发送请求。当然,请求方法只能是get。

sendHttpRequest: () => {
const img = new Image();
img.src = 'http://xxx.com//你的请求'
}

这时候,浏览器只会在控制台报warning,而不会block我们的请求。

总结

出于HTTPS的安全策略,浏览器会阻断HTTPS上的非安全请求(HTTP)请求,但是我们可以使用被动混合内容的方式来跨越这个安全策略。

HTTPS的页面发送不了HTTP请求?——关于混合内容的更多相关文章

  1. 使用java程序模拟页面发送http的post请求

    在web应用程序中,一般都是通过页面发送http的post请求,但也可以使用java程序来模拟页面发送请求,代码如下: import java.io.BufferedReader; import ja ...

  2. HTTPS混合内容解析

    什么是HTTPS混合内容 我们可能会有这样的经验,当我们通过HTTPS访问一个网站的时候,突然有提示:“本页面包含有不安全的内容”.这个时候会询问是否显示“不安全的内容”,这个时候,就是遇到了有混合内 ...

  3. 转:jquery向普通aspx页面发送ajax请求

    本文将介绍在ASP.NET中如何方便使用Ajax,第一种当然是使用jQuery的ajax,功能强大而且操作简单方便,第二种是使用.NET封装好的ScriptManager. $.ajax向普通页面发送 ...

  4. Java实现HttpClient发送GET、POST请求(https、http)

    1.引入相关依赖包 jar包下载:httpcore4.5.5.jar    fastjson-1.2.47.jar maven: <dependency> <groupId>o ...

  5. python 发送post和get请求

    摘自:http://blog.163.com/xychenbaihu@yeah/blog/static/132229655201231085444250/ 测试用CGI,名字为test.py,放在ap ...

  6. iOS开发网络篇—发送GET和POST请求(使用NSURLSession)

    iOS开发网络篇—发送GET和POST请求(使用NSURLSession) 说明: 1)该文主要介绍如何使用NSURLSession来发送GET请求和POST请求 2)本文将不再讲解NSURLConn ...

  7. Ajax详解及其案例分析------如何获得Ajax对象,使用Ajax对象发送GET和POST请求,校验用户名,POST和GET请求时的乱码处理,实现级联的下拉列表

    本节主要内容预览: 1 获得Ajax对象 2 使用Ajax对象发送GET请求 3 使用Ajax对象发送POST请求 4 使用Ajax校验用户名 5 POST请求时的乱码处理 6 GET请求时的乱码处理 ...

  8. Android 发送HTTP GET POST 请求以及通过 MultipartEntityBuilder 上传文件(二)

    Android 发送HTTP GET POST 请求以及通过 MultipartEntityBuilder 上传文件第二版 上次粗略的写了相同功能的代码,这次整理修复了之前的一些BUG,结构也大量修改 ...

  9. Http学习之使用HttpURLConnection发送post和get请求(3)

    使用HttpURLConnection发送post和get请求 但我们常常会碰到这样一种情况: 通过HttpURLConnection来模拟模拟用户登录Web服务器,服务器使用cookie进行用户认证 ...

随机推荐

  1. POJ 1951

    把给定字符串翻译成目标字符串需要满足的条件是: 1.开头不能有空格 2.末尾不能有空格 3.给定标点前不能有空格 4.不能有A.E.I.O.U 5.空格不能和空格相邻 6.相同的字母只能出现1次 给出 ...

  2. OkHttp使用Get和Post访问服务器的工具类(一)

    首先来简单介绍一下okttp框架,类似于HttpUrlConnection,Android6.0以后,废弃了Apache Http Client,只有HttpUrlConnection和OkHttp了 ...

  3. 原 the app referencesnon-public selectors in payload

    摘要 当我们上传验证的时候,出现了the app referencesnon-public selectors in payload/项目名.app/项目:字符 的警告的解决办法 当我们上传验证的时候 ...

  4. storyboard出口回退问题

    问题 直接在Main.storyboard拖动添加到出口的时候总是出一些不知名的错误.猜想可能是swift4又TM换了新特性(不过好喜欢啊哈哈哈哈) 解决 其实可以先拖动添加@IBAction函数到代 ...

  5. python mysql基本操作

    1.创建数据库.表添加数据. # -*- coding: utf-8 -*- import MySQLdb.cursors conn =MySQLdb.connect(',charset = 'utf ...

  6. bat命令2

    echo.@.call.pause.rem(小技巧:用::代替rem)是批处理文件最常用的几个命令,我们就从他们开始学起. echo 表示显示此命令后的字符 echo off 表示在此语句后所有运行的 ...

  7. Vue生命周期函数详解

    vue实例的生命周期 1 什么是生命周期(每个实例的一辈子) 概念:每一个Vue实例创建.运行.销毁的过程,就是生命周期:在实例的生命周期中,总是伴随着各种事件,这些事件就是生命周期函数: 生命周期: ...

  8. BW模型数据删除

    删除数据一般可以按请求(Request)来删除,需要从顶层模型往下删:也可以完成删除,在模型中就没有删除的顺序.本例中采用完全删除,但是按照从顶层模型往下的顺序删除数据.   1.删除信息立方体数据 ...

  9. 记录一些WPF常用样式方便以后复用(转)

    TextBox文本框 <Style x:Key="TextBoxStyle1" BasedOn="{x:Null}" TargetType="{ ...

  10. jspm 安装试用

    1. 安装 yarn global add jspm or npm install -g jspm 2. 创建项目使用 mkdir appdmeo jspm init 3. 安装依赖 jspm ins ...