網(wǎng)頁開發(fā)之配置阿里云服務(wù)器

在阿里云購買和配置服務(wù)器

一. 創(chuàng)建實例
  • 登錄阿里云??云服務(wù)器ECS??實例??創(chuàng)建實例：
  • 配置選項：
    • 地域：選擇離你目標(biāo)用戶最近的地域
    • 網(wǎng)絡(luò)：默認/創(chuàng)建新網(wǎng)絡(luò)(記住網(wǎng)絡(luò)名稱)
    • 實例規(guī)格："經(jīng)濟型" (如ecs.e-c1m4.large)
    • 鏡像：Alibaba Cloud Linux
    • 系統(tǒng)盤：40GiB(SSD)
    • 數(shù)據(jù)盤：根據(jù)需要選擇
    • 公網(wǎng)IP：分配公網(wǎng)IPv4地址
    • 帶寬計費模式：按固定帶寬/按使用流量
    • 帶寬值：1～200Mbps
    • 網(wǎng)絡(luò)：選擇"按量付費"或"包年包月"(長期使用)
    • 安全組：新建安全組，開放22(SSH), 80(HTTP), 443(HTTPS)端口
    • 登錄憑證：
    • 登錄名：
    • 密鑰對：
    • 購買實例數(shù)量：
    • 購買時長：
  • ??????記住實例操作系統(tǒng)，不同系統(tǒng)命令行可能會不一樣： 
    Alibaba Cloud Linux 3.2104 LTS 64位
二. 創(chuàng)建安全組
  • 阿里云控制臺??云服務(wù)器ECS??安全組：
    • 安全組名稱：
    • 網(wǎng)絡(luò)：上面創(chuàng)建實例時的網(wǎng)絡(luò)
    • 安全組類型：
    • 訪問規(guī)則：默認添加了幾條入方向規(guī)則，直接使用就行，需要自定義端口的，比如添加臨時測試的端口8080，再新增一條入方向規(guī)則。
      • 授權(quán)策略：允許/禁止
      • 優(yōu)先級：1～100，默認是1，優(yōu)先級最高
      • 協(xié)議類型：TCP/UDP/ICMP/GRE，TCP
      • 端口范圍：比如自定義的8080
      • 授權(quán)對象：一般選所有IPv4(0.0.0.0/0)

配置實例環(huán)境

  • 實例環(huán)境：Alibaba Cloud Linux 3.2104 LTS 64位 Alibaba Cloud Linux 是基于 CentOS/RHEL 的發(fā)行版
  • 登錄阿里云??云服務(wù)器ECS??實例??實例詳情??遠程連接
一.安裝Nginx
  • 方法1. 通過Nginx官方倉庫安裝：
    • 先移除之前可能添加的錯誤倉庫: 
      sudo rm -f /etc/yum.repos.d/nginx.repo
    • 檢查Linux系統(tǒng)版本： 
      cat /etc/alinux-release
    • 添加倉庫配置： 
      sudo tee /etc/yum.repos.d/nginx.repo <<-'EOF'
[nginx-stable]
name=nginx stable repo
baseurl=http://nginx.org/packages/centos/$releasever/$basearch/
gpgcheck=1
enabled=1
gpgkey=https://nginx.org/keys/nginx_signing.key
module_hotfixes=true
EOF
    • 清除舊的Nginx: 
      sudo yum clean all
    • 安裝Nginx: 
      sudo yum install -y nginx
  • 方法2. 使用EPEL倉庫安裝：
    • 安裝EPEL倉庫: 
      sudo yum install -y epel-release
    • 安裝Nginx: 
      sudo yum install -y nginx
  • 方法3. 直接使用Alibaba Cloud Linux默認倉庫:
    • 直接安裝Nginx: 
      sudo yum install -y nginx
二.配置Nginx監(jiān)聽指定端口/域名/IP/代理
  • Nginx主配置文件位置：/etc/nginx/nginx.conf
  • Nginx站點配置文件位置：/etc/nginx/conf.d/default.conf
  • 通過站點配置文件default.conf的server塊配置
  • 鍵入命令sudo vi /etc/nginx/conf.d/default.conf: 
    # 默認的端口監(jiān)聽
server {
  #監(jiān)聽端口80
  listen       80;
  # 監(jiān)聽指定域名
  server_name  xxx.cn yyy.cn www.xxx.cn www.yyy.cn;

  #access_log  /var/log/nginx/host.access.log  main;

  root   /usr/share/nginx/html;
  index  index.html index.htm;#Nginx歡迎頁面
  location / {
      try_files $uri $uri/ =404;
  }

  #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   /usr/share/nginx/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;
  #}
}


