持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第1天，点击查看活动详情

前言

一般情况下我们的项目通过webpack的devServer跑起来的页面都是http协议的；但是有些项目比如webrtc的项目它需要我们使用https，对，你没看错它需要本地跑https，虽然心里很慌但是不怕，心想不是有Google吗？一顿搜索猛如虎，然而都不起作用，最后只有一条路：用nginx配置https；

注意：安装环境为mac，所以本文不讨论mac之外的系统；安装之前我们需要了解一下https这个协议；

简单了解https

http + 加密 + 认证 + 完整性保护 = https

加密是https的一个重要的过程，分为两种类型，一种是对称加密：加密和解密用同一个密钥，这种方式的缺陷是：加密后密钥也必须发送给对方，有窃听风险；另一种是非对称加密：使用两把密钥的公开密钥加密，发送秘钥的一方使用对方的公钥加密，对方收到后用自己的私钥解密，而https使用混合加密机制（非对称加密比对称加密处理速度要慢的多，因此采用两者结合的方式），因此我们在后续的nginx配置过程中需要生成两个秘钥，一个公钥和一个私钥，具体生成过程后面详细介绍。

简单了解了https之后我们开始安装nginx

安装nginx有两个方法：

brew 集成安装
编译安装下面分别介绍这两种方法

brew 集成安装

brew 类似于 centOS 的 yum 以及 Ubantu 的 apt-get,是 mac 的必备神器

先安装homebrew，homebrew如果下载龟速的话可以选择其他的源进行尝试，安装完成之后一步搞定brew install nginx

编译安装–巨坑慎选

需要下载四个文件，当然核心是 nginx，其他自选

nginx
pcre
openssl(https必备)
zlib

基本都是下载完成之后./configure或者./config编译

然后make&make install安装

这样安装之后会出现如下问题

nginx找不到ssl报如下错误,网上的方法几乎一样，都无法解决问题

unknown directive “ssl”

nginx,openssl的快捷命令需要自己设置

nginx配置https

配置https第一步就是生成公钥和私钥：

openssl genrsa -out privkey.pem 1024 openssl req -new -x509 -key privkey.pem -out 

server.pem -days 365

接下来就找到nginx配置文件，修改它

server {
  listen 443 on;
  server_name localhost;
  ssl_certificate /usr/local/etc/nginx/server.pem;
  ssl_certificate_key /usr/local/etc/nginx/privkey.pem;
  ssl_session_timeout 5m;
  ssl_protocols SSLv2 SSLv3 TLSv1;
  ssl_ciphers ALL:!ADH:!EXPORT56:RC4+RSA:+HIGH:+MEDIUM:+LOW:+SSLv2:+EXP;
  ssl_prefer_server_ciphers on;
  charset koi8-r;


  location / {
      proxy_pass http://127.0.0.1:8090;
  }
}

最后执行nginx -s reload重启，然后就可以访问https了

最后要说的是本文是实战篇，必须跟着一起实践才有收获，如果你还没有玩过nginx，请马上行动起来，有什么问题可以在文章下方一起讨论

本地跑一个https项目你会吗?

前言

简单了解https

brew 集成安装

编译安装–巨坑慎选

nginx配置https