nginx配置https服务器

nginx服务配置http和https以及本地虚拟域名

开始之前#

为了更好的理解配置和打通逻辑,在这里预置几个目标。

  1. 配置本地虚拟域名
  2. 使用虚拟域名配置nginx的http服务
  3. 生成ssl证书,安装证书,修改nginx的http服务为https

配置本地虚拟域名#

为啥要配置虚拟域名,不使用不行吗?

优:虚拟域名可以隐藏IP地址,本地开发调试可以更接近线上预演环境。

劣:需要在每个需要访问虚拟域名的电脑上修改host文件。

不用:使用IP地址能满足需求就可以跳过了

Windows:用管理员方式打开记事本,菜单->文件->打开->C:\Windows\System32\drivers\etc->右下角选所有文件->双击打开host文件。

注:#开头是注释内容,不生效

127.0.0.1       localhost
::1             localhost

192.168.0.109 img.server.com
192.168.0.109 media.server.com
192.168.0.109 web.server.com
192.168.0.109 api.server.com

localhost的那几行不用修改,在后面添加虚拟域名即可。

这里使用的是局域网IP地址是考虑局域网访问,如果不考虑局域网访问也可以使用本地IP:127.0.0.1

不知道局域网IP地址可以使用cmd命令ipconfig查看

保存之后,在cmd里面使用ping web.server.com来查看虚拟域名是否生效。

显示timeout就没生效,显示IP地址相应数据就生效了

这样在浏览器中访问虚拟域名就可以直接访问到本机IP了。

使用虚拟域名配置Nginx的http服务#

没有安装Nginx,到官方下载,尽量使用Stable version(稳定版)

安装好后用编辑器打开nginx.conf文件。路径会根据系统和安装位置有所不同,大体都在安装目录下的xxx\nginx\conf文件夹中(xxx\nginx是安装目录)

将虚拟域名web.server.com配置到nginx.conf中。

一个server就是一个服务,server得在http包含中

#http {
#    ...
       
server {
    listen       80;
    server_name  web.server.com;

    location / {
        root   html;
        index  index.html index.htm;
    }
}
    
#    ...
#}

保存nginx.conf后,使用命令重启nginx服务。

nginx #启动
nginx -t #测试配置文件是否正确
nginx -s reload #重启nginx服务器
nginx -s quit #等待完成任务后关闭
nginx -s stop #强制关闭

打开浏览器访问虚拟域名web.server.com,如果配置没问题就可以访问到nginx默认页面了。

其他相关命令#

netstat -aon|findstr "80" #查看80端口占用情况
tasklist|findstr "7532"  #根据PID查看占用80端口的程序

指向项目目录,配置单页面(spa)跳转#

由于项目并不是在nginx安装目录下,需要重新配置root的值指向项目(编译打包后)所在目录{pathto}/demo/dist。项目本身是单页面应用(spa)所以还需要增加uri重写到index上,避免单页面应用由于刷新而404。

# http web.server.com
 server {
     listen 80;
     server_name  web.server.com; # 域名
     root {pathto}/demo/dist; # 项目目录
     location / {
         try_files $uri $uri/ @router; # 单页应用跳转
         index  index.html index.htm;
     }

     location @router{
         rewrite ^.*$ /index.html break; # 单页应用跳转
     }
 }

再次访问虚拟域名web.server.com,就可以访问到项目了。

生成ssl证书#

https需要使用到ssl的密钥和证书。线上的需要购买证书,本地开发就没必要买了,自己造个得了。

这里使用库mkcert来生成密钥和证书,下载mkcert后,可以将mkcert设置到环境变量中直接使用。

配置好环境变量后,可以在cmd中试试命令

mkcert -h

没报错说明环境变量配置成功。接下来开始生成密钥和证书。

生成之前请cd切换所在目录,不然容易找不到生成后的文件

使用以下命令生成文件,域名和IP根据实际情况去调整。

mkcert server.com "*.server.com" "localhost" 192.168.0.109 127.0.0.1 ::1

正常运行会生成2个文件(xx.pem和xxkey.pem)文件。

安装证书#

可以将生成的文件复制到nginx目录下,方便配置和管理。这里放到nginx/conf/ssl目录下。然后使用命令安装证书。

mkcert -install

增加nginx的https服务,修改http服务为跳转https#

修改nginx.conf配置文件。

# https web.server.com
    server {
       listen       443 ssl;
       server_name  web.server.com; # 域名

       ssl_certificate      ssl/server.com+6.pem; # 证书文件
       ssl_certificate_key  ssl/server.com+6-key.pem; # 密钥文件

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

       ssl_ciphers  HIGH:!aNULL:!MD5;
       ssl_prefer_server_ciphers  on;

       root {pathto}/demo/dist; # 项目目录

       location / {
            try_files $uri $uri/ @router;
            index  index.html index.htm;
        }

        location @router{
            rewrite ^.*$ /index.html break;
        }
    }

# http 重定向
    server {
        listen 80;
        server_name  web.server.com;
        return 301 https://web.server.com;
    }

重启nginx成功后,访问https://web.server.com就可以访问了

其他配置#

api.server.com是代理接口,所以得使用proxy_pass设置代理地址

# https api.server.com
    server {
        listen       443 ssl;
        server_name  api.server.com;
        ssl_certificate      ssl/server.com+6.pem;
        ssl_certificate_key  ssl/server.com+6-key.pem;

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

        ssl_ciphers  HIGH:!aNULL:!MD5;
        ssl_prefer_server_ciphers  on;
        
        location / {
            proxy_pass http://192.168.0.109:3004;
        }
    }

img.server.com是文件服务,得使用文件目录服务

# https img.server.com
    server {
        listen       443 ssl;
        server_name  img.server.com;
        ssl_certificate      ssl/server.com+6.pem;
        ssl_certificate_key  ssl/server.com+6-key.pem;

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

        ssl_ciphers  HIGH:!aNULL:!MD5;
        ssl_prefer_server_ciphers  on;
        location / {
            autoindex on;
             root D:/img;
        }
    }

参考#