Nginx 代理缓存 WordPress 网站,区分移动端与 PC 端页面

Nginx 代理缓存 WordPress 网站,区分移动端与 PC 端页面

一些网站未使用响应式设计,当 WordPress 网站的移动端与 PC 端内容不完全一致时,可以使用 Nginx 分别缓存两者的页面。本文介绍了如何配置 Nginx 的 FastCGI 或反向代理缓存来实现这一目标。

前提条件

确保你已经在服务器上安装并配置好了 Nginx 和 PHP-FPM。

用户代理检测

首先,使用 Nginx 指令检测用户代理,将其分类为移动端或桌面端。以下是一个示例配置:

map $http_user_agent $mobile_user {
    default "ZHANZHANGB_DESKTOP";

    # 检测包含以下关键字的User-Agent字符串
    ~*(android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)|
       plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino)
    "ZHANZHANGB_MOBILE";

    # 一些具体的浏览器或设备
    ~*tablet "ZHANZHANGB_MOBILE"; # 如果需要区分平板设备
    ~*chrome "ZHANZHANGB_DESKTOP";
    ~*firefox "ZHANZHANGB_DESKTOP";
    ~*safari "ZHANZHANGB_DESKTOP";
    ~*edge "ZHANZHANGB_DESKTOP";
}

配置缓存键

然后,修改缓存键,以便区分桌面和移动用户:

location ~ \.php$ {
    try_files $uri =404;
    add_header WP-Zhanzhangb-Fastcgi-Cache $upstream_cache_status;
    add_header WP-Zhanzhangb-Skip $skip_reason;
    add_header X-Exception $exception;
    include fastcgi_params;
    fastcgi_pass unix:/run/php/php7.3-fpm.sock;
    fastcgi_split_path_info ^(.+\.php)(.*)$;
    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    fastcgi_cache_bypass $http_secret_header $skip_cache;
    fastcgi_no_cache $skip_cache;
    fastcgi_cache WORDPRESS;
    fastcgi_cache_key "$scheme$request_method$host$mobile_user$request_uri";
    fastcgi_cache_valid 404 1m;
    fastcgi_cache_valid 60m;
}

Nginx 反向代理和缓存

Nginx 反向代理(Reverse Proxy)是一种常用的服务器配置,它可以将客户端请求转发给后端服务器。通过使用反向代理,可以增强网站的性能、安全性和可伸缩性。反向代理缓存(Proxy Cache)则是在 Nginx 层面缓存后端服务器的响应,减少后端服务器的负载,提高响应速度。

反向代理配置示例

以下是一个基本的 Nginx 反向代理配置示例:

server {
    listen 80;
    server_name example.com;

    location / {
        proxy_pass http://backend_server;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

配置反向代理缓存

为了启用反向代理缓存,可以在反向代理配置的基础上,添加缓存相关的指令:

proxy_cache_path /var/cache/nginx levels=1:2 keys_zone=WORDPRESS:10m inactive=60m use_temp_path=off;

server {
    listen 80;
    server_name example.com;

    location / {
        proxy_cache WORDPRESS;
        proxy_cache_valid 200 302 60m;
        proxy_cache_valid 404 1m;
        proxy_pass http://backend_server;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        add_header X-Proxy-Cache $upstream_cache_status;
    }
}

以上配置将启用反向代理缓存,并在响应头中添加 X-Proxy-Cache 来指示缓存状态。

自定义日志

为更好地跟踪移动端和桌面端的访问,可以自定义 Nginx 访问日志格式:

http {
    log_format customuseragent '[$time_local] $remote_addr $upstream_cache_status $mobile_user $request_method "$request_uri" $upstream_response_time';
    access_log /var/log/nginx/customuseragent.log customuseragent;
}

重启 Nginx 后,使用以下命令查看自定义日志:

tail -f /var/log/nginx/customuseragent.log

日志输出示例

你会看到类似以下的日志输出:

 
[04/Apr/2020:13:41:10 +0000] 123.119.135.210 MISS ZHANZHANGB_MOBILE GET "/" 0.272
[04/Apr/2020:13:41:11 +0000] 123.119.135.210 MISS ZHANZHANGB_MOBILE GET "/wordpress?lang=" 0.076
[04/Apr/2020:13:41:18 +0000] 123.119.135.210 - ZHANZHANGB_DESKTOP POST "/wp-admin/admin-ajax.php" 0.072
[04/Apr/2020:13:41:19 +0000] 86.101.236.78 HIT ZHANZHANGB_MOBILE GET "/" -
[04/Apr/2020:13:41:20 +0000] 86.101.236.78 HIT ZHANZHANGB_MOBILE GET "/wordpress?lang=" -

通过以上配置,Nginx 将分别缓存移动端和桌面端的页面,并通过反向代理提高网站的访问速度和用户体验。

如果要添加一些增强安全性的HTTP标头,可参考:Wordpress的Nginx伪静态规则与常规安全设置。

© 版权声明
THE END
喜欢就支持一下吧
点赞9 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容