自動識別pc端、移動端,並跳轉


1、js 識別

1.1 pc端 和 移動端 代碼分開( 各是一個單頁應用,或各有一套代碼)

直接在 pc端的首頁 index.html 的 head 里加入識別代碼

<script type="text/javascript">
  if(/Android|webOS| iPhone | iPad | iPod |BlackBerry|opera mini|opera mobile|appleWebkit.*mobile|mobile/i.test(navigator.userAgent)) {
    window.location.replace("mobile-url.html");
  }
</script>

1.2 pc端 和 移動端 代碼 在一個單頁系統里(使用路由)

pc端和移動端兩套樣式在vue中的切換
vue項目PC兼容移動端
vue如何在一個工程里顯示pc和手機端

2、后端識別 (適用於 pc端和移動端各有一套代碼,或者各有一個頁面)

2.1、使用 NGINX 識別

如果前端頁面時用 NGINX 部署的

location / {
    #默認PC端訪問內容
    root /usr/local/website/web;
 
#如果是手機移動端訪問內容
    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 /usr/local/website/mobile;
    }
    index index.html index.htm;

}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM