現在很多網站都是分為兩個版本,一個pc端的一個移動端的(響應式除外),針對這兩個版本,就需要對訪問的設備進行判斷,如果是pc,就直接訪問pc網站,否則就訪問移動端網站。
對於這個問題可以通過判斷UA來解決,前端js可以判斷,后端判斷也行,這里我們主要討論的是如何通過js來處理。
假如我們有一個網站,pc端通過www.test.com訪問,而移動端通過m.test.com來訪問。我們需要做的就是當移動端訪問www.test.com時可以直接跳轉到m.test.com。此時我們只需這樣處理就可以了,在頁面頭部加入如下js代碼:
(function () { var url = location.href; // replace www.test.com with your domain if ( (url.indexOf('www.test.com') != -1) && navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i) ) { location.href = 'http://m.test.com'; } })();
但是,多數情況下不止這么簡單地直接從www.test.com跳轉到m.test.com。我們網站除了主機名部分,后面跟的還有,比如:www.test.com/list/98/,對於這樣一個url,PC就直接這樣訪問了,對於移動端,需要通過m.test.com/list/98/才可以呈現出比較好的效果。
那么,此時就可以用正則來處理,當移動端訪問時,我們把“http://www”替換為“http://m”(冒號為英文冒號),然后更新頁面就可以看到頁面在移動端上呈現的效果了。具體代碼如下:
(function () { var url = location.href; // replace www.test.com with your domain if ( (url.indexOf('www.test.com') != -1) && navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i) ) { var newUrl = url.replace('http://www', 'http://m'); location.href = newUrl; } })();
Ok,以上就是移動端及PC端網站訪問的問題。