https的页面中可以发起http的请求吗

昨天在面试的时候，最后面试官突然问了一个问题， https的页面中可以发起http的请求吗? 我的回答是 不可以请求，基于 https 的安全性是不可以发起请求的 ，最后面试官又问有没有什么办法可以发起请求，当时没答上来，面试完后赶紧找了下相关的资源，顺便来记录下。

首先来设定一个场景， 自己写的web项目，为什么在https的页面中会出现http请求，按正常的开发流程，主站升级https后，相关的站点都会升级成https的 ，这样说确实没错，但前提是站点里面的内容都是自己管理的，但如果有时候引入其它平台的API或者资源时没有使用https了，这种情况该怎么办呢？所以就出现了 https的页面中可以发起http的请求吗？ 这样的问题。

https的页面页中为什么不能发起http请求，有人也行会觉得是同源策略的问题，同源策略的定义是这样的： 1. 协议相同 2. 域名相同 3.端口相同 ，尽管 https 访问 http 确实不符合同源策略中的协议相同，但反过来 http页面中可以使用https请求。 为什么又可以了，其实这不是同源策略的问题，而是跟 混合内容 的问题。

以下内容参考自 MDN

混合内容又分为 主动混合内容 和 被动混合内容 。

但有时候就是想在https中发起http请求，碰到这情况会怎么办了？其实可以借助被动混合内容的加载方便来突破这一层限制，使用加载图片的方式来发起请求，如下所示：

你好！

如何在HTTPS 网页中引入HTTP资源：

对于同时支持HTTPS和HTTP的资源，引用的时候要把引用资源的URL里的协议头去掉，浏览器会自动根据当前是HTTPS还是HTTP来给资源URL补上协议头的，可以达到无缝切换。

iframe方式

使用iframe的方式引入HTTP资源，然后将这个页面嵌入到HTTPS页面里就可以了。

用meta升级HTTP请求

在页面的head标签中加入 meta http-equiv=”Content-Security-Policy” content=”upgrade-insecure-requests”/>

由于第一次出现这个错误时是由于引入的jQuery造成，所以采用的是使用相同的协议（都采用HTTPS协议引入文件），或者将文件下载到项目中，也不存在HTTPS的问题。再次出现问题是由于使用百度地图的API，在引入js时已经给定了请求的协议是HTTP，所以最终采用了通过meta将http的不安全请求升级为https。

以上是对您的问题作出的回答，希望能够帮助到你

答案：https无法引用http资源，就是用了地址栏绿色小锁不会显示，当然浏览器也会提示不安全。所以需要全站或者外来资源都要https协议加密。

安全与常见说明：

1、为什么我看不到我的浏览器的地址栏中锁定符号？网页链接

2、https 页面中引入 http 资源的解决方式：网页链接

3、网站存在不安全因素的解决办法：网页链接

4、使用相对Url无缝切换HTTP-HTTPS：网页链接

如何解决HTTPS网站引入不安全元素导致的:不安全提示：网页链接