前端部署靜態頁面到騰訊雲服務器詳解

本文轉載自查看原文 2020-07-31 22:09 1144 Linux系列

一 . 提倡用nginx搭建靜態服務器, 很簡單

首先用xshell 或者 finalshell 或者 winSCP 或者 FileZilla

輸入用戶名密碼 連接服務器 xshell下載地址https://xshell.en.softonic.com/ 其他的自己百度吧, 隨便用哪個

連接成功 , 直接在服務器上執行以下操作:

一. 安裝yum, yum是Linux系統的安裝必備神器，簡直不要太方便。但是新系統一般是不自帶yum工具的，所以需要手動安裝一下。

　　1. 新建一個目錄用來保存yum安裝包

mkdir install

　　2. 進入文件夾並輸入命令

wget http://yum.baseurl.org/download/3.2/yum-3.2.28.tar.gz

　　3. 解壓

tar -xvf yum-3.2.28.tar.gz

　　重點：解壓后先不着急安裝，手動創建一個yum的conf文件，不然會報找不到文件的錯yum.cli:Config Error: Error accessing file for config file:///etc/

touch /etc/yum.conf

　　4. 進入yum目錄，腳本安裝

cd yum-3.2.28

./yummain.py install yum

　　期間會提示安裝新版本，y回車即可

安裝成功！

二. 安裝nginx

　　在 CentOS 上，可直接使用 yum 來安裝 Nginx

yum install nginx -y

　　安裝完成后，使用 nginx 命令啟動 Nginx：

nginx

　　此時，訪問公網ip 可以看到 Nginx 的測試頁面, 下圖:

　　如果無法訪問，請重試用 nginx -s reload 命令重啟 Nginx

三. 配置靜態服務器訪問路徑

外網用戶訪問服務器的 Web 服務由 Nginx 提供，Nginx 需要配置靜態資源的路徑信息才能通過 url 正確訪問到服務器上的靜態資源。

打開 Nginx 的默認配置文件 /etc/nginx/nginx.conf ，

修改 Nginx 配置，將默認的 root /usr/share/nginx/html; 修改為: root /data/www;，如下：

示例代碼：/etc/nginx/nginx.conf

下面紅色部分的修改

user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;

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;

include /etc/nginx/conf.d/*.conf;

server {
listen 80 default_server;
listen [::]:80 default_server;
server_name _;
root /data/www;

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 {
}
}

}

配置文件將 /data/www作為所有靜態資源請求的根路徑，也就是你可以把靜態文件css,js,html全丟進去,也可以建文件夾, 如訪問: http://<您的域名>/index.html，將會去 /data/www 目錄下去查找 index.html。

首先讓我們在 /data 目錄下創建 www 目錄，如：