js如何判斷用戶是在PC端和還是移動端訪問_javascript技巧

最近一直在忙我們團(tuán)隊(duì)的項(xiàng)目“咖啡之翼”，在這個項(xiàng)目中，我們?yōu)橐苿悠脚_提供了一個優(yōu)秀的體驗(yàn)。伴隨Android平臺的紅火發(fā)展。不僅帶動國內(nèi)智能手機(jī)行業(yè)，而且許多國內(nèi)開發(fā)者也開始投身于Android移動終端的大浪潮中。如果很多互聯(lián)網(wǎng)大浪潮你錯過了。那么這個Android浪潮你絕對不能錯過。目前我們?yōu)椤翱Х戎怼币呀?jīng)開發(fā)了移動終端以及安卓客戶端，大家使用Android或者IOS操作系統(tǒng)的手機(jī)，直接訪問域名www.sygxy.cn即可觀看移動終端效果。同時Android客戶端已經(jīng)上架到騰訊“應(yīng)用寶”和“百度手機(jī)助手”等應(yīng)用商城。大家可以直接搜索“咖啡之翼”進(jìn)行下載。在沒有任何的推廣的情況了，僅僅上架一周，已經(jīng)擁有超過100+的下載量。

如果需要對移動終端進(jìn)行優(yōu)化，必須要做的就是，判斷客戶機(jī)的訪問設(shè)備是什么。通過判斷的結(jié)果，返回不能的域名地址，繼而加載不同的CSS文件。

我們使用的判斷方式是通過user-agent值，來進(jìn)行判斷。使用javascript框架中的Navigator對象的userAgent屬性。navigator 對象沒有公開標(biāo)準(zhǔn)，不過現(xiàn)在市面上所有瀏覽器都支持該對象。使用userAgent屬性返回由客戶機(jī)發(fā)送服務(wù)器的 user-agent 頭部的值。頭信息中有一個 User-Agent，它的作用是告訴服務(wù)器，用戶客戶端是什么瀏覽器，以及操作系統(tǒng)的信息的。使用正則表達(dá)式進(jìn)行user-agent值的獲取。和本地的值進(jìn)行判斷，這個匹配值可以是移動操作系統(tǒng)例如Android,ios，也可以為瀏覽器的名稱。有匹配項(xiàng)則跳轉(zhuǎn)，否則則不會跳轉(zhuǎn)，直接進(jìn)入PC端首頁。

具體的代碼實(shí)現(xiàn)，我們?yōu)榱颂岣呔W(wǎng)站的可移植性，使用了JavaScript腳本語言。使用此技術(shù)的好處在筆者看來有兩點(diǎn)

1：可以提高網(wǎng)站的可移植性，如果在此后的Web項(xiàng)目中，我們團(tuán)隊(duì)需要再一次加入移動終端的效果，就可以很輕松的引入這部分的JS代碼，進(jìn)行判斷。提高以后的工作效率。

2：第二點(diǎn)是便于Web程序可以在不用的界面加載，是否引入這部分移動終端的判斷代碼。

具體實(shí)現(xiàn)：

我們把判斷訪問的腳本抽離，如果哪個頁面需要進(jìn)行客戶終端的判斷，我們就直接在頁面使用

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com