场景

域名 描述
pc端 www.one.com 用于pc端访问官网
移动端 m.one.com 用于移动端访问

现在的需求是这样,在pc端访问www.one.comm.one.com都跳转到www.one.com
而在移动端访问www.one.comm.one.com都跳转到m.one.com

参考,github上的这篇文章很详细,但是比较复杂,很多场景我们用不到,所以参考这个,我修改如下。

pc端:www.one.com

  server {
listen 80;
server_name www.one.com; #charset koi8-r;
#access_log logs/host.access.log main;
# 下面根据user_agent可以获取
if ($http_host !~ "^www.one.cn$") {
rewrite ^(.*) http://www.one.cn$1 permanent;
}
if ($http_user_agent ~* (mobile|nokia|iphone|ipad|android|samsung|htc|blackberry)) {
rewrite ^(.*) http://m.one.com$1 permanent;
}
location / {
root /home/build/rampage-home-front/dist/html;
index index.html index.htm;
} }

作用部分代码如下:

 if ($http_host !~ "^www.one.cn$") {
rewrite ^(.*) http://www.one.cn$1 permanent;
}
if ($http_user_agent ~* (mobile|nokia|iphone|ipad|android|samsung|htc|blackberry)) {
rewrite ^(.*) http://m.one.com$1 permanent;
}

移动端:m.one.com

  server {
listen 80;
server_name m.one.cn; #charset koi8-r;
#access_log logs/host.access.log main;
#非移动端跳转到 www.one.com
if ($http_user_agent !~* (mobile|nokia|iphone|ipad|android|samsung|htc|blackberry)) {
rewrite ^(.*) http://www.one.com$1 permanent;
} location / {
root /home/build/rampage-mobile-front/dist;
index index.html index.htm;
}
}

作用部分代码如下:

 if ($http_user_agent !~* (mobile|nokia|iphone|ipad|android|samsung|htc|blackberry)) {
rewrite ^(.*) http://www.one.com$1 permanent;
}

至此完成了相关配置

实例配置:

PC端网站配置文件

 server {
listen 80 default_server;
listen [::]:80 default_server;
server_name weifeng.com;
root /usr/share/nginx/html;
rewrite ^(.*)$ https://${server_name}$1 permanent; include /etc/nginx/default.d/*.conf; if ($http_user_agent ~* (mobile|nokia|iphone|ipad|android|samsung|htc|blackberry)) {
rewrite ^(.*) https://m.weifeng.com$1 permanent;
} location / {
} error_page 404 /404.html;
location = /40x.html {
} error_page 500 502 503 504 /50x.html;
location = /50x.html {
}
} server {
listen 443;
server_name weifeng.com;
ssl on;
root /usr/share/nginx/html;
index index.html index.htm;
ssl_certificate /cert/weifeng.com.pem;
ssl_certificate_key /cert/weifeng.com.key;
ssl_session_timeout 5m;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_server_ciphers on; if ($http_user_agent ~* (mobile|nokia|iphone|ipad|android|samsung|htc|blackberry)) {
rewrite ^(.*) https://m.weifeng.com$1 permanent;
} location / {
root /usr/share/nginx/html;
index index.html index.htm;
}
}

  

移动端nginx配置文件

    server {
listen 80;
server_name m.weifeng.com;
root /usr/share/nginx/html-mobile;
rewrite ^(.*)$ https://${server_name}$1 permanent; location / {
} error_page 404 /404.html;
location = /40x.html {
} error_page 500 502 503 504 /50x.html;
location = /50x.html {
}
} server { listen 443;
server_name m.weifeng.com;
ssl on;
root /usr/share/nginx/html-mobile;
index index.html index.htm;
ssl_certificate /cert/weifeng.com.pem;
ssl_certificate_key /cert/weifeng.com.key;
ssl_session_timeout 5m;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_server_ciphers on; location / {
root /usr/share/nginx/html-mobile;
index index.html index.htm;
}
}

  

