配置nginx https

生成数字证书和密钥

配置openssl.cnf(Mac OS用户打开/usr/local/etc/openssl目录,Windows用户请先下载openssl)

  • 打开openssl.cnf文件(用记事本或vs code以免保存时修改编码)
  • 取消以下行的注释(删除以“#”开头的行):
#req_extensions = v3_req#The extensions to add to a certificate request (添加一个证书请求)

  • 在 “[ v3_req ]” 区域添加下行
subjectAltName = @alt_names
  • 添加[ alt_names ] 区域(配置要使用该证书的客户端域名)
[ alt_names ]
DNS.1 = <yourDomain>
  • 取消以下行的注释:# copy_extensions = copy(告知CA配置允许使用自签名证书)
copy_extensions = copy

genrsa命令: 生成密钥对cert.key

生成的密钥对长度是2048bit, 包含公钥和私钥,公钥发送给对方加密,私钥留着自己解密

openssl genrsa -out cert.key 2048

req命令:使用密钥对cert.key + openssl.cnf配置信息生成证书签名请求cert.csr

openssl req -new -sha256 -key cert.key -out cert.csr -config openssl.cnf

-sha256表示使用sha256算法生成摘要然后计算签名 -out表示输出CSR文件 -config表示扩展配置文件

新建alt-names.txt文件

[ alt_names ]
DNS.1 = mydomain.com

x509命令:使用密钥对cert.key + 证书签名请求cert.csr + alt-names.txt配置,生成数字证书cert.crt

openssl x509 -req -sha256 -days 365 -in cert.csr -signkey cert.key -out cert.crt -extfile alt-names.txt

-days参数表示证书的有效期 -in表示CSR文件 -signkey表示密钥对的公钥 -extfile表示引用一个扩展文件 包含一些重要的扩展信息,其中最重要的就是alt_names扩展 -out表示输出的证书文件

使cert.crt受浏览器信任(浏览器不再报不安全提示)

双击cert.crt-进入钥匙串访问-选择添加到系统-并标记此证书为始终信任-点击关闭时输入账户密码完成操作

配置nginx.conf

server {
        listen 443 ssl; # 服务器监听443端口并启用SSL协议
        server_name mydomain.com;

        ssl_certificate cert.crt;  # 数字证书路径
        ssl_certificate_key cert.key;  # 密钥对路径

        ssl_session_cache shared:SSL:1m;
        ssl_session_timeout 5m;

        ssl_ciphers HIGH:!aNULL:!MD5; # 支持的密码套件列表
        ssl_prefer_server_ciphers on;
        ......
}

重启nginx/浏览器/电脑

FAQ

解决本地大量sockjs-node相关请求报错

  • 报错原因: 此请求是由webpack devserver内部代码发起的,url根据webpack配置默认生成为https://127.0.0.1:8080, 但该站点缺少可信任的CA证书,导致浏览器拦截了这个请求。
  • 解决办法:使用配置了可信任CA证书的域名访问,通过nginx代理到ip
// Webpack
devServer{
      // 告知runtime获取最新代码的路径
      sockHost: "mydomain.com",
      sockPort: 443
}

// Nginx
location /sockjs-node {
  proxy_set_header X-Real-IP $remote_addr;
  proxy_set_header Host $http_host;
  proxy_pass https://127.0.0.1:8080;
}
原文链接:juejin.im

上一篇:idlize
下一篇:发布npm包

相关推荐

  • 项目部署阶段nginx

    创建环境变量, 创建.env.production #这个前缀可以让nginx作反代 VUE_APP_BASE_API = '/api'改一下输出地址,vue.confifig.jsoutputD...

    7 个月前
  • 面试题:nginx有配置过吗?反向代理知道吗?

    这篇文章主要是针对跨域进行配置,如果大佬们会配置的话,就不用看了~简述反向代理和正向代理反向代理: 我们将请求发送到服务器,然后服务器对我们的请求进行转发,我们只需要和代理服务器进行通信就好,偷个图:...

    6 个月前
  • 面试专用:Http和Https之间的区别,及原理分析

    关于HTTP和HTTPS文章原理及分析,我相信已经有很多了,深入的原理我就不一一写出来了。 写这篇文章的目的主要是为了解决面试过程关于HTTP和HTTPS常见问题及怎样用自己话更好的描述出来了。

    7 个月前
  • 阿里云部署 5.域名、DNS、nginx

    域名 虽然通过ip地址可以直接访问你的网站,但是我们很少看到网站是通过ip地址访问的,一般网站都会提供域名。域名直观易记,且在用户访问的域名不改变的情况下,解析的ip地址可以更改。

    1 年前
  • 阿里云服务器(centos)配置nginx及node环境部署

    1. 远程登录服务器 FTP客户端工具选择FileZilla 使用教程: 2. 配置nginx 使用阿里云服务器自带包管理器yum yum -y install nginx nginx启动目录:...

    1 年前
  • 通过讲故事的方式让你理解,对称密钥加密,非对称称密钥加密和HTTPS等

    在讲HTTPS之前我们先聊一下密码学的简单知识,因为密码学还是比较复杂的学科,这里就简单的介绍一些概念,但是这些概念对理解HTTPS有很大的帮助。 在密码学中,常用Alice和Bob这两个名字进行举...

    10 个月前
  • 通过Nginx解决网络隔离实践记录

    需求 最近需要迁移Node线上服务,于是新申请了两台线上服务器; 部署服务器后,需要验证服务是否正常,办公环境与线上环境网络是隔离的,无法直接访问;但是,线上服务器可通过部署服务器访问,而办公...

    6 个月前
  • 通俗易懂的HTTPS握手过程

    什么是安全? 通讯过程中具备密码安全学的四个特性,就可以认为是“安全”的。这四个特性分别是: 机密性:简单来说就是小明和小红的对话内容是加密的,通讯时用的是火星文,只有他们自己知道如何解密; 完成性...

    4 个月前
  • 这一次,彻底理解https原理

    我的github/blog,若star,无比感谢 建议电脑观看,图有点挤,手机屏幕太小可能看不清楚。 放轻松 作为一个前端er,你总会在学习或工作中,听到这样的声音:什么是https?你对http...

    10 个月前
  • 这一次,彻底理解 https 原理

    我的github/blog,若star,无比感谢 建议电脑观看,图有点挤,手机屏幕太小可能看不清楚。 放轻松 作为一个前端er,你总会在学习或工作中,听到这样的声音:什么是https?你对http...

    10 个月前

官方社区

扫码加入 JavaScript 社区