前端---服务器配置HTTPS协议

小灰灰 2022-10-11 01:19 401阅读 0赞

## 申请SSL证书 ##

*  申请SSL证书，并下载SSL证书(.pem 和 .key 文件)，将证书上传致Linux服务器。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MTE1NDY5_size_16_color_FFFFFF_t_70][]

##  ##

## Nginx配置HTTPS协议 ##

### 一、配置SSL模块 ###

*  进入Nginx的解压包目录(非Nginx安装目录)下，配置http\_ssl模块

./configure --with-http_ssl_module

*  执行安装命令

make

*  执行如下命令，将解压包目录下新的 nginx 复制到Nginx安装目录下， 覆盖旧的nginx(Nginx默认是安装到/usr/local/目录下)

cp objs/nginx /usr/local/nginx/sbin/nginx

### 二、配置文件配置https ###

*  在 nginx.conf 配置文件中的http配置项中配置https

#https配置
        server {
    		listen 443; #https协议默认端口是443端口
    		server_name localhost;
    		ssl on;
    		ssl_certificate   /ssl/ssl.pem; #ssl证书-.pem文件路径
    		ssl_certificate_key  /ssl/ssl.key; #ssl证书-.key文件路径
    		ssl_session_timeout 5m;
    		ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
    		ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    		ssl_prefer_server_ciphers on;
    		
    		location / {
    			root /project/h5-mini; #项目路径
    			index index.html index.htm; #项目首页
    		}
    	}

*  启动nginx，即可通过 https 访问项目

nginx

## Express配置https ##

*  启动文件中进行https的配置

const express = require('express')
    const compression = require("compression") //gzip包
    const https = require('https')
    const fs = require('fs')
     
    const app = express()
    app.use(compression()) // 启用gzip代码压缩
    app.use(express.static('./')) // 托管静态资源
    app.get('/*', function(req, res) { 
      const html = fs.readFileSync('./index.html', 'utf-8') // 项目首页
      res.send(html)
    })
    
    // ssl证书配置
    const options = {
      key: fs.readFileSync('/ssl/ssl.key'), // ssl证书-.key文件路径
      cert: fs.readFileSync('/ssl/ssl.pem') // ssl证书-.pem文件路径
    }
    
    https.createServer(options, app).listen(443, '0.0.0.0'); // 443为https协议默认端口

## HTTPS方式访问 ##

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MTE1NDY5_size_16_color_FFFFFF_t_70 1][]

##  ##

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MTE1NDY5_size_16_color_FFFFFF_t_70]: /images/20221005/f049ed6edec44cd286a93b274460f6ca.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MTE1NDY5_size_16_color_FFFFFF_t_70 1]: /images/20221005/ab8fa86310d14fcbb2536d7a250f7b9a.png