nginx设置电脑手机访问相同网址页面不同

先来个预览效果:

原理:根据用户请求,在nginx中会判断用户请求终端是什么设备,默认不做处理,这里我们添加if语句判断,符合规则后端指向指定路径

打开nginx配置文件

}
    server {
        listen       80;
        server_name  www.test.com;
        charset utf-8;
        access_log  /var/log/nginx/www_test_com.access.log;
        location / {
        root     /home/prod/;
    if ($http_user_agent ~* ‘(Android|webOS|iPhone|iPod|BlackBerry)‘) {
            root /home/prod/mobile/;
        }

        }
        location /nginxstatus {
            stub_status on;
            access_log on;
        }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

    }

通过$http_user_agent来判断终端设备类型,

root /home/prod/mobile/                 #符合规则后端跳转路径

设置完成后我们修改本地hosts文件,把我们自定义的域名设置上,然后我们浏览器访问,我使用的是谷歌浏览器,谷歌浏览器有一个模拟手机用户的功能,鼠标右键,检查,左上角有一个手机标志,点击下页面就变成手机终端

原文地址:https://www.cnblogs.com/yangzhaon/p/12652437.html

时间: 2024-11-11 22:03:51

nginx设置电脑手机访问相同网址页面不同的相关文章

同一个网址,电脑手机访问显示不同的内容(Apache配置)

一.需求概述: 用户访问一个网址 https://www.xxx.com,如果是移动设备访问,跳转到移动端的页面 https://www.xxx.com/mobile:如果是电脑访问,则跳转到pc端页面 https://www.xxx.com. 二. 实现逻辑: 默认 https://www.xxx.com入口为pc端静态资源,添加配置获取用户设备,如果是移动设备则redirect到移动端静态资源 https://www.xxx.com/mobile. 三.具体实现: 3.1  服务器上放置2套

nginx 设置网站目录访问验证方法【转载】

为网站目录设置访问验证之后我们就是进入此页面都需要输入验证密码才可以,下面我来介绍nginx中配置目录访问验证码方法总结. 1.创建类htpasswd文件 执行:  代码如下 复制代码 wget -c soft.vpser.net/lnmp/ext/htpasswd.sh;bash htpasswd.sh 按提示输入用户名.密码.及认证文件名.脚本会自动生成认证文件.记录下脚本返回的文件路径.如:/usr/local/nginx/conf/vpser.net.auth. 2.为Nginx添加au

利用JS实现手机访问PC网址自动跳转到wap网站

方法一:使用百度siteapp中的js进行判断 <script src="http://siteapp.baidu.com/static/webappservice/uaredirect.js" type="text/javascript"></script><script type="text/javascript">uaredirect("需要跳转的手机网址")</script&g

nginx + tomcat 架构中,error_page错误页面的设置

如果是单独的nginx设置404或者403等错误页面时,只需要如下即可: fastcgi_intercept_errors on:       error_page 404  /404.html: 但是,如果nginx为后台tomcat做代理时,上述方法就搞不定了,那要如何,如下: proxy_intercept_errors on:   #有意思的是,这个开关默认是关闭的,所以得配置打开 error_page 404 /404.html: nginx为tomcat做代理时,404或者403等错

简单的手机访问电脑文件方法,方便写完页面即使在移动端测试效果,不使用模拟器就能玩了

手机想测问电脑写好的页面文件时,这时部分人人会想到,拷内存卡,拷优盘,直接拷手机里(当然了 用模拟器的话这里就例外了),.....普通人一般用这些复制来复制去的方法,作为一个程序员,不自觉的就感觉,这好麻烦啊,或者说好low的操作方法啊....作为一个懂电脑的人,当然不能靠这种方法了,至少不能用数据先了,优盘了,内存卡了这些媒介来拷贝吧,有些人就想了,那我打开笔记本的蓝牙,wifi把文件传手机上,至少看起来没用最low的方法,但是这依然不符合我们的风格啊. 那还想怎么玩呢?直接访问电脑文件!说到

手机访问电脑wampServer本地环境页面

1.  电脑需要安装好wamp,我这里用的2.0版本,下载地址   http://pan.baidu.com/s/1jG31hbS 2. 电脑需要有个wifi,我用的360wifi 3. 启动wamp后,在电脑本地可以通过127.0.0.1访问到本地的项目 4. 用手机连接360wifi后,访问内网ip,也就是电脑的ip地址.这时可能会出现403,解决办法如下: 我用的wamp2.0此方法可行 找到Apache下的 httpd.conf 然后查找Directory这个词开头的 1.将Allow

【转】Nginx区分PC或手机访问不同网站

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

Nginx区分PC或手机访问不同网站

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

真实手机访问本地电脑网站失败的原因

最近做了一个网站,想用真实手机访问进行调试,但是访问时却提示无法连接,不能打开网站,这是什么原因,百思不得其解,因为手机是可以通过WiFi上网的,电脑虽然是通过网线上网,但都使用同一个路由器,而权限方面并没有做任何限制.之后通过几步检测,终于找到了原因,并解决了问题. 1.测试局域网能否连通 检测的第一步是测试局域网能否连通.这里需要另一台局域网电脑来测试,测试的方法是在电脑里ping一下本机IP. 网络连通性测试 能ping通就表示网络是连通的. 2.检测局域网能否访问共享 测试访问共享的方法