nginx服务配置http和https以及本地虚拟域名
开始之前#
为了更好的理解配置和打通逻辑,在这里预置几个目标。
- 配置本地虚拟域名
- 使用虚拟域名配置nginx的http服务
- 生成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;
}
}