Loading [MathJax]/jax/input/TeX/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >根据访问请求客户端类型自动跳转到对应的页面地址,自动跳转到手机页面

根据访问请求客户端类型自动跳转到对应的页面地址,自动跳转到手机页面

作者头像
Yiiven
发布于 2022-12-15 03:09:32
发布于 2022-12-15 03:09:32
3.1K00
代码可运行
举报
文章被收录于专栏:怡文菌怡文菌
运行总次数:0
代码可运行

在智能移动终端横行霸道的今天,使用移动终端来访问网站的用户是越来越多,但针对PC用户开发的网站,在移动终端上的体验非常差,这不,我们开始针对移动终端也制作了体验相对更好的页面,那么我们怎么才能知道用户使用的是哪种终端来访问我们的网站呢,总不能让用户再来记一遍我们的手机站域名吧,查阅资料,有很多方法可以实现这个需求,现在将发现的方法记录如下:

JS实现方法:

方法一:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
function mobile_device_detect(url)
 {
        var thisOS=navigator.platform;
        var os=new Array("iPhone","iPod","iPad","android","Nokia","SymbianOS","Symbian","Windows Phone","Phone","Linux armv71","MAUI","UNTRUSTED/1.0","Windows CE","BlackBerry","IEMobile");
 for(var i=0;i<os.length;i++)
        {
 if(thisOS.match(os[i]))
        {  
  window.location=url;
 }
          
 }
 //因为相当部分的手机系统不知道信息,这里是做临时性特殊辨认
 if(navigator.platform.indexOf('iPad') != -1)
        {
  window.location=url;
 }
 //做这一部分是因为Android手机的内核也是Linux
 //但是navigator.platform显示信息不尽相同情况繁多,因此从浏览器下手,即用navigator.appVersion信息做判断
  var check = navigator.appVersion;
  if( check.match(/linux/i) )
          {
   //X11是UC浏览器的平台 ,如果有其他特殊浏览器也可以附加上条件
   if(check.match(/mobile/i) || check.match(/X11/i))
                 {
   window.location=url;
   } 
 }
 //类in_array函数
 Array.prototype.in_array = function(e)
 {
  for(i=0;i<this.length;i++)
  {
   if(this[i] == e)
   return true;
  }
  return false;
 }
 }
mobile_device_detect("手机站地址");

方法二:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
try {
var urlhash = window.location.hash;
if (!urlhash.match("fromapp"))
{
if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i)))
{
window.location="http://m.16css.com/";
}
}
}
catch(err)
{
}

方法三:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
// JavaScript Document
function urlredirect() {
    var sUserAgent = navigator.userAgent.toLowerCase(); 
    if ((sUserAgent.match(/(ipod|iphone os|midp|ucweb|android|windows ce|windows mobile)/i))) {
        // PC跳转移动端
        var thisUrl = window.location.href;
        window.location.href = thisUrl.substr(0,thisUrl.lastIndexOf('/')+1)+'mobile/';
         
    }
}
urlredirect();

php实现方法:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<?php
$agent = $_SERVER['HTTP_USER_AGENT'];
if(
    strpos($agent,"comFront")
    || strpos($agent,"iPhone")//iPhone
    || strpos($agent,"MIDP")//JAVA
    || strpos($agent,"Opera Mini")//Opera for mobile
    || strpos($agent,"UCWEB")//UC Mobile Limited
    || strpos($agent,"Android")//android
    || strpos($agent,"Windows CE")//Win CE
    || strpos($agent,"Windows mobile")//Win phone
    || strpos($agent,"SymbianOS"))//Symbian
    {
    header("Location:手机站地址");
}else {
    header("Location:PC站地址");
    }
?>

本文采用 「CC BY-NC-SA 4.0」创作共享协议,转载请标注以下信息:

原文出处:Yiiven https://cloud.tencent.com/developer/article/2193052

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2016-11-21 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
php判断访问者是否手机客户端实例
上面的方法也存在一些小问题,这里我根据自己的经验来告诉大我们可以使用屏幕宽度来实现再加机器类型了,因为有时HTTP_USER_AGENT信息在我们上面并未定义过了,不过上面实现几乎兼容了主流手机了。 我们还可以使用js
用户8099761
2023/05/10
2.1K0
js判断手机端和pc端
navigator对象有一个属性为userAgent,这是一个只读的字符串,声明了浏览器用于HTTP请求的用户代理头的值。所以我们可以通过判断navigator.userAgent里面是否包含某些值来判断。如下为userAgent的打印值。
用户1349575
2022/01/26
8.7K0
判断网页是通过PC端还是移动终端打开的
通过判断浏览器的 userAgent,用正则来判断手机是否是ios和Android客户端。代码如下:
德顺
2019/11/13
5.5K0
手机端和PC端分别加载不同的js文件
手机端和PC端分别加载不同的js客服代码(注意:是要在PC和手机端分别加载不同的js文件)
用户1349575
2022/02/09
3.9K0
被问到的一些面试题
最后,说说手机端与pc兼容问题: // JavaScript Document function mobile_device_detect(url){ var thisOS=navigator.p
李才哥
2019/07/10
3450
被问到的一些面试题
通过Js判断客户端为PC端还是手持设备
Js中获取浏览器信息字符串只要使用navigator.userAgent即可,这样我们再利用indexof来判断版本或其它信息了。
WindCoder
2018/09/20
7.8K0
JavaScript判断设备类型的实现
可以通过 JavaScript 来实现判断当前的设备类型:navigator 是 JavaScript 中的一个独立的对象,用于提供用户所使用的浏览器以及操作系统等信息,以 navigator 对象属性的形式来提供。所有浏览器都支持该对象。
前端老道
2022/03/29
3.7K0
如何将页面设置为微信端才能打开
  我们有时候开发一个新项目比较辛苦,不想让别人轻易就能反编译代码,我们可以加一个授权登录,如果不是在微信端登录就会提示“请在微信客户端打开链接”,如下图所示,这就是很多网友说的微信链接无法在pc端打
ytkah
2018/03/06
2.2K0
如何将页面设置为微信端才能打开
emlog教程:手机访问自动跳转到首页或相应文章地址
手机访问自动跳转到首页或相应文章地址,在模板文件header.php中<head></head>之间加入如下代码即可。
用户8099761
2023/05/10
6080
织梦移动与pc之间的相互跳转
织梦移动端与pc之间的相互跳转,直接把js放到页面,然后把当前的网址写入browserRedirect()中去,m端要注意列表页用list.php文章页用view.php
夏末浅笑
2020/11/18
8900
H5页面判断客户端是iOS或者Android并跳转对应链接唤起APP
每个客户端都会有自己的 UA (userAgent)标识,可以用 JavaScript 获取客户端标识。
德顺
2019/11/12
13.7K0
php网站判断用户是否是手机访问的方法
有些时候,我们需要判断用户是否用手机访问,如果是手机的话,就跳转到指定的手机友好页面。这里就介绍一下,如何判断用户是否用手机访问。
全栈程序员站长
2022/07/07
2.4K0
详解JS判断页面是在手机端还是在PC端打开的方法
我们要利用:Navigator 对象,Navigator 对象包含有关浏览器的信息。
用户6854115
2019/12/26
6.6K0
移动搜索SEO:网站移动适配之Meta标注、移动跳转终结篇
这些天,在给博客的标签页(tag)添加跳转和 META 动态申明时,居然让我醍醐灌顶,发现之前的动态适配的做法是多么的苦逼和小白! 总结前,先来回顾下小白张戈在移动适配这条道路上的摸爬滚打: 百度开放适配专用 sitemap 制作说明 360 站长平台移动适配文件制作说明 完美实现移动主题在 360 网站卫士缓存全开情况下的切换 移动搜索 SEO 分享:利用 Meta 声明来做百度开放适配 利用 Meta 申明来做百度、谷歌、雅虎、微软等搜索的开放适配 必须申明的是,本文的所有做法仅适合非响应式网站,并且需
张戈
2018/03/23
2.3K0
多种方式判断PC端,IOS端,移动端
1. 通过判断浏览器的userAgent,用正则来判断手机是否是IOS(苹果)和Android(安卓)客户端。
honey缘木鱼
2018/12/25
1.4K0
通过JavaScript实现不同设备间的跳转和加载CSS样式
通过JS判断访问设备并跳转对应HTML页面 <script type="text/javascript"> if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i))) { window.location = "手机页面.html"; //移动端访问跳转页面 } else { window.location = "电脑页面.html"; //PC端访问跳转页面 } </sc
程序员纬度
2021/12/30
1.5K0
Nginx区分PC或手机访问不同网站
近几年来,随着手机和pad的普及,越来越多的用户选择使用移动客户端访问网站,而为了获取更好的用户体验,就需要针对不同的设备显示出最合适的匹配,这样就是近年来流行的“响应式web设计”。 响应式web设计是一种纯前端技术js、css等实现的针对不同设备访问同一网址看到不同的布局,是页面内容更适合当前设备阅读。但这个不是本文的重点,重点还是放在nginx如何实现上来。 本文要讲的的是如何使用nginx区分pc和手机访问不同的网站,是物理上完全隔离的两套网站(一套移动端、一套pc端),这
小小科
2018/05/03
10.1K0
PHP自动判断客户端并进行301跳转
现在很多老版的网站都会有m站,在我们使用移动端访问时会自动跳转到m站,那么如何判断客户端设备是电脑还是手机或者是平板呢,有的使用的是js判断方式,以前我们使用的方式也是这样的,但是这样是损失资源的,因为js判断是在页面上进行的操作,这样就会有数据的请求。然后,获取完数据,判断设备类型,进行跳转,再次获取数据,渲染页面。浪费了很多资源,也加长了用户的等待时间。
申霖
2019/12/27
3.1K0
PHP自动判断客户端并进行301跳转
Nginx自动跳转到手机端——区分PC或手机访问不同域名
server { listen 80; server_name baidu.com; 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)|(
zhangdd
2020/01/02
5.7K0
JavaScript判断浏览器内核,微信打开自动提示在浏览器打开
微信会屏蔽 URL 自定义的 scheme ,导致无法跳转手机中的浏览器。网上有一些工具类网站可以实现直接跳转浏览器,之后有机会我会整理一下。我们今天只讨论通过 JavaScript 判断是否在微信浏览器中打开,如果是则弹出提示,在浏览器中打开。
德顺
2019/11/19
4.5K0
推荐阅读
相关推荐
php判断访问者是否手机客户端实例
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验