链接：https://www.zhihu.com/question/20004700/answer/13678113

  • 第一步先在服务器端使用User Agent判断，先匹配出移动设备，这一步可以统计User Agent列表(可通过网站访问日志获取或者使用自己的设备收集)，写出匹配设备的正则表达式(比如iPhone/Touch系列的匹配规则是/iPhone OS/i，如果要适配系统版本号，规则会更复杂)，根据匹配结果做对应的网站版本输出。
    需要注意的是在智能手机在移动CMWAP接入方式下User-Agent会被网关过滤，所以在第一步服务器端判断UA后可以再在浏览器端对服务器端获取不到UA的访问设备使用Javascript进行二次判断。
  • 有三种方式，根据第一步的匹配结果 ：
    a. 跳转到不同的网址，对三个网站进行分别维护 (例子：Facebook，国内各大门户)
    b. 同一个网址，针对不同设备使用不同的页面模板输出页面 (例子：deviantArt、 Tumblr)
    c. 只使用一套前端展示，对各种设备做集中适配(UI布局的自适应、前端技术的综合兼容，例子：http://cubiq.org)
    前两种方式后端维护成本较高，适合移动端和PC端产品内容形态不同的情况，第三种方式适合各平台内容一致的情况，后端维护成本较小，但是对前端技术和UI布局要求非常高。
  • 参见楼上的解决方案

前端判断用户请求是PC还是移动端的更多相关文章

  1. js如何判断用户是在pc端和还是移动端访问

    js如何判断用户是在pc端和还是移动端访问 来源:A5技术交流 作者:wofa 时间:2014-04-25收藏本页 最近一直在忙我们团队的项目“咖啡之翼”,在这个项目中,我们为移动平台提供了一个优秀的 ...

  2. js判断用户是在PC端或移动端访问

    js如何判断用户是在PC端和还是移动端访问.  最近一直在忙我们团队的项目“咖啡之翼”,在这个项目中,我们为移动平台提供了一个优秀的体验.伴随Android平台的红火发展.不仅带动国内智能手机行业,而 ...

  3. js判断用户的浏览器设备是移动端还是pc端

    最近做的一个网站页面中需要根据用户的访问设备的不同来显示不同的页面样式,主要是判断移动设备还是电脑浏览器访问的. 下面给出js判断处理代码,以作参考. <script type="te ...

  4. 关于实现判断用户是在PC端和还是移动端访问。

    最近一直在忙我们团队的项目“咖啡之翼”,在这个项目中,我们为移动平台提供了一个优秀的体验.伴随Android平台的红火发展.不仅带动国内智能手机行业,而且许多国内开发者也开始投身于Android移动终 ...

  5. js判断用户浏览器是PC还是手机，自动跳转

    browserRedirect(); function browserRedirect() { var sUserAgent = navigator.userAgent.toLowerCase(); ...

  6. agent判断用户请求设备

  7. 如何使用fiddler抓取https请求（PC和移动端）

    最近做一个抓取移动端app接口,并执行评论,收藏的接口功能测试.怎么搞/(ㄒoㄒ)/~~ 按照老思路试一试,第一步还是要用fiddler来帮忙获取接口信息! 一.基本的抓取http请求设置: 1.cm ...

  8. js 判断用户是手机端还是电脑端访问

    通过userAgent 判断,网页可以直接使用 navigation对象 node端 可以通过请求头的 ctx.request.header['user-agent'] const browser = ...

  9. 如何使用js判断当前页面是pc还是移动端打开的

    1.利用了正则表达式和三目运算符,含义就是如果是移动端打开的话那就跳转到 "https:www.baidu.com/" ,如果不是就跳转到"http://new.baid ...

随机推荐

  1. Action重定向总结

    [HttpPost] public ActionResult StudentList( string StudName, string studName, DateTime BirthDay, For ...

  2. js改变div宽度

    document.getElementById('Content_Right_id').style.width = document.documentElement.clientWidth - 250 ...

  3. JS判断，今天所在季度，第几周， 季度的第几周，年度第几周

    <html> <head> <title>日期判断 周 月 季 年</title> <script type="text/javascr ...

  4. POJ 1002 - 487-3279 STL

    先把不是标准格式的字符串变成标准格式再输出出现两次以上的标准串和出现的次数不然输出 "No duplicates." #include <iostream> #incl ...

  5. Ruby和Rails开发环境安装

    更新包管理 sudo apt-get update 安装curl sudo apt-get install curl *安装rvm via curl \curl -L https://get.rvm. ...

  6. 文件:因为懂你，所以永恒 - 零基础入门学习Python028

    文件:因为懂你,所以永恒 让编程改变世界 Change the world by program 因为懂你,所以永恒 大多数的程序都遵循着:输入->处理->输出的模型,首先接受输入数据,然 ...

  7. LeetCode_Combinations

    Given two integers n and k, return all possible combinations of k numbers out of 1 ... n. For exampl ...

  8. 【转】Android兼容性测试CTS Verifier-环境搭建、测试执行、结果分析

    原文网址:http://www.cnblogs.com/zh-ya-jing/p/4452675.html CTS Verifier算是CTS的一部分,需要手动进行,主要用于测试那些自动测试系统无法测 ...

  9. 【转】图文并茂 Ubuntu使用Thunderbird方法指南

    原文网址:http://os.51cto.com/art/201101/243445.htm Ubuntu 是一个启动速度超快.界面友好.安全性好的操作系统,它适用于桌面电脑.笔记本电脑.服务器以及上 ...

  10. seajs教程之seajs学习笔记 seajs.use用法

    seajs.use 用来在页面中加载模块.通过 use 方法,可以在页面中加载任意模块. 实例地址:http://www.android100.org/html/201405/23/12807.htm ...