WebView加載Github工程時(shí)直接進(jìn)入README界面的幾種方式

前言

在開發(fā)KeepGank的過程中遇到了一個(gè)問題这刷,就是Github的手機(jī)版本網(wǎng)頁(yè)進(jìn)入時(shí)會(huì)是這個(gè)樣子褐啡。

比如打開RxJava的網(wǎng)頁(yè)會(huì)是這個(gè)樣子,路徑為:https://github.com/ReactiveX/RxJava

而我希望用戶點(diǎn)開我的鏈接后進(jìn)入的直接是以下界面蹦掐。因?yàn)槭謾C(jī)直接看README比較直觀蟀伸,不需要先進(jìn)入那么復(fù)雜的界面、
以下路徑為:https://github.com/ReactiveX/RxJava/blob/2.x/README.md

而用戶的點(diǎn)擊界面是這樣的:

image.png

那么面臨一個(gè)問題翔横,如何讓W(xué)ebView加載https://github.com/ReactiveX/RxJava時(shí)加載到https://github.com/ReactiveX/RxJava/blob/2.x/README.md路徑读跷。

方案一

我們可以首先直接使用http獲取到https://travis-ci.org/ReactiveX/RxJava/的網(wǎng)頁(yè)源碼,而其中是有README的跳轉(zhuǎn)路徑的禾唁,分析完HTML數(shù)據(jù)便可以找到目的URL效览。

<div class="bubble-actions">
    <a href="/ReactiveX/RxJava/blob/2.x/README.md" class="bubble-action">
      View all of README.md
    </a>
</div>

這便是html代碼里面README.md的路徑了。
之后我們可以讓WebView加載https://github.com + /ReactiveX/RxJava/blob/2.x/README.md 路徑就可以了荡短。

這個(gè)方案有個(gè)缺點(diǎn)丐枉,前面需要分析HTML,且分析HTML就要用到jsoup包, 為了這么個(gè)需求就要用到一個(gè)包實(shí)在是不情愿掘托,而且預(yù)加載html的時(shí)候還要浪費(fèi)時(shí)間瘦锹。

更坑爹的是,若有工程沒有README.md 那么我們只能加載原來的路徑闪盔,那中間這些分析過程都白分析了弯院。

方案二

通過WebView的JavascriptInterface 回調(diào),能夠拿到WebView的html锭沟,做到了先顯示后拿到數(shù)據(jù)分析再顯示的效果抽兆。代碼如下,不過缺點(diǎn)還是需要去分析HTML文本族淮。這個(gè)分析代碼是煩人的,我這么懶得人不想寫凭涂,因?yàn)檫@肯定占據(jù)很大內(nèi)存在分析html祝辣,涉及到太多的字符串匹配。

         mWebView.addJavascriptInterface(new InJavaScriptLocalObj(), "local_obj");  
         mWebView.setWebViewClient(new WebViewClient() {  
            @Override  
            public void onPageStarted(WebView view, String url, Bitmap favicon) {  
                super.onPageStarted(view, url, favicon);  
            }  
  
            @Override  
            public boolean shouldOverrideUrlLoading(WebView view, String url) {  
                view.loadUrl(url);  
                return true;  
            }  
  
            @Override  
            public void onPageFinished(WebView view, String url) {  
                super.onPageFinished(view, url);  
                view.loadUrl("javascript:window.local_obj.showSource('<head>'+"  
                        + "document.getElementsByTagName('html')[0].innerHTML+'</head>');");  
  
            }  
  
            @Override  
            public void onReceivedError(WebView view, int errorCode,  
                    String description, String failingUrl) {  
                super.onReceivedError(view, errorCode, description, failingUrl);  
            }  
  
        });  
    }  
      
    final class InJavaScriptLocalObj {  
        public void showSource(String html) {  
            System.out.println("====>html="+html);  
        }  
    }  

方案三

我們是可以通過WebViewClientonPageFinished加載js代碼的切油,上面的方法二也是通過加載js回調(diào)Java的方式來獲取html的蝙斜。既然能加載JS我們大可以用JS來解決這事情。

我們?cè)俅尾榭碒TML代碼澎胡。是一個(gè)class="bubble-actions"包裹了class="bubble-action"孕荠,內(nèi)容data為"View all of README.md". 這三個(gè)因素決定了這個(gè)href 才是目標(biāo)路徑娩鹉。因?yàn)閎ubble-actions這些class該網(wǎng)頁(yè)中有好多個(gè)。

<div class="bubble-actions">
    <a href="/ReactiveX/RxJava/blob/2.x/README.md" class="bubble-action">
      View all of README.md
    </a>
</div>

那么我們的js代碼可以這么寫稚伍。弯予。。我這渣渣js

    var myParagragh = document.getElementsByClassName("bubble-actions"); 
    console.log("myParagragh length:", myParagragh.length);
    for (var i = myParagragh.length - 1; i >= 0; i--) {
        var a = myParagragh[i].getElementsByClassName("bubble-action");
        if (a.length > 0) {
            console.log("action:", a[0]);
            console.log("action:", a[0].firstChild.data);
            if (a[0].firstChild.data.indexOf("View all of README.md") > 0){
                    console.log("ok");
                        window.location.href=a[0].href;
             }
        }
    }

我們先通過classname獲取到一個(gè)list个曙,再遍歷這個(gè)list里面若有bubble-action元素锈嫩,再去判斷data是否為README.md。若是的話直接獲取其href 并賦值給window.location.href即可以實(shí)現(xiàn)垦搬。

通過這種方式呼寸,當(dāng)我們點(diǎn)開一個(gè)工程時(shí),便直接進(jìn)去的是它的README界面啦猴贰。因?yàn)槭謾C(jī)端還是直接看README比較直觀


本文作者:Anderson大碼渣/Jerey_Jobs
博客地址 : http://jerey.cn/
簡(jiǎn)書地址 : Anderson大碼渣
github地址 : https://github.com/Jerey-Jobs

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末对雪,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子米绕,更是在濱河造成了極大的恐慌瑟捣,老刑警劉巖,帶你破解...
    沈念sama閱讀 221,430評(píng)論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件义郑,死亡現(xiàn)場(chǎng)離奇詭異蝶柿,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)非驮,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,406評(píng)論 3 398
  • 文/潘曉璐 我一進(jìn)店門交汤,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人劫笙,你說我怎么就攤上這事芙扎。” “怎么了填大?”我有些...
    開封第一講書人閱讀 167,834評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵戒洼,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我允华,道長(zhǎng)圈浇,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,543評(píng)論 1 296
  • 正文 為了忘掉前任靴寂,我火速辦了婚禮磷蜀,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘百炬。我一直安慰自己褐隆,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,547評(píng)論 6 397
  • 文/花漫 我一把揭開白布剖踊。 她就那樣靜靜地躺著庶弃,像睡著了一般衫贬。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上歇攻,一...
    開封第一講書人閱讀 52,196評(píng)論 1 308
  • 那天固惯,我揣著相機(jī)與錄音,去河邊找鬼掉伏。 笑死缝呕,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的斧散。 我是一名探鬼主播供常,決...
    沈念sama閱讀 40,776評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼鸡捐!你這毒婦竟也來了栈暇?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,671評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤箍镜,失蹤者是張志新(化名)和其女友劉穎源祈,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體色迂,經(jīng)...
    沈念sama閱讀 46,221評(píng)論 1 320
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡香缺,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,303評(píng)論 3 340
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了歇僧。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片图张。...
    茶點(diǎn)故事閱讀 40,444評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖诈悍,靈堂內(nèi)的尸體忽然破棺而出祸轮,到底是詐尸還是另有隱情,我是刑警寧澤侥钳,帶...
    沈念sama閱讀 36,134評(píng)論 5 350
  • 正文 年R本政府宣布适袜,位于F島的核電站,受9級(jí)特大地震影響舷夺,放射性物質(zhì)發(fā)生泄漏苦酱。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,810評(píng)論 3 333
  • 文/蒙蒙 一给猾、第九天 我趴在偏房一處隱蔽的房頂上張望躏啰。 院中可真熱鬧,春花似錦耙册、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,285評(píng)論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)帝际。三九已至,卻和暖如春饶辙,著一層夾襖步出監(jiān)牢的瞬間蹲诀,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,399評(píng)論 1 272
  • 我被黑心中介騙來泰國(guó)打工弃揽, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留脯爪,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,837評(píng)論 3 376
  • 正文 我出身青樓矿微,卻偏偏與公主長(zhǎng)得像痕慢,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子涌矢,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,455評(píng)論 2 359

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,275評(píng)論 25 707
  • afinalAfinal是一個(gè)android的ioc掖举,orm框架 https://github.com/yangf...
    passiontim閱讀 15,435評(píng)論 2 45
  • 軟件名稱:簡(jiǎn)看影視 軟件版本:2.0 軟件介紹: 本軟件支持在線播放全網(wǎng)90%的影視資源,包括各大影視平臺(tái)的vip...
    AY_Nopi閱讀 292評(píng)論 0 0
  • 我一直以為 我在你心上灑的那粒種子 已經(jīng)開成了一朵美麗的花 也一直以為 你會(huì)像小王子那樣 好好的守護(hù)著那朵紅玫瑰 ...
    桔樹上閱讀 209評(píng)論 1 2
  • 育兒反思5:讓孩子承受自然結(jié)果 22個(gè)月的兒子不再滿足于別人的包辦代替娜庇,他的自主意識(shí)越來越強(qiáng)塔次,他要自己來。他搶過我...
    魯一禾閱讀 252評(píng)論 0 1