如何在Apache網站伺服器上使用Vultr CDN

Apache 是一個網路伺服器應用程式，使用您的域名 URL 託管和交付網路應用程式。向 Apache 網路伺服器發出的每個請求都會增加伺服器負載，並影響網路應用程式的總體效能。通過整合 Vultr CDN URL，Web 伺服器會使用你的 CDN 傳送特定請求，從而加快你的 Web 應用程式內容交付過程。

本文將介紹如何在 Apache 網路伺服器上使用 Vultr CDN。您將設定 Apache 虛擬主機配置，將特定請求模式轉發到 Vultr CDN URL，同時在源伺服器 URL 上保持較輕的請求。

準備工作

開始之前：

• 使用 Vultr Marketplace 應用程式部署 LAMP 伺服器。
• 設定指向公共伺服器 IP 地址的域 A 記錄。
• 以具有 sudo 許可權的非 root 使用者身份使用 SSH 訪問伺服器。

定位 Apache 虛擬主機配置

1. 測試 Apache 配置是否存在錯誤。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ apachectl configtest

   $ apachectl configtest

   $ apachectl configtest
   

2. 切換到 Apache 資料主目錄。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ cd /etc/apache2/

   $ cd /etc/apache2/

   $ cd /etc/apache2/
   

3. 使用您的域名搜尋 Apache 目錄中的所有檔案，以驗證活動虛擬主機配置檔案。用您的實際域名替換 example.com。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ grep -r "example.com" /etc/apache2/

   $ grep -r "example.com" /etc/apache2/

   $ grep -r "example.com" /etc/apache2/
   

   Output:

   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   /etc/apache2/sites-available/example.com.conf: ServerName www.example.com

   /etc/apache2/sites-available/example.com.conf: ServerName www.example.com

   /etc/apache2/sites-available/example.com.conf:  ServerName www.example.com

   上述輸出返回 example.conf 作為與 example.com 域相關的活動虛擬主機配置檔案。預設情況下，如果伺服器上沒有可用的虛擬主機配置，Apache 會使用 /etc/apache2/sites-available/000-default.conf 檔案。

4. 檢視虛擬主機配置檔案並驗證工作中的 DocumentRoot 目錄。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ cat /etc/apache2/sites-available/example.com.conf | grep DocumentRoot

   $ cat /etc/apache2/sites-available/example.com.conf | grep DocumentRoot

   $ cat /etc/apache2/sites-available/example.com.conf | grep DocumentRoot
   

   Output:

   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   DocumentRoot /var/www/html

   DocumentRoot /var/www/html

   DocumentRoot /var/www/html

5. 切換到文件根目錄。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ cd /var/www/html/

   $ cd /var/www/html/

   $ cd /var/www/html/
   

6. 建立一個新的 images 目錄來測試 Apache 請求模式。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ sudo mkdir images

   $ sudo mkdir images

   $ sudo mkdir images
   

7. 切換到目錄。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ cd images

   $ cd images

   $ cd images
   

   將樣本檔案上傳到該目錄，以測試 Apache 的請求模式。

方法 1：設定修改響應

Apache 響應修改會匹配請求，並將原始請求 URL 修改為 Vultr CDN URL。響應修改過程使用 mod_substitute 和 mod_filter 模組來過濾和修改指向你的 Vultr CDN URL 的請求。請按照以下步驟設定響應修改，並將請求模式轉發到你的 Vultr CDN。

1. 啟用 Apache mod_substitute 模組。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ sudo a2enmod substitute

   $ sudo a2enmod substitute

   $ sudo a2enmod substitute
   

   輸出:

   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   Enabling module substitute.

   To activate the new configuration, you need to run:

   systemctl restart apache2

   Enabling module substitute. To activate the new configuration, you need to run: systemctl restart apache2

   Enabling module substitute.
   To activate the new configuration, you need to run:
   systemctl restart apache2

2. 啟用 Apache mod_filter 模組，按 MIME 型別過濾請求。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ sudo a2enmod filter

   $ sudo a2enmod filter

   $ sudo a2enmod filter
   

3. 重啟 Apache 以啟用模組。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ sudo systemctl restart apache2

   $ sudo systemctl restart apache2

   $ sudo systemctl restart apache2
   

4. 使用 Nano 等文字編輯器開啟 Apache 虛擬主機配置檔案。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ sudo nano /etc/apache2/sites-available/example.com.conf

   $ sudo nano /etc/apache2/sites-available/example.com.conf

   $ sudo nano /etc/apache2/sites-available/example.com.conf
   

5. 在檔案的 </VirtualHost> 指令之前新增以下配置。用實際值替換 example.com 和 cdn-example88.vultrcdn.com。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   AddOutputFilterByType SUBSTITUTE text/html

   Substitute s|example.com/images/|cdn-example88.vultrcdn.com/images/|i

   Substitute s|example.com/css/|cdn-example88.vultrcdn.com/css/|i

   Substitute s|example.com/js/|cdn-example88.vultrcdn.com/js/|i

   AddOutputFilterByType SUBSTITUTE text/html Substitute s|example.com/images/|cdn-example88.vultrcdn.com/images/|i Substitute s|example.com/css/|cdn-example88.vultrcdn.com/css/|i Substitute s|example.com/js/|cdn-example88.vultrcdn.com/js/|i

   AddOutputFilterByType SUBSTITUTE text/html
   Substitute s|example.com/images/|cdn-example88.vultrcdn.com/images/|i
   Substitute s|example.com/css/|cdn-example88.vultrcdn.com/css/|i
   Substitute s|example.com/js/|cdn-example88.vultrcdn.com/js/|i
   

   儲存並關閉檔案。

   上述響應修改配置可匹配 images, css 或 js 目錄模式下的所有請求。匹配請求模式下的所有檔案都會被修改為 Vultr CDN URL。例如，請求 example.com/images/image.png 會被修改為 cdn-example88.vultrcdn.com/images/image.png 。在配置中：

   AddOutputFilterByType：按 MIME 型別過濾請求模式。 /text/html 匹配 HTML 請求，包括影象、樣式表和指令碼等嵌入元素。其他 MIME 型別包括

   •  text/css,application/javascript,application/custom,image/jpg,image/png, image/webp

   ，可根據網路應用程式結構過濾請求。

   • Substitute s|.....|...|:

   轉換源 s| URL 以匹配目標 | Vultr CDN URL。例如， Substitute s|example.com/images/|cdn-example88.vultrcdn.com/images/|i 將 example.com/images 請求模式修改為你的 Vultr CDN URL cdn-example88.vultrcdn.com/images。
   $1：載入初始請求型別，以匹配正確的 Vultr CDN URL。
   |i : 匹配請求模式中的所有大小寫格式。例如， example.com/images/IMAGE.png 和 example.com/images/logo.png 都會被修改為相應的 Vultr CDN URL。

   要在配置中匹配其他請求模式，可新增新的 Substitute 指令，將請求模式修改為 Vultr CDN URL。修改後的 Apache 虛擬主機配置應如下所示：

   APACHECONFCopy

   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   <VirtualHost *:80>

   <Directory /var/www/html/>

   Options -Indexes

   Require all granted

   </Directory>

   ServerName example.com

   DocumentRoot /var/www/html

   DirectoryIndex index.htm index.html

   AddOutputFilterByType SUBSTITUTE text/html

   Substitute s|example.com/images/|cdn-example88.vultrcdn.com/images/|i

   Substitute s|example.com/css/|cdn-example88.vultrcdn.com/css/|i

   Substitute s|example.com/js/|cdn-example88.vultrcdn.com/js/|i

   </VirtualHost>

   <VirtualHost *:80> <Directory /var/www/html/> Options -Indexes Require all granted </Directory> ServerName example.com DocumentRoot /var/www/html DirectoryIndex index.htm index.html AddOutputFilterByType SUBSTITUTE text/html Substitute s|example.com/images/|cdn-example88.vultrcdn.com/images/|i Substitute s|example.com/css/|cdn-example88.vultrcdn.com/css/|i Substitute s|example.com/js/|cdn-example88.vultrcdn.com/js/|i </VirtualHost>

   <VirtualHost *:80>
   <Directory /var/www/html/>
   Options -Indexes
   Require all granted
   </Directory>
   ServerName example.com
   DocumentRoot /var/www/html
   DirectoryIndex index.htm index.html
   AddOutputFilterByType SUBSTITUTE text/html
   Substitute s|example.com/images/|cdn-example88.vultrcdn.com/images/|i
   Substitute s|example.com/css/|cdn-example88.vultrcdn.com/css/|i
   Substitute s|example.com/js/|cdn-example88.vultrcdn.com/js/|i
   </VirtualHost>
   

6. 測試 Apache 配置是否存在錯誤。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ apachectl configtest

   $ apachectl configtest

   $ apachectl configtest
   

7. 重啟 Apache 以應用配置更改。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ sudo systemctl restart apache2

   $ sudo systemctl restart apache2

   $ sudo systemctl restart apache2
   

方法 2：設定重定向

Apache 會使用 mod_rewite 模組將原始請求 URL 重寫為 Vultr CDN URL，從而重定向特定請求型別。每個請求模式都會被重定向到相應的 Vultr CDN URL，該 URL 會根據請求提供快取資料。例如，請求 example.com/image.png 會重定向到 CDN URL cdn-example88.vultrcdn.com/image.png。請按照以下步驟將特定請求模式重定向到你的 Vultr CDN URL。

1. 啟用 Apache mod_rewrite 模組。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ sudo a2enmod rewrite

   $ sudo a2enmod rewrite

   $ sudo a2enmod rewrite
   

   輸出:

   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   Enabling module rewrite.

   To activate the new configuration, you need to run:

   systemctl restart apache2

   Enabling module rewrite. To activate the new configuration, you need to run: systemctl restart apache2

   Enabling module rewrite.
   To activate the new configuration, you need to run:
   systemctl restart apache2

2. 重啟 Apache 網路伺服器以啟用模組。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ sudo systemctl restart apache2

   $ sudo systemctl restart apache2

   $ sudo systemctl restart apache2
   

