網(wǎng)頁(yè)調(diào)用native功能的方法和系統(tǒng)的制作方法
【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及計(jì)算機(jī)技術(shù)領(lǐng)域，特別是涉及一種網(wǎng)頁(yè)調(diào)用native功能的方法和系統(tǒng)。
【背景技術(shù)】
[0002]“native”是原生的意思，指編寫(xiě)對(duì)應(yīng)系統(tǒng)上原生應(yīng)用的原生語(yǔ)言，“native”在不同系統(tǒng)上具體所指的語(yǔ)言是不同的，例如，1S系統(tǒng)的原生應(yīng)用是用Objective-C編寫(xiě)的，Android系統(tǒng)原生應(yīng)用是用Java編寫(xiě)的。
[0003]目前，網(wǎng)頁(yè)調(diào)用native功能的技術(shù)，一般是通過(guò)一種偽協(xié)議監(jiān)聽(tīng)瀏覽器組件(webview)的URL (Uniform Resoure Locator,統(tǒng)一資源定位符)加載事件，再針對(duì)偽協(xié)議約定的schema截?cái)嗾?qǐng)求，解析URL并轉(zhuǎn)換為需要交給native調(diào)用的指令和參數(shù)。
[0004]上述調(diào)用native功能的技術(shù)，存在較為明顯的缺陷，例如，在瀏覽器上調(diào)試網(wǎng)頁(yè)調(diào)用瀏覽器組件擴(kuò)展的native功能時(shí)，由于無(wú)法判斷出偽協(xié)議會(huì)讓地址跳轉(zhuǎn)到一個(gè)不存在的URL，此時(shí)需要對(duì)瀏覽器組件的網(wǎng)頁(yè)地址進(jìn)行相應(yīng)修改才能借助開(kāi)發(fā)工具進(jìn)行頁(yè)面調(diào)試，這就增加了調(diào)試難度，影響調(diào)試效率。

【發(fā)明內(nèi)容】

[0005]基于此，有必要針對(duì)上述現(xiàn)有技術(shù)的問(wèn)題，提供一種網(wǎng)頁(yè)調(diào)用native功能的方法和系統(tǒng)，不影響頁(yè)面跳轉(zhuǎn)方式，便于頁(yè)面調(diào)試，提高頁(yè)面調(diào)試效率。
[0006]—種網(wǎng)頁(yè)調(diào)用native功能的方法,包括如下步驟:
[0007]通過(guò)瀏覽器組件獲取網(wǎng)頁(yè)頁(yè)面的資源請(qǐng)求；
[0008]根據(jù)所述資源請(qǐng)求解析出所述資源的統(tǒng)一資源定位符；
[0009]根據(jù)所述統(tǒng)一資源定位符獲取并執(zhí)行native指令。
[0010]一種網(wǎng)頁(yè)調(diào)用native功能的系統(tǒng)，包括:
[0011]獲取模塊，用于通過(guò)瀏覽器組件獲取網(wǎng)頁(yè)頁(yè)面的資源請(qǐng)求；
[0012]接管模塊，用于根據(jù)所述資源請(qǐng)求解析出所述資源的統(tǒng)一資源定位符；
[0013]調(diào)用模塊，用于根據(jù)所述統(tǒng)一資源定位符獲取并執(zhí)行native指令。
[0014]上述網(wǎng)頁(yè)調(diào)用native功能的方法和系統(tǒng)，通過(guò)在瀏覽器組件進(jìn)行加載資源時(shí)接管資源請(qǐng)求，解析資源的統(tǒng)一資源定位符并獲取native指令執(zhí)行，以加載資源的形式實(shí)現(xiàn)網(wǎng)頁(yè)頁(yè)面與native的互調(diào)，使得在網(wǎng)頁(yè)頁(yè)面調(diào)試中，無(wú)需修改頁(yè)面跳轉(zhuǎn)方式，即可借助開(kāi)發(fā)工具進(jìn)行頁(yè)面調(diào)試，降低了調(diào)試復(fù)雜度，提高了調(diào)試效率。
【附圖說(shuō)明】
[0015]圖1為一個(gè)實(shí)施例的網(wǎng)頁(yè)調(diào)用native的方法流程圖；
[0016]圖2為一個(gè)實(shí)例的頁(yè)面調(diào)用native功能的流程圖；
[0017]圖3為基于現(xiàn)有監(jiān)聽(tīng)URL加載事件的網(wǎng)頁(yè)調(diào)試結(jié)果示意圖；
[0018]圖4為基于本發(fā)明網(wǎng)頁(yè)調(diào)用native功能的方法的網(wǎng)頁(yè)調(diào)試結(jié)果示意圖；
[0019]圖5為一個(gè)實(shí)施例的網(wǎng)頁(yè)調(diào)用native功能的系統(tǒng)結(jié)構(gòu)示意圖；
[0020]圖6為另一實(shí)施例的網(wǎng)頁(yè)調(diào)用native功能的系統(tǒng)結(jié)構(gòu)示意圖；
[0021]圖7為一個(gè)實(shí)施例的接管模塊結(jié)構(gòu)示意圖；
[0022]圖8為一個(gè)實(shí)施例的調(diào)用模塊結(jié)構(gòu)示意圖；
[0023]圖9中為一個(gè)實(shí)施例的終端設(shè)備的部分結(jié)構(gòu)框圖。
【具體實(shí)施方式】
[0024]下面結(jié)合附圖對(duì)本發(fā)明的網(wǎng)頁(yè)調(diào)用native功能的方法和系統(tǒng)的【具體實(shí)施方式】作詳細(xì)描述。
[0025]參考圖1所示，圖1為一個(gè)實(shí)施例的網(wǎng)頁(yè)調(diào)用native的方法流程圖，包括如下步驟:
[0026]步驟S10，通過(guò)瀏覽器組件獲取網(wǎng)頁(yè)頁(yè)面的資源請(qǐng)求。
[0027]在此步驟中，可以通過(guò)瀏覽器組件接收網(wǎng)頁(yè)頁(yè)面的發(fā)起的資源請(qǐng)求，瀏覽器組件接收到網(wǎng)頁(yè)頁(yè)面的資源請(qǐng)求后，會(huì)訪問(wèn)并加載相關(guān)資源，由此，可在此接管瀏覽器組件的加載資源請(qǐng)求，實(shí)現(xiàn)監(jiān)聽(tīng)瀏覽器組件所有的資源加載行為。
[0028]對(duì)于網(wǎng)頁(yè)頁(yè)面的資源請(qǐng)求,可以通過(guò)JS (JavaScript的簡(jiǎn)寫(xiě)，指一種廣泛用于客戶端Web開(kāi)發(fā)的腳本語(yǔ)言)代碼來(lái)實(shí)現(xiàn)，所以，用戶可以通過(guò)JS創(chuàng)建調(diào)用瀏覽器組件擴(kuò)展功能的資源請(qǐng)求，將資源請(qǐng)求添加到所述網(wǎng)頁(yè)頁(yè)面中，這里所說(shuō)的資源可以為網(wǎng)頁(yè)的圖片、視頻等。
[0029]步驟S20，根據(jù)所述資源請(qǐng)求解析出所述資源的統(tǒng)一資源定位符。
[0030]在此步驟中，可以根據(jù)接管的網(wǎng)頁(yè)頁(yè)面的資源請(qǐng)求，解析資源的統(tǒng)一資源定位符，監(jiān)聽(tīng)瀏覽器組件所有的資源加載行為，從而使得網(wǎng)頁(yè)頁(yè)面可以通過(guò)偽協(xié)議調(diào)用native擴(kuò)展功能。
[0031]對(duì)于上述處理過(guò)程，可以通過(guò)緩存代理來(lái)完成，作為一個(gè)實(shí)施例，步驟S20的步驟具體可以包括:
[0032]將所述資源請(qǐng)求轉(zhuǎn)發(fā)至緩存代理；通過(guò)緩存代理解析所述資源請(qǐng)求獲得統(tǒng)一資源定位符。
[0033]對(duì)于緩存代理的接管功能實(shí)現(xiàn)，可以首先創(chuàng)建一個(gè)系統(tǒng)緩存代理，然后設(shè)置緩存代理解析的偽協(xié)議，擴(kuò)展接管資源請(qǐng)求的功能，將緩存代理注冊(cè)生效，實(shí)現(xiàn)接管瀏覽器組件的資源請(qǐng)求功能。
[0034]步驟S30，根據(jù)所述統(tǒng)一資源定位符獲取并執(zhí)行native指令。
[0035]在此步驟中，主要是將統(tǒng)一資源定位符轉(zhuǎn)換為native指令并執(zhí)行，實(shí)現(xiàn)了網(wǎng)頁(yè)頁(yè)面對(duì)native擴(kuò)展功能的調(diào)用。
[0036]在一個(gè)實(shí)施例中，步驟S30具體可以包括如下:
[0037]判斷所述統(tǒng)一資源定位符是否為偽協(xié)議，若是，通知所述瀏覽器組件結(jié)束資源請(qǐng)求，將所述統(tǒng)一資源定位符轉(zhuǎn)換為native指令并執(zhí)行該指令，否則根據(jù)統(tǒng)一資源定位符從服務(wù)器加載相應(yīng)資源。
[0038]進(jìn)一步地，對(duì)于所述將所述統(tǒng)一資源定位符轉(zhuǎn)換為native指令并執(zhí)行該指令的步驟，可以根據(jù)約定的偽協(xié)議將所述統(tǒng)一資源定位符轉(zhuǎn)換為native調(diào)用的指令和參數(shù)，根據(jù)所述指令和參數(shù)調(diào)用相應(yīng)的方法(method)，即在面向?qū)ο缶幊讨衝ative實(shí)現(xiàn)的函數(shù)，其中，面向?qū)ο缶幊?Object Oriented Programming,OOP),也稱面向?qū)ο蟪绦蛟O(shè)計(jì),是一種計(jì)算機(jī)編程架構(gòu)，其基本原則是計(jì)算機(jī)程序是由單個(gè)能夠起到子程序作用的單元或?qū)ο蠼M合而成，以達(dá)到重用性、靈活性和擴(kuò)展性的目標(biāo)，每個(gè)對(duì)象都能夠接收信息、處理數(shù)據(jù)和向其它對(duì)象發(fā)送信息。
[0039]另外，對(duì)于所述瀏覽器組件的運(yùn)行環(huán)境，可以為電腦操作系統(tǒng)，例如windows系統(tǒng)，也可以移動(dòng)操作系統(tǒng)(Mobile operating system,簡(jiǎn)稱Mobile OS)，例如1S系統(tǒng)或android系統(tǒng)等。
[0040]由于本發(fā)明的技術(shù)方案是以加載資源的形式實(shí)現(xiàn)網(wǎng)頁(yè)頁(yè)面對(duì)native代碼的調(diào)用。所以，可以實(shí)現(xiàn)跨平臺(tái)的使用，在借助開(kāi)發(fā)工具對(duì)網(wǎng)頁(yè)頁(yè)面調(diào)試過(guò)程中，調(diào)試的網(wǎng)頁(yè)頁(yè)面通過(guò)該方式調(diào)用native功能，無(wú)需對(duì)瀏覽器組件的頁(yè)面地址進(jìn)行任何改動(dòng)，只需要在網(wǎng)頁(yè)頁(yè)面中創(chuàng)建一個(gè)資源請(qǐng)求即可實(shí)現(xiàn)消息傳遞，接管并監(jiān)聽(tīng)瀏覽器組件所有的資源加載行為，在瀏覽器組件有資源加載行為時(shí)，根據(jù)約定的偽協(xié)議調(diào)用native擴(kuò)展功能，從而可以降低頁(yè)面調(diào)試難度，提高調(diào)試效率。
[0041]參考圖2所示，圖2為一個(gè)實(shí)例的頁(yè)面調(diào)用native功能的流程圖；包括如下步驟:
[0042]步驟S201，用戶頁(yè)面發(fā)出資源請(qǐng)求；
[0043]步驟S202，瀏覽器組件將接收的資源請(qǐng)求轉(zhuǎn)發(fā)至緩存代理；
[0044]步驟S203，緩存代理解析資源請(qǐng)求得到資源的URL ；
[0045]步驟S204，判斷URL是否為偽協(xié)議；若是，進(jìn)入步驟S206，否則進(jìn)入步驟S205 ；
[0046]步驟S205，瀏覽器組件根據(jù)URL訪問(wèn)服務(wù)器并加載相應(yīng)資源；
[0047]步驟S206，截?cái)酁g覽器組件的資源請(qǐng)求；
[0048]步驟S207，將URL轉(zhuǎn)換為native指令并執(zhí)行。
[0049]下面闡述本發(fā)明的網(wǎng)頁(yè)調(diào)用native功能的方法在1S、android系統(tǒng)上實(shí)現(xiàn)的兩個(gè)實(shí)例。
[0050](I)在1S系統(tǒng)上實(shí)現(xiàn)
[0051]1S系統(tǒng)自帶有緩存代理類，當(dāng)瀏覽器發(fā)出資源請(qǐng)求時(shí)必須會(huì)通過(guò)所述緩存代理，因此可以通過(guò)擴(kuò)展所述緩存代理類，設(shè)置其接管資源請(qǐng)求的功能，處理自定義的偽協(xié)議。具體的，可以通過(guò)注冊(cè)一個(gè)NSURLProtocol來(lái)實(shí)現(xiàn)，以下是1S系統(tǒng)上實(shí)現(xiàn)的具體過(guò)程:
[0052]Stepl:創(chuàng)建一個(gè)類，繼承NSURLProtocol，即創(chuàng)建一個(gè)系統(tǒng)緩存代理的副本，以便后續(xù)進(jìn)行擴(kuò)展。
[0053]St印2:對(duì)緩存代理進(jìn)行功能擴(kuò)展，實(shí)現(xiàn)NSU