prefacio
El protocolo Https implementa el cifrado de datos sobre la base del protocolo Http . Por lo tanto, cuando utilice el protocolo HTTPS para solicitar acceso, debe tener un certificado SSL (para conocer el proceso de solicitud, consulte Solicitud de certificado SSL ). Este artículo habla principalmente sobre la construcción de un servidor simple para recibir solicitudes http y https .
1. Importe el certificado SSL al proyecto.
Consejo: Incluso si no tienes un certificado SSL , el siguiente código te ayudará. Especialmente la sexta parte es muy práctica en el desarrollo de proyectos.
1. Cambiaremos el nombre del certificado SSL descargado (incluida la modificación del sufijo, el proceso de solicitud puede hacer referencia a Solicitud de certificado SSL ), el archivo de clave privada se llamará private.key y el archivo de certificado se llamará file.crt . Luego copie estos dos archivos al proyecto, la estructura del directorio es la siguiente (solo como referencia, puede crear directorios libremente).
2. Puede ver que hay varios archivos en el directorio anterior. Hablamos principalmente de router.js, app.js y server.js . La parte principal es el archivo server.js. Espero leerlo en orden. Archivos como node_modules, package-lock.json y package.json necesitan los módulos requeridos por npm y se utilizarán nodeJs . Si no lo sabe, puede visitar Construcción simple del servidor NodeJs o el Tutorial de NodeJs para obtener más información. es muy sencillo.
Nota: Todo el código de esta publicación de blog se puede copiar directamente. Si hay un error de que un determinado módulo no existe, necesita el módulo correspondiente de npm .
2. enrutador.js
'use strict'
var express = require('express') // 记得npm 'express' 模块
var router = express.Router()
var value = "1"
router.get("/", function(req, res, next){
res.send("/")
})
router.get("/setValue", function(req, res, next){
// 获取key - value
var keys = Object.keys(req.query)
// 以返回第一个参数为例
value = req.query[keys[0]]
// 简单处理一下value
value = value || {
value:null}
res.send(value)
})
router.get("/getValue", function(req, res, next){
// 有上述的set，怎么也得有个配套的get
res.send(value)
})
module.exports = router
3. aplicación.js
'use strict'
var express = require("express")
var path = require("path")
var cookieParser = require('cookie-parser') // 记得npm 'cookie-parser' 模块
var bodyParser = require('body-parser') // 记得npm 'body-parser' 模块
var router = require("./router")
var app = express()
app.all("*", function(req, res, next){
res.header('Access-Control-Allow-Origin', '*')
res.header('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild')
res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS')
if (req.method == 'OPTIONS')
res.send(200) /*让options请求快速返回*/
else
next()
})
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({
extended: false}))
app.use(cookieParser())
app.use("/", router)
module.exports = app
4. servidor.js
'use strict'
var fs = require('fs')
var path = require('path')
var http = require('http')
var https = require('https')
var app = require('./app')
//检测端口号是否合法
var normalizePort = function(val)
{
var port = parseInt(val, 10)
if(isNaN(port))
return val
if(port >= 0)
return port
return false
}
// 获取ssl证书所在的路径
var ssl_path = path.resolve(__dirname, '.') + '/ssl'
// 将ssl证书配置在对象内
var credentials = {
key: fs.readFileSync( ssl_path + '/private.key', 'utf8'),
cert: fs.readFileSync(ssl_path + '/file.crt', 'utf8')
}
// 创建https， 端口号是8080 (如果端口号不能用，需要查看设置是否被拦截或不信任)
var https_port = normalizePort('8080')
var https_server = https.createServer(credentials, app)
https_server.listen(https_port)
// 创建http，端口号是8000 (如果端口号不能用，需要查看设置是否被拦截或不信任)
var http_port = normalizePort('8000')
var http_server = http.createServer(app)
http_server.listen(http_port)
5. Resultados de la ejecución
1. Abra la terminal, vaya al directorio donde se encuentra server.js , presione Entrar, luego ingrese el comando node server.js y presione Entrar, y este servidor simple comenzará a ejecutarse. Si se informan algunos errores, como que el módulo no existe, debe npm el módulo. Si se ejecuta correctamente, no hay resultados, como se muestra en la siguiente figura.
2. Ingresamos diferentes URL para comparar.
(1) Ingrese la URL http://localhost:8000/setValue?&age=18 y se mostrará un 18 en la página web .
(2) Ingrese la URL http://localhost:8080/setValue?&age=18 , pero la página web no se puede abrir normalmente .
(3) Ingrese la URL https://localhost:8080/setValue?&age=18 y se mostrará un 18 en la página web .
(4) Ingrese la URL https://localhost:8000/setValue?&age=18 , pero la página web no se puede abrir normalmente .
A través de las cuatro comparaciones anteriores, podemos saber que en el mismo servidor se monitorean tanto las solicitudes http como las solicitudes https , pero diferentes protocolos solo pueden acceder a los puertos correspondientes; de lo contrario, el acceso fallará.
3. Estamos ingresando la URL https://localhost:8000/getValue y se muestra un 18 en la página web .
Se ha completado el acceso al servidor a través de la página web. Pero en el desarrollo real, no podemos acceder a todo a través de la página web. A continuación, descubramos cómo usar el código para acceder al servidor mencionado anteriormente en el proyecto.
6. Servidor de acceso al código del cliente
1. El contenido anterior es solo una operación simple en la página web y no es muy práctico en el proyecto. A continuación, hablemos de contenido de desarrollo práctico. Creamos un archivo llamado request_server.js y editamos el contenido de la siguiente manera (el código se puede copiar directamente):
var request_server =
{
value:0,
request_server_value : function()
{
var xmlhttp = null
if(window.XMLHttpRequest)
xmlhttp = new XMLHttpRequest()
else
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")
// 在 onreadystatechange 调用该 callback，该函数在下面
var callback = function(ret, data)
{
if(ret)
{
// 对数据做些简单的处理
// 该示例在请求访问时，传递的参数是可转义的类型，如 "1"和1, 如果是其他类型，可以自行修改下述两行代码
var _value = typeof(data) == 'object' ? '0':data
https_request.value = parseInt(_value)
// 打印一下访问到的结果
console.log(">>>> value is ", https_request.value)
try{
}catch(e){
}
}
else
https_request.value = 0
}
xmlhttp.onreadystatechange = function()
{
if(xmlhttp.readyState == 4)
callback?callback(xmlhttp.status==200, xmlhttp.responseText):''
}
// 做本地访问操作，localhost 可以是你的远超服务端的 ip地址 或 域名
xmlhttp.open("GET", 'https://localhost:8080/getValue', true)
xmlhttp.setRequestHeader("Content-Type", "application/json; charset=UTF-8");
xmlhttp.send()
},
}
2. Luego colocamos el archivo request_server.js en el proyecto. En cuanto a mí, hice un botón simple para probar y su función de devolución de llamada es click_callback() , el código es el siguiente:
click_callback: function ()
{
// 点击按钮时，调用 request_server_value 函数
request_server.request_server_value()
}
La función de este botón solo la puedes completar tú mismo, hay muchos tipos de clientes y no está claro por el momento.
Haga clic en el botón y abra la consola del editor, y descubra que los datos recibidos son 18, entonces esto es exitoso.
Se acabaron todas las explicaciones, espero que te sean de ayuda.