简单介绍
Nginx 是一款*的、开源的、高性能的HTTP服务器和反向代理服务器,同时也是一个IMAP、POP3、SMTP代理服务器。Nginx可以作为一个HTTP服务器进行网站的发布处理,另外Nginx可以作为反向代理进行负载均衡的实现。
安装步骤
- 下载Nginx
下载地址:http://nginx.org/en/download.html (Nginx官网)
2、下载之后,解压到指定的目录,就可以看到以下的目录
3、控制台(CMD)切换到Nginx目录下,输入start nginx ,然后在浏览器页面输入localhost,出现如下界面则表示安装成功。默认监听80端口号。
4、nginx命令介绍
- start nginx 开启nginx服务
- nginx.exe -s stop 关闭 nginx 服务,快速停止nginx ,可能并不保存相关信息
- nginx.exe -s quit 关闭nginx服务,完整有序的停止nginx,并保存相关信息
- nginx.exe -s reload 重载nginx服务,当你改变了nginx配置信息并需要重新载入这些配置时可以使用此命令重载nginx
- 使用
taskkill /F /IM nginx.exe > nul
命令强关nginx服务器
访问项目
hash模式
- 打包
npm run build
- 把生成的dist目录,放到html目录下。
- 浏览器访问:localhost/dist/index.html就可以看到页面了。
history模式
当你使用 history 模式时,url就像正常的url,例如
“http://yoursite.com/mapp/”,不过这种模式还需要后台配置支持。因为我们的应用是单页面应用,如果后台没有正确的配置,当用户在浏览器直接访问 "http://yoursite.com/mapp/home"就会返回 404。
location / {
try_files $uri $uri/ /index.html;
}
子目录部署
如果项目没有直接部署在Nginx 主目录下,而是在其子目录,如:
Nginx 配置root路径为:/user/local/nginx/html
,子目录路径为:/user/local/nginx/html/dist
,此时Nginx应该这样配置:
location / {
try_files $uri $uri/ /dist/index.html;
}
Nginx 转发时Header 中信息丢失
通过Nginx 转发后,Header中 access_token 信息丢失,经查,发现 Nginx 在转发时,header 中带下划线_的属性默认不转发,需要增加配置:
underscores_in_headers on;
如图所示
location / {
root html/dist/;
try_files $uri $uri/ /dist/index.html;
index index.html;
}