# 新增監(jiān)聽 8080 端口的配置（可指向不同目錄）
server {
  listen 8080;
  server_name  xxx.cn yyy.cn www.xxx.cn www.yyy.cn;
   
  root   /usr/share/nginx/html;
  index  index.html index.htm;
  location / {
    # 只是域名訪問網(wǎng)頁，顯示nginx默認或指定的html頁面，而不是代理后端服務(wù)，不需要配置proxy_pass
    # proxy_pass http://127.0.0.1:80;  # 將請求代理到本地 80 端口
    # proxy_set_header Host $host;
    # proxy_set_header X-Real-IP $remote_addr;
      try_files $uri $uri/ =404;
  }
}
  • 測試Nginx配置有沒有錯誤 
    sudo nginx -t
  • 重啟Nginx: 
    sudo systemctl restart nginx
  • 查看是否監(jiān)聽了指定端口80|8080:
    • sudo netstat -tulnp | grep nginx: 
      [root@實例名稱 ~]# sudo netstat -tulnp | grep nginx
tcp        0      0 0.0.0.0:8080            0.0.0.0:*               LISTEN      20792/nginx: master 
tcp        0      0 0.0.0.0:80              0.0.0.0:*               LISTEN      20792/nginx: master
    • 或者 sudo grep listen /etc/nginx/nginx.conf /etc/nginx/conf.d/*.conf: 
      [root@實例名稱 ~]# sudo grep listen   /etc/nginx/nginx.conf   /etc/nginx/conf.d/*.conf
/etc/nginx/conf.d/default.conf:    listen       80;
/etc/nginx/conf.d/default.conf:    # proxy the PHP scripts to Apache   listening on 127.0.0.1:80
/etc/nginx/conf.d/default.conf:    # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
/etc/nginx/conf.d/default.conf:    listen 8080;
  • 測試效果：
    • 公網(wǎng)IP+端口號
    • 已經(jīng)備案的域名 (國內(nèi)基本要備案了，不備案，阿里云會攔截訪問)
  • 如果成功就能看到Nginx的歡迎頁面

常見的配置：

  • server塊的root放在location里面和外面的區(qū)別：
    server/root：設(shè)置的是網(wǎng)站的根路徑，所有l(wèi)ocation塊都繼承
    server/loaction/root：設(shè)置的是location塊中的html的根目錄，相當(dāng)于局部設(shè)置

    server {
    listen       80;
    server_name  www.xxx.cn;
    root /usr/share/nginx/my_web/src;
    index html/index.html;
    location / {
        try_files $uri $uri/ =404;
    }
}

    server {
    listen       80;
    server_name  www.xxx.cn;
    location / {
        root /usr/share/nginx/my_web/src;
        index html/index.html;
        try_files $uri $uri/ =404;
    }
}

  • Nginx配置IP白名單：

     server {
     listen       80;
     server_name  www.xxx.cn;
     # 允許你的 IP（替換為你的公網(wǎng) IP）
     allow 123.123.123.123;  # 你的 IP
     deny all;  # 拒絕其他所有 IP
     root /usr/share/nginx/my_web/src;
     index html/index.html;
     location / {
          try_files $uri $uri/ =404;
     }
}

  • Nginx配置域名白名單：

    server {
    listen 80;
    server_name dev.xxx.cn;  # 僅限測試域名
    root /usr/share/nginx/my_web/src;
    index index.html;
}

  • Nginx攔截指定域名：

    server {
    listen 80;
    server_name xxx1.cn www.xxx2.cn;
    return 403;  # 直接返回 403 禁止訪問
}

  • Nginx攔截所有未匹配的域名：

    server {
    listen 80 default_server;
    return 404;
}

  • HTTP基礎(chǔ)認證(密碼保護): 訪問網(wǎng)站時會彈出登錄框，只有輸入正確的賬號密碼才能訪問。

    • 生成密碼文件： 
      sudo sh -c "echo -n 'username:' >> /etc/nginx/.htpasswd"
sudo sh -c "openssl passwd -apr1 >> /etc/nginx/.htpasswd"
    • 修改Nginx配置： 
      server {
    listen       80;
    server_name  www.xxx.cn;
    root /usr/share/nginx/my_web/src;
    index html/index.html;
    location / {
         auth_basic "Restricted Access";
         auth_basic_user_file /etc/nginx/.htpasswd;
         try_files $uri $uri/ =404;
     }
}

常見的命令：

  • 更新系統(tǒng)包： 
    sudo yum update -y
  • 添加Nginx官方倉庫: 
    sudo tee /etc/yum.repos.d/nginx.repo <<-'EOF'
[nginx-stable]
name=nginx stable repo
baseurl=http://nginx.org/packages/centos/$releasever/$basearch/
gpgcheck=1
enabled=1
gpgkey=https://nginx.org/keys/nginx_signing.key
module_hotfixes=true
EOF
  • 安裝Nginx: 
    sudo yum install -y nginx
  • 啟動Nginx: 
    sudo systemctl start nginx
  • 設(shè)置Nginx開機自啟： 
    sudo systemctl enable nginx
  • 重新加載Nginx: 
    sudo systemctl reload nginx
  • 重啟Nginx: 
    sudo systemctl restart nginx
  • 測試配置語法(比如:編輯/etc/nginx/conf.d/default.conf后，測試有沒有語法錯誤)： 
    sudo nginx -t
  • 卸載Nginx: 
    sudo systemctl stop nginx
sudo yum remove nginx
sudo rm -rf /etc/nginx
  • 檢查Nginx服務(wù)的狀態(tài)： 
    sudo systemctl status nginx # 顯示 active (running)
  • 檢查防火墻狀態(tài)： 
    sudo firewall-cmd --state
  • 如果防火墻有運行，添加指定端口： 
    sudo firewall-cmd --permanent --add-port=指定端口比如8080/tcp
sudo firewall-cmd --reload
  • 檢查公網(wǎng)IP 
    curl ifconfig.me
  • 測試服務(wù)器本地是否可以訪問(換成域名就是測試域名)： 
    curl http://localhost
  • 查看Nginx最新錯誤日志: 
    sudo tail -n 100 /var/log/nginx/error.log
  • 實時滾動查看Nginx錯誤日志: 
    sudo tail -f /var/log/nginx/error.log
  • 查看Nginx最新被訪問日志: 
    sudo tail -n 100 /var/log/nginx/access.log
  • 實時滾動查看Nginx被訪問日志: 
    sudo tail -f /var/log/nginx/access.log
  • 查看站點配置文件/etc/nginx/conf.d/default.conf： 
    sudo vi /etc/nginx/conf.d/default.conf

常見錯誤

問題1. $releasever版本匹配不上：
  • 報錯： 
    Errors during downloading metadata for repository 'nginx-stable':
- Status code: 404 for   http://nginx.org/packages/centos/3/x86_64/repodata/repomd.xml (IP: 3.125.197.172)
Error: Failed to download metadata for repo 'nginx-stable': Cannot download repomd.xml: Cannot download repodata/repomd.xml: All mirrors were tried
  • 原因：這個錯誤是因為Alibaba Cloud Linux 3 的 $releasever 變量被識別為3，而Nginx官方倉庫中沒有為CentOS 3準(zhǔn)備的包（因為 CentOS 3 太舊了）。實際上Alibaba Cloud Linux 3對應(yīng)的是CentOS 8/RHEL 8的兼容版本
  • 解決： http://nginx.org/packages/centos/$releasever/$basearch/改成http://nginx.org/packages/centos/8/$basearch/ 
    sudo tee /etc/yum.repos.d/nginx.repo <<-'EOF'
[nginx-stable]
name=nginx stable repo
baseurl=http://nginx.org/packages/centos/8/$basearch/
gpgcheck=1
enabled=1
gpgkey=https://nginx.org/keys/nginx_signing.key
module_hotfixes=true
EOF

問題2. 瀏覽器緩存不更新：

  • 現(xiàn)象：
    文件更新到服務(wù)器了，也重啟了Nginx，瀏覽網(wǎng)頁效果沒變，打開控制臺，發(fā)現(xiàn)更新的css，js等靜態(tài)資源，仍然顯示的是未更新之前的。
  • 原因：
    瀏覽器會緩存 CSS、JS 等靜態(tài)資源，加快加載速度。如果你部署了新版本，但文件名不變，瀏覽器可能直接使用了舊的緩存。
  • 解決：
    • 強制刷新頁面：按 Ctrl + Shift + R（Windows）或Cmd + Shift + R（Mac）
    • 清除瀏覽器緩存：進入瀏覽器設(shè)置 → 隱私 → 清除緩存
    • 改文件名或加版本號，例如：
      每次部署時更改 v 值，可以強制瀏覽器重新拉取。 
      <link rel="stylesheet" href="/css/style.css?v=20240520">
    • 如果服務(wù)器(Nginx）配置了強緩存規(guī)則，會讓瀏覽器長時間緩存舊資源:
      • 查看站點配置文件default.conf的server塊配置： 
        sudo vi /etc/nginx/conf.d/default.conf
      • 找到強緩存規(guī)則： 
        location ~* \.(css|js|jpg|jpeg|png|gif|ico)$ {
      expires 30d;
      add_header Cache-Control "public";
}
      • 改為緩存更新了，再改過來，不然網(wǎng)頁的刷新效果會非常不好： 
        location ~* \.(css|js|jpg|jpeg|png|gif|ico)$ {
      expires -1;
      add_header Cache-Control "no-cache";
}
      • 再重啟： 
        sudo nginx -t
sudo systemctl restart nginx

把項目部署到服務(wù)

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容