前端部署到Linux上同时NGINX提供服务
文章目录
简介
现在流行的Web托管服务器是Nginx,虽然最近Nginx的创作者被抓了,但是也不能影响Nginx的成功.
下面介绍下前端代码的一个部署过程
部署
代码编译
- npm run build / yarn run build 打包部署文件
- 拷贝到服务器上指定文件夹下记住地址,后面映射需要用到.
Nginx安装
-
远程进入Linux的机器,使用Xshell或者用自带的命令行工具ssh 账户@IP地址
-
开始通过源码编译安装
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
下载软件包,这个版本根据自己的喜爱 wget http://nginx.org/download/nginx-1.13.6.tar.gz 解压这个nginx的安装包 tar -zxvf nginx-1.13.6.tar.gz 导航到nginx目录下 cd nginx-1.10.1 安装一些需要的包 yum install -y pcre yum install -y pcre-devel yum install -y openssl-devel 开始配置 ./configure --prefix=/usr/local/nginx --conf-path=/usr/local/nginx/conf/nginx.conf --error-log-path=/var/log/nginx/error.log --http-log-path=/var/log/nginx/access.log --pid-path=/var/run/nginx/nginx.pid --lock-path=/var/lock/nginx.lock --with-http_ssl_module --with-http_stub_status_module --with-http_gzip_static_module --with-pcre 编译和安装 make install 配置环境变量,在文件profile文件中最后加上一行 vim /etc/profile export PATH=$PATH:/usr/local/nginx/sbin 测试是否成功,显示版本号,说明成功了 nginx -v
-
配置Nginx文件
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117
#user nobody; worker_processes 1; #error_log logs/error.log; #error_log logs/error.log notice; #error_log logs/error.log info; #pid logs/nginx.pid; events { worker_connections 1024; } http { include mime.types; default_type application/octet-stream; #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 logs/access.log main; sendfile on; #tcp_nopush on; #keepalive_timeout 0; keepalive_timeout 65; #gzip on; server { listen 80; server_name localhost; #charset koi8-r; #access_log logs/host.access.log main; location / { root html; //這里配置前端编译好的静态文件目录就好了 index index.html index.htm; } #error_page 404 /404.html; # redirect server error pages to the static page /50x.html # error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } # proxy the PHP scripts to Apache listening on 127.0.0.1:80 # #location ~ \.php$ { # proxy_pass http://127.0.0.1; #} # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000 # #location ~ \.php$ { # root html; # fastcgi_pass 127.0.0.1:9000; # fastcgi_index index.php; # fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name; # include fastcgi_params; #} # deny access to .htaccess files, if Apache's document root # concurs with nginx's one # #location ~ /\.ht { # deny all; #} } # another virtual host using mix of IP-, name-, and port-based configuration # #server { # listen 8000; # listen somename:8080; # server_name somename alias another.alias; # location / { # root html; # index index.html index.htm; # } #} # HTTPS server # #server { # listen 443 ssl; # server_name localhost; # ssl_certificate cert.pem; # ssl_certificate_key cert.key; # ssl_session_cache shared:SSL:1m; # ssl_session_timeout 5m; # ssl_ciphers HIGH:!aNULL:!MD5; # ssl_prefer_server_ciphers on; # location / { # root html; # index index.html index.htm; # } #} }
Nginx常用命令
- nginx 启动程序
- nginx -s stop 停止程序
- nginx -s reload 重新启动
部署过程中常用的Linux的命令
- wget xxxxx 下载文件
- tar -zxvf xxxxx 解压文件
- cd xxxx 导航到目录下 cd ../ 返回上一层目录
- rm xxxx 删除文件
- rm -rf 删除文件下所有的文件 不确认的
- vim 编辑文本, :wq 是保存
FAQ
-
不清楚怎么从windows传输文件到linux
请参考文章:https://www.7benshu.com/post/2019/12/17-2/
总结
NGINX是目前非常流行的简单的和高性能的Web服务器.
文章作者 拉斐
永久链接 https://www.7benshu.com/post/2019/12/17-1/
版权声明
本作品采用知识共享署名-非商业性使用-禁止演绎 4.0 国际许可协议进行许可。
上次更新 2020-07-15
7本书-公众号