nginx区分pc端还是移动端展示不同页面

最新推荐文章于 2024-10-02 13:14:03 发布

Ang-l

最新推荐文章于 2024-10-02 13:14:03 发布

阅读量5.1k

点赞数 1

分类专栏： nginx 文章标签： nginx 运维

本文链接：https://blog.csdn.net/m0_47202787/article/details/118970264

版权

nginx 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

本文介绍了如何通过Nginx配置实现PC和移动端访问不同的网站，以提供更佳的用户体验。当用户使用PC或移动设备访问时，Nginx将自动识别设备类型并跳转到相应版本的网站。这允许针对不同设备定制内容，但同时也需要维护两套独立的网站代码。示例配置展示了如何设置Nginx以区分并重定向到/home/pc/（PC版）和/home/dist/（移动版）目录。

摘要由CSDN通过智能技术生成

nginx区分pc端还是移动端展示不同页面

近几年来，随着手机和pad的普及，越来越多的用户选择使用移动客户端访问网站，而为了获取更好的用户体验，就需要针对不同的设备显示出最合适的匹配，这样就是近年来流行的“响应式web设计”。
响应式web设计是一种纯前端技术js、css等实现的针对不同设备访问同一网址看到不同的布局，是页面内容更适合当前设备阅读。但这个不是本文的重点，重点还是放在nginx如何实现上来。

本文要讲的的是如何使用nginx区分pc和手机访问不同的网站，是物理上完全隔离的两套网站(一套移动端、一套pc端),这样带来的好处pc端和移动端的内容可以不一样，移动版网站不需要包含特别多的内容，只要包含必要的文字和较小的图片，这样会更节省流量。有好处当然也就会增加困难，难题就是你需要维护两套环境，并且需要自动识别出来用户的物理设备并跳转到相应的网站，当判断错误时用户可以自己手动切换回正确的网站

有两套网站代码，一套PC版放在/home/pc/，一套移动版放 /home/dist/

 location / {
                root /home/pc/; # 默认为pc
                if ( $http_user_agent ~ "(MIDP)|(WAP)|(UP.Browser)|(Smartphone)|(Obigo)|(Mobile)|(AU.Browser)|		(wxd.Mms)|(WxdB.Browser)|(CLDC)|(UP.Link)|(KM.Browser)|(UCWEB)|(SEMC-Browser)|(Mini)|(Symbian)|(Palm)|(Nokia)|(Panasonic)|(MOT-)|(SonyEricsson)|(NEC-)|(Alcatel)|(Ericsson)|(BENQ)|(BenQ)|(Amoisonic)|(Amoi-)|(Capitel)|(PHILIPS)|(SAMSUNG)|(Lenovo)|(Mitsu)|(Motorola)|(SHARP)|(WAPPER)|(LG-)|(LG/)|(EG900)|(CECT)|(Compal)|(kejian)|(Bird)|(BIRD)|(G900/V1.0)|(Arima)|(CTL)|(TDG)|(Daxian)|(DAXIAN)|(DBTEL)|(Eastcom)|(EASTCOM)|(PANTECH)|(Dopod)|(Haier)|(HAIER)|(KONKA)|(KEJIAN)|(LENOVO)|(Soutec)|(SOUTEC)|(SAGEM)|(SEC-)|(SED-)|(EMOL-)|(INNO55)|(ZTE)|(iPhone)|(Android)|(Windows CE)|(Wget)|(Java)|(curl)|(Opera)" )
                {
                		root /home/dist/;
        		}
        }