Nginx 部署静态页面
在前后端分离的项目中,前端经过编译生成的文件中,往往只包含一个 index.html
入口文件。可以利用 Nginx
进行简单配置就可以实现在部署到服务器端。
? 如果是nodejs
的项目可以利用pm2
进行部署,如果是egg
的项目可以利用egg
的工具egg-scripts
进行部署
Nginx 的全局配置
通过 yum
安装 Nginx
的配置文件在 /etc/nginx/nginx.conf
下。
其中 include /etc/nginx/default.d/*.conf;
引入在目录下的所有配置文件,原则上每个配置文件对应一个静态页面文件。
⚠️include
的坑:include
的位置应该在第一个 server 块后面 ⚠️ 权限问题导致的 403: 修改conf
配置user
字段为root
(默认是nginx
)
完整的nginx.conf 配置:
# For more information on configuration, see:# * Official English Documentation: http://nginx.org/en/docs/# * Official Russian Documentation: http://nginx.org/ru/docs/user root;worker_processes auto;error_log /var/log/nginx/error.log;pid /run/nginx.pid;# Load dynamic modules. See /usr/share/nginx/README.dynamic.include /usr/share/nginx/modules/*.conf;events { worker_connections 1024;}http { log_format main '$remote_addr - $remote_user [$time_local] "$request" ' '$status $body_bytes_sent "$http_referer" ' '"$http_user_agent" "$http_x_forwarded_for"'; access_log /var/log/nginx/access.log main; sendfile on; tcp_nopush on; tcp_nodelay on; keepalive_timeout 65; types_hash_max_size 2048; include /etc/nginx/mime.types; default_type application/octet-stream; # Load modular configuration files from the /etc/nginx/conf.d directory. # See http://nginx.org/en/docs/ngx_core_module.html#include # for more information. #include /etc/nginx/conf.d/*.conf; server { listen 80 default_server; listen [::]:80 default_server; server_name _; root /usr/share/nginx/html; # Load configuration files for the default server block. # include /etc/nginx/default.d/*.conf; location / { } error_page 404 /404.html; location = /40x.html { } error_page 500 502 503 504 /50x.html; location = /50x.html { } } include /etc/nginx/default.d/*.conf;# Settings for a TLS enabled server.## server {# listen 443 ssl http2 default_server;# listen [::]:443 ssl http2 default_server;# server_name _;# root /usr/share/nginx/html;## ssl_certificate "/etc/pki/nginx/server.crt";# ssl_certificate_key "/etc/pki/nginx/private/server.key";# ssl_session_cache shared:SSL:1m;# ssl_session_timeout 10m;# ssl_ciphers HIGH:!aNULL:!MD5;# ssl_prefer_server_ciphers on;## # Load configuration files for the default server block.# include /etc/nginx/default.d/*.conf;## location / {# }## error_page 404 /404.html;# location = /40x.html {# }## error_page 500 502 503 504 /50x.html;# location = /50x.html {# }# }}
default.conf 的配置
在 /etc/nginx/default.d
目录下配置,新建文件,一个简单的文件模板如下:
server { listen 9001; server_name localhost; location / { root /root/node-project/pm2test; #index index.html index.htm; }}
⚠️ 注意这里只包含 server
块
相关命令行
检查配置文件是否配置正确
sudo nginx -t -c /etc/nginx/nginx.conf
修改配置后,刷新配置
nginx -s reload
杀死nginx进程,重启
pkill -9 nginxsystemctl restart nginx
启动nginx
nginx
反向代理
利用 nginx
反向代理可以解决前端开中的跨域问题,而不需要服务端配合。具体请参考: