欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Javascript限制網(wǎng)頁只能在微信內(nèi)置瀏覽器中訪問

 更新時(shí)間:2014年11月09日 10:52:31   投稿:hebedich  
最近正在開發(fā)一個(gè)微信公眾賬號(hào),其中有一項(xiàng)功能是用戶發(fā)送文字消息給公眾號(hào),然后公眾號(hào)返回圖文消息給用戶,用戶再點(diǎn)擊圖文消息即可跳轉(zhuǎn)到一個(gè)網(wǎng)頁鏈接,在微信的內(nèi)置瀏覽器中打開。

那么問題就來了,這個(gè)網(wǎng)頁首先涉及到了移動(dòng)web前端開發(fā),我優(yōu)先選擇了用HTML5+bootstrap組合來實(shí)現(xiàn)頁面的美觀效果,前端其他的任務(wù)交給javascript解決(這里我是完全使用原生javascript代碼,沒有用到任何的框架,因?yàn)榭紤]到手機(jī)加載網(wǎng)頁的速度本來就慢,而且框架中很多用不到的功能也會(huì)隨網(wǎng)頁一起加載,耗費(fèi)用戶流量)。

一切功能都就緒以后,客戶試用也覺得很滿意,之后我就把代碼提交到了正式的服務(wù)器上。不過,對(duì)方又突然提到了一點(diǎn):你做的頁面確實(shí)挺漂亮的,兼容性也不錯(cuò),但是這個(gè)頁面用電腦上的瀏覽器也是可以訪問的,那么其他人就可以很隨便地查看頁面的源代碼,進(jìn)而copy整個(gè)頁面,能不能有什么方法防止這一點(diǎn)?那么問題就又來了,我是第一次做微信二次開發(fā),還沒遇到過這樣的需求,怎么搞定呢?

一時(shí)間想不出來,后來我就把這個(gè)問題先放了放,去做后臺(tái)的一些業(yè)務(wù)。在做后臺(tái)的一個(gè)數(shù)據(jù)采集功能時(shí),PHP代碼當(dāng)中用到了$_SERVER['HTTP_USER_AGENT']這個(gè)參數(shù),我突然想到瀏覽器訪問網(wǎng)頁時(shí)都會(huì)發(fā)送一個(gè)UserAgent給服務(wù)器,它里面包含了一些瀏覽器及用戶操作系統(tǒng)的基本信息,既然微信有內(nèi)置瀏覽器,那么用微信瀏覽網(wǎng)頁時(shí)這個(gè)UserAgent里面會(huì)不會(huì)帶上和微信相關(guān)的獨(dú)有的標(biāo)識(shí)呢(畢竟騰訊這么大個(gè)公司,而微信又是他們的核心產(chǎn)品之一)?干脆用代碼打印一下它的UserAgent來一探究竟,javascript代碼如下:

復(fù)制代碼 代碼如下:

<script type="text/javascript">
    alert(navigator.userAgent);
</script>

在我的手機(jī)上得到了如圖所示的結(jié)果:

這一下果然還真的看到了不一樣的地方,相信聰明的朋友也已經(jīng)發(fā)現(xiàn)了,沒錯(cuò),就是這個(gè)東西:MicroMessenger/6.0.0.50_r844973.501,斜杠后面的這一串就是我當(dāng)前使用的微信的版本號(hào),前面則應(yīng)該是微信的一個(gè)獨(dú)有標(biāo)識(shí)了。其實(shí)我一開始看成了MicroMessage,想著中文翻譯過來是“微消息”的意思,但仔細(xì)一看發(fā)現(xiàn)不是的,后面查了詞典才知道Messenger這個(gè)詞有“報(bào)信者,送信者”的意思,也就不覺得奇怪了。這個(gè)標(biāo)識(shí)應(yīng)該來說是其他瀏覽器不會(huì)有的,那么解決方案就來了,請(qǐng)看代碼:

復(fù)制代碼 代碼如下:

<script type="text/javascript">
    // 對(duì)瀏覽器的UserAgent進(jìn)行正則匹配,不含有微信獨(dú)有標(biāo)識(shí)的則為其他瀏覽器
    var useragent = navigator.userAgent;
    if (useragent.match(/MicroMessenger/i) != 'MicroMessenger') {
        // 這里警告框會(huì)阻塞當(dāng)前頁面繼續(xù)加載
        alert('已禁止本次訪問:您必須使用微信內(nèi)置瀏覽器訪問本頁面!');
        // 以下代碼是用javascript強(qiáng)行關(guān)閉當(dāng)前頁面
        var opened = window.open('about:blank', '_self');
        opened.opener = null;
        opened.close();
    }
