137.https是否能够发送http的请求

2023-12-25 21:38:10

也许你也曾碰见这种问题，在一个https的网页里面，出于某些原因，想要发送http协议的请求.

一、问题的答案：https是否能够发送http请求

答案根据主动、被动混合内容分类

这种https混杂着http的情况叫做：混合内容.

主动混合内容不可以（与页面交互的部分，下载的JS、iframe、样式表、flash和代码等：手动发一个请求）
被动混合内容可以（图片、视频、音频内容，例子：图片的 img.src）

未来随着浏览器的升级，也许被动混合内容也将不被允许发请求。因为这样是不安全的。
Chrome81，消灭混合内容，消灭https发http请求的情况

查阅书籍。
todo.

二、原因

原因显而易见，为了安全。

http为什么不安全
http为什么不安全？
现象：

1、无限wifi攻击，http的传输是明文，截获了就什么都知道了
2、垃圾广告攻击
原因：
1、http的传输是明文，需要加密
2、无法验证身份；只要请求正确，就给返回。给了中间人空间
3、数据易篡改，因为传输要跳节点，某个节点可能被安插广告

继续查阅书籍。
todo.

三、案例(语言：Node.js，服务器框架：Express - 官网文档有实例)

a.服务端和客户端各有一对公钥和私钥，使用公钥加密的数据只能用私钥解密，建立https传输之前，客户端和服务端互换公钥。

b.客户端发送数据前使用服务端公钥加密，服务端接收到数据后使用私钥解密，反之亦如此。

c.然后如果只是用公钥 + 私钥，还会遇见一个中间人攻击的问题。所以有一个签名证书，来确保服务端发给客户端的公钥是来自服务端。

通过 a 和 b，解决了上面的http不安全的原因 1，http的传输是明文。
通过 c，部分解决了http不安全的原因 2，无法验证双方身份，给了中间人空间。

1.让我们先开一个https的服务器

1.1 安装openssl，然后进入安装目录下的bin目录

1.2 使用openssl生成公钥和私钥

// 生成服务器端私钥
$ openssl genrsa -out server.key 1024 

//生成服务端公钥
$ openssl rsa -in server.key -pubout -out server.pem

1.3 认证公钥

//生成CA私钥
$ openssl genrsa -out ca.key 1024
//生成csr文件
$ openssl req -new -key ca.key -out ca.csr
//生成自签名证书
$ openssl x509 -req -in ca.csr -signkey ca.key -out ca.crt
//生成server.csr文件
$ openssl req -new -key server.key -out server.csr
//生成带有ca签名的证书
$ openssl x509 -req -CA ca.crt -CAkey ca.key -CAcreateserial -in server.csr -out server.crt

1.4 使用Express开启我们的https服务器

const express = require('express')
const fs = require('fs')
const app = express()
const https = require('https')
// 对比普通的http
const http = require('http')

// 这里放https的配置文件，如果这里没有配置项的话，https页面会报：【此网页无法提供安全连接】
const option = {
  // 公钥
  key: fs.readFileSync('./key/server.key'),
  // 证书
  cert: fs.readFileSync('./key/server.crt')
}

// 静态文件资源服务器，将网页挂在这里，然后用网页发起主动 http 请求、被动 http 请求
// 这是为了方便我们测试的
app.use(express.static('public'))

app.get('/', (req, res, next) => {
  res.send('hello, world')
})

const httpsServer = https.createServer(option, app)
const httpServer = http.createServer(option, app)

httpsServer.listen(443)
httpServer.listen(3000)

然后我们创建一个 public 文件夹，在里面创建一个 test.html，之后分别打开我们的端口：
A：https://localhost:443/test.html
B：http://localhost:3000/test.html

test.html内容

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <!-- jquery的https-cdn，是合法的请求 -->
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
  <!-- jquery的http -->
  <script src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<header>我是hh.html</header>
<img src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js" alt="">
</body>
</html>

2.我们主动、被动地发同一个http请求

地址：https://localhost:443/test.html
打开Chrome浏览器，输入地址，按F12，查看Network：

错误信息

Mixed Content: The page at 'https://localhost/test.html' was loaded over HTTPS, but requested an insecure script 'http://libs.baidu.com/jquery/2.1.1/jquery.min.js'. This request has been blocked; the content must be served over HTTPS.

完整截图：

从结果上看，https页面的Network只报了一个http请求错误。
从代码上看，我们两处使用了http的请求

4.总结答案

https通常无法发送http的请求。
会被浏览器阻止。
出于安全考虑。
图片的链接、视频的链接、音频的链接等被动请求是特殊情况。
未来也许连特殊情况也不会存在。

todo.

码农公寓