nginx 移动端和pc端自动跳转的更多相关文章

  1. asp.net Core 使用过滤器判断请求客户端是否为移动端,并实现PC端和移动端请求映射和自动跳转

    很多时候我们做网站时单纯的用bootstrap等前端框架实现的前端自适应带给用户的体验并不太好,所以为了提高用户体验会专门针对PC端网页重新设计一套移动端网页,但是怎么才能做到在移动端访问PC页面的时 ...

  2. 【Javascript Demo】移动端访问PC端网页时跳转到对应的移动端网页

    不想通过CSS自适应在PC端和移动端分别显示不同的样式,那么只能通过在移动端访问PC端网页时跳转到对应的移动端网页了,那么怎么跳转呢,网上也有很多文章说明,下面是本人测试有效的方式. 1.效果图 PC ...

  3. iis 如何搭建url 重定向,实现无线端和pc端不同的跳转

    第一步,下载安装ARR(Application Request Routing), http://www.iis.net/downloads/microsoft/application-request ...

  4. JavaScript判断移动端及pc端访问不同的网站

    JavaScript判断移动端及pc端访问不同的网站 现在很多网站都是分为两个版本,一个pc端的一个移动端的(响应式除外),针对这两个版本,就需要对访问的设备进行判断,如果是pc,就直接访问pc网站, ...

  5. js判断是移动端还是pc端

    运行页面的时候,执行到js会判断来自于移动端还是pc端,如果是移动端则跳转制定链接地址,这样在手机端会有额外的不必要浪费的加载时间 var browser={ versions:function(){ ...

  6. js常见的判断移动端或者pc端或者安卓和苹果浏览器的方法总结

    1.js常见的判断移动端或者pc端或者安卓和苹果浏览器的方法总结 : http://www.haorooms.com/post/js_pc_iosandmobile 2.Js判断客户端是否为PC还是手 ...

  7. js判断移动端还是PC端

    function isMobile(){ var sUserAgent= navigator.userAgent.toLowerCase(), bIsIpad= sUserAgent.match(/i ...

  8. js判断游览器是移动端还是PC端

    js判断网页游览器是移动端还是PC端 <script type="text/javascript"> function browserRedirect() { var ...

  9. 检测当前运行环境——移动端与PC端。

    方法1: $(function checkBrowser(){ var browser={ versions:function(){ var u = navigator.userAgent, app ...

  10. 关于移动端和PC端的交互的区别

    对于现在的移动端设备的普及,移动端上的用户体验成了一个重要的关注点. 看了一些网上的关于移动端的交互和用户体验的知识,这里总结了一些.若有不足的地方,希望大家能够积极补充. PC端和移动端的产品的设计 ...

随机推荐

  1. wordpress在首页列出所有分类及分类下的文章

    前面我们谈了wordpress调用指定分类文章,如果想要调用所有分类的文章如何实现呢?比如在wordpress首页列出所有分类及分类下的文章,其实方法类似 <?php $cats = get_c ...

  2. trait Monad:函数式编程类型系统本博客搜索关键字--类型升降

    trait Monad:函数式编程类型系统本博客搜索关键字--类型升降

  3. Oracle逻辑导入数据(IMP/IMPDP)

    使用IMPDP导入数据的前提是数据是使用EMPDP导出的,同样也是在DOS窗口下直接输入IMPDP和登录数据库的用户名,即可导人数据. impdp导到指定用户下: impdp student/1234 ...

  4. LeetCode 531. Lonely Pixel I

    原题链接在这里:https://leetcode.com/problems/lonely-pixel-i/ 题目: Given a picture consisting of black and wh ...

  5. 常见WinDbg问题及解决方案

    当你调试一个程序时,你最不想处理的是调试器不能正常工作.当你试图集中精力跟踪一个bug时,总是会因为次要的问题而被忽略,尤其是当调试器的问题导致你失去一个重新编程或者浪费了大量的时间等待调试器完成它, ...

  6. MVC框架与增强

    一.什么是MVC MVC全名是Model View Controller,是模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范,用一种业务逻辑.数据.界面显示 ...

  7. [RN] React Native 图片懒加载库 animated-lazy-image

    React Native 图片懒加载库 animated-lazy-image 官方Github地址: https://github.com/danijelgrabez/lazy-image 使用效果 ...

  8. ios手机竖屏拍照图片旋转90°问题解决方法

    手机拍照会给图片添加一个Orientaion信息(即拍照方向),如下: 用ios手机拍照,系统会给图片加上一个方向的属性, ios相机默认的拍照方向是后摄Home键在右为正,前摄Home键在左为正. ...

  9. Oracle 行转列 动态出转换的列

    本文链接:https://blog.csdn.net/Huay_Li/article/details/82924443 10月的第二天,前天写了个Oracle中行转列的pivot的基本使用方法,然后, ...

  10. MLflow系列3:MLflow项目

    英文链接:https://mlflow.org/docs/latest/projects.html 本文链接:https://www.cnblogs.com/CheeseZH/p/11945432.h ...