</script>

這段代碼在Android、iPhone、iPad、PC上都進(jìn)行了測試,只要不是在微信內(nèi)部打開網(wǎng)頁的,首先就會(huì)彈出上面那個(gè)警告框,此時(shí)后面的頁面是空白的,什么都還沒加載,當(dāng)點(diǎn)擊警告框的確定按鈕之后,最后三行代碼將強(qiáng)行關(guān)閉當(dāng)前頁面。OK,到這里算是實(shí)現(xiàn)了用戶原本的意思了,可以簡單收工了。

等等,真的可以這樣收工了么?你確定不會(huì)有其他問題?當(dāng)然不是,其實(shí)這個(gè)方法并不會(huì)讓你高枕無憂,因?yàn)閷?duì)于偽造的UserAgent,還是可以繞過這條限制的,總的來說就是防君子不防小人了,大家懂得。當(dāng)然,如果哪位朋友有解決這個(gè)問題的更好方法,還麻煩在下面評(píng)論告知,技術(shù)在于相互的分享和交流嘛,呵呵。

相關(guān)文章

  • JS實(shí)現(xiàn)彈出居中的模式窗口示例

    JS實(shí)現(xiàn)彈出居中的模式窗口示例

    這篇文章主要介紹了JS實(shí)現(xiàn)彈出居中的模式窗口,涉及javascript模式窗口及頁面元素的動(dòng)態(tài)操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
    2016-06-06
  • JS解決移動(dòng)web開發(fā)手機(jī)輸入框彈出的問題

    JS解決移動(dòng)web開發(fā)手機(jī)輸入框彈出的問題

    在移動(dòng)web開發(fā)中和pc端不同的是,手機(jī)的輸入是軟鍵盤,這樣就會(huì)有個(gè)問題,那就是當(dāng)有輸入的時(shí)候,鍵盤彈起來,整個(gè)頁面難免會(huì)發(fā)生變化。怎么解決這個(gè)問題呢?下面腳本之家小編給大家分享JS解決移動(dòng)web開發(fā)手機(jī)輸入框彈出的問題
    2017-03-03
  • JavaScript中將number轉(zhuǎn)為string的5種方法

    JavaScript中將number轉(zhuǎn)為string的5種方法

    這篇文章主要給大家介紹了關(guān)于JavaScript中將number轉(zhuǎn)為string的5種方法,在JavaScript的值類型轉(zhuǎn)換中,最常發(fā)生的就是string與number這兩種類型值之間的相互轉(zhuǎn)換,需要的朋友可以參考下
    2023-07-07
  • javascript之卸載鼠標(biāo)事件的代碼

    javascript之卸載鼠標(biāo)事件的代碼

    javascript之卸載鼠標(biāo)事件的代碼...
    2007-05-05
  • 原生js實(shí)現(xiàn)貪食蛇小游戲的思路詳解

    原生js實(shí)現(xiàn)貪食蛇小游戲的思路詳解

    這篇文章主要介紹了原生js實(shí)現(xiàn)貪食蛇小游戲的思路詳解,,文中給大家寫出了注釋,幫助大家理解代碼,需要的朋友可以參考下
    2019-11-11
  • 解決JS中乘法的浮點(diǎn)錯(cuò)誤的方法

    解決JS中乘法的浮點(diǎn)錯(cuò)誤的方法

    本篇文章主要介紹了解決JS中乘法的浮點(diǎn)錯(cuò)誤的方法。需要的朋友可以過來參考下,希望對(duì)大家有所幫助
    2014-01-01
  • js 優(yōu)化次數(shù)過多的循環(huán) 考慮到性能問題

    js 優(yōu)化次數(shù)過多的循環(huán) 考慮到性能問題

    IE沒有我們想象中笨,它知道總的循環(huán)次數(shù)還是一千萬次。因此,得把這一百個(gè)十萬次循環(huán)分開執(zhí)行。雖然Javascript是單線程的,但也可以通過setTimeout或setInterval模擬多線程。
    2011-03-03
  • 最新評(píng)論