3. 開啟 Apache 虛擬主機配置檔案。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ sudo nano /etc/apache2/sites-available/example.com.conf

   $ sudo nano /etc/apache2/sites-available/example.com.conf

   $ sudo nano /etc/apache2/sites-available/example.com.conf
   

   •  在檔案的 </VirtualHost> 指令之前新增以下配置。用實際值替換 example.com 和 cdn.example88.vultrcdn.com 。
     Plain text

     Copy to clipboard

     Open code in new window

     EnlighterJS 3 Syntax Highlighter

     RewriteEngine On

     RewriteCond %{HTTP_HOST} ^example.com

     RewriteRule \.(jpg|jpeg|png|gif|webp|css|js|scss|svg|pdf|txt)$ https://cdn-example88.vultrcdn.com%{REQUEST_URI} [L,R=301]

     RewriteEngine On RewriteCond %{HTTP_HOST} ^example.com RewriteRule \.(jpg|jpeg|png|gif|webp|css|js|scss|svg|pdf|txt)$ https://cdn-example88.vultrcdn.com%{REQUEST_URI} [L,R=301]

     RewriteEngine On
     RewriteCond %{HTTP_HOST} ^example.com
     RewriteRule \.(jpg|jpeg|png|gif|webp|css|js|scss|svg|pdf|txt)$ https://cdn-example88.vultrcdn.com%{REQUEST_URI} [L,R=301]
     

     儲存並關閉檔案。

     上述配置會將所有符合  .jpeg, .jpg, .png,,.webp,.js,.css  檔案型別的請求重定向到 Vultr CDN URL。在配置中

     RewriteEngine On： 啟用 Apache mod_rewrite 模組。
     RewriteCond %{HTTP_HOST} ： 設定請求重寫條件，以匹配主機域名 URL 模式。
     RewriteRule：以正規表示式格式定義重寫匹配請求模式的重定向規則。

     • \.(jpg|jpeg|png|gif|webp|css|js|scss|svg|pdf|txt)

     值會將所有宣告檔案型別的請求匹配到你的 Vultr CDN URL。例如，請求 https://example.com/image.png 會重定向到 https://cdn-example88.vultrcdn.com/image.png。
     [R=301,L]：永久重定向所有匹配請求到你的 Vultr CDN URL，狀態程式碼為 301 Moved Permanently。L 設定重定向條件 last 重定向，不需要額外的重寫規則。

     修改後的 Apache 虛擬主機配置應如下所示：

      

     Plain text

     Copy to clipboard

     Open code in new window

     EnlighterJS 3 Syntax Highlighter

     <VirtualHost *:80>

     <Directory /var/www/html/>

     Options -Indexes

     Require all granted

     </Directory>

     ServerName example.com

     DocumentRoot /var/www/html

     DirectoryIndex index.htm index.html

     RewriteEngine On

     RewriteCond %{HTTP_HOST} ^example.com

     RewriteRule \.(jpg|jpeg|png|gif|webp|css|js|scss|svg|pdf|txt)$ https://cdn-example88.vultrcdn.com%{REQUEST_URI} [L,R=301]

     </VirtualHost>

     <VirtualHost *:80> <Directory /var/www/html/> Options -Indexes Require all granted </Directory> ServerName example.com DocumentRoot /var/www/html DirectoryIndex index.htm index.html RewriteEngine On RewriteCond %{HTTP_HOST} ^example.com RewriteRule \.(jpg|jpeg|png|gif|webp|css|js|scss|svg|pdf|txt)$ https://cdn-example88.vultrcdn.com%{REQUEST_URI} [L,R=301] </VirtualHost>

     <VirtualHost *:80>
     <Directory /var/www/html/>
     Options -Indexes
     Require all granted
     </Directory>
     ServerName example.com
     DocumentRoot /var/www/html
     DirectoryIndex index.htm index.html
     RewriteEngine On
     RewriteCond %{HTTP_HOST} ^example.com
     RewriteRule \.(jpg|jpeg|png|gif|webp|css|js|scss|svg|pdf|txt)$ https://cdn-example88.vultrcdn.com%{REQUEST_URI} [L,R=301]
     </VirtualHost>
     

4. 測試 Apache 配置是否存在錯誤。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ apachectl configtest

   $ apachectl configtest

   $ apachectl configtest
   

5. 重新啟動 Apache 網路伺服器以應用配置更改。
   Plain text

   Copy to clipboard

   Open code in new window

   EnlighterJS 3 Syntax Highlighter

   $ sudo systemctl restart apache2

   $ sudo systemctl restart apache2

   $ sudo systemctl restart apache2
   

小結

您已經設定了 Apache 網路伺服器，將請求模式轉發到 Vultr CDN URL。根據您的主機環境，您可以在 .htaccess 檔案或虛擬主機配置檔案中應用請求轉發規則，以提高網路應用程式的效能和使用者體驗。對於每種配置方法，請檢視瀏覽器開發工具並導航到網路或來源選項卡，以驗證由 Vultr CDN URL 交付的所有檔案。