[**iOS**與**HTML5**交互方法總結(jié)(修正)]

(http://www.cnblogs.com/tig666666/p/5709320.html)

摘要

看了不少別人寫的博客或者論壇,關(guān)于iOSHTML5交互方法大概主要有5種方式:

1. 利用WKWebView進(jìn)行交互(系統(tǒng)API)

2. 利用UIWebView進(jìn)行交互(系統(tǒng)API)

3. 蘋果的javascriptcore.framework框架;

4. 跨平臺cordova框架;

5. oc第三方WebViewJavascriptBridge

關(guān)于WKWebView的介紹在前篇文章已經(jīng)有了比較詳細(xì)的介紹了。

前篇文章地址**:http://blog.csdn.net/baihuaxiu123/article/details/51286109 **

今天主要介紹前兩種,后三種大家有興趣的自己查看資料.

下面我們來介紹第一種方式:

1. 利用WKWebView進(jìn)行交互

效果圖

通過本篇文章梁呈,至少可以學(xué)習(xí)到:

1. OC如何給JS注入對象及JS如何給iOS發(fā)送數(shù)據(jù)

2. JS調(diào)用alert东羹、confirm鲁僚、prompt時,不采用JS原生提示,而是使用iOS原生來實(shí)現(xiàn)

3. 如何監(jiān)聽web內(nèi)容加載進(jìn)度倦零、是否加載完成

4. 如何通過js來跳轉(zhuǎn)到iOS指定的頁面上

如何處理去跨域問題

創(chuàng)建配置類

在創(chuàng)建WKWebView之前藐石,需要先創(chuàng)建配置對象即供,用于做一些配置:

配置偏好設(shè)置

偏好設(shè)置也沒有必須去修改它,都使用默認(rèn)的就可以了于微,除非你真的需要修改它:

配置web內(nèi)容處理池

其實(shí)我們沒有必要去創(chuàng)建它逗嫡,因?yàn)樗緵]有屬性和方法:

eb內(nèi)容處理池,由于沒有屬性可以設(shè)置株依,也沒有方法可以調(diào)用驱证,不用手動創(chuàng)建.

配置JsWeb內(nèi)容交互

WKUserContentController是用于給JS注入對象的,注入對象后恋腕,JS端就可以使用:

1 window.webkit.messageHandlers.<name>.postMessage(<messageBody>)

來調(diào)用發(fā)送數(shù)據(jù)給iOS端抹锄,比如:

AppModel就是我們要注入的名稱,注入以后荠藤,就可以在JS端調(diào)用了伙单,傳數(shù)據(jù)統(tǒng)一通過body傳,可以是多種類型哈肖,只支持NSNumber, NSString, NSDate, NSArray,NSDictionary, and NSNull類型吻育。

下面我們配置給JSmain frame注入AppModel名稱,對于JS端可就是對象了:

當(dāng)JS通過AppModel發(fā)送數(shù)據(jù)到iOS端時淤井,會在代理中收到:

所有JS調(diào)用iOS的部分布疼,都只可以在此處使用哦摊趾。當(dāng)然我們也可以注入多個名稱(JS對象),用于區(qū)分功能游两。

創(chuàng)建WKWebView

加載H5頁面

配置代理

如果需要處理web導(dǎo)航條上的代理處理严就,比如鏈接是否可以跳轉(zhuǎn)或者如何跳轉(zhuǎn),需要設(shè)置代理器罐;

而如果需要與在JS調(diào)用alert梢为、confirmprompt函數(shù)時轰坊,通過JS原生來處理铸董,而不是調(diào)用JSalertconfirm肴沫、prompt函數(shù)粟害,那么需要設(shè)置UIDelegate,在得到響應(yīng)后可以將結(jié)果反饋到JS端:

添加對WKWebView屬性的監(jiān)聽

然后我們就可以實(shí)現(xiàn)KVO處理方法颤芬,在loading完成時悲幅,可以注入一些JSweb中。

這里只是簡單地執(zhí)行一段web中的JS函數(shù):

WKUIDelegate

JS原生的alert站蝠、confirm汰具、prompt交互,將彈出來的實(shí)際上是我們原生的窗口菱魔,而不是JS的留荔。

在得到數(shù)據(jù)后,由原生傳回到JS

WKNavigationDelegate

如果需要處理web導(dǎo)航操作澜倦,比如鏈接跳轉(zhuǎn)聚蝶、接收響應(yīng)、在導(dǎo)航開始藻治、成功碘勉、失敗等時要做些處理,就可以通過實(shí)現(xiàn)相關(guān)的代理方法:

JS端代碼

2. 利用UIWebView進(jìn)行交互

大家都知道UIWebView是最常見的SDK,平時項(xiàng)目中我們用的也比較多,它有一個stringByEvaluatingJavaScriptFromString方法可以將JavaScript嵌入頁面中桩卵。

通過這個方法我們可以在iOS中與UIWebView中的網(wǎng)頁元素交互.下面就來詳細(xì)介紹一下它的具體操作步驟.首先我們來加載一個網(wǎng)頁,看看他的源碼:

創(chuàng)建UIWebView

加載URL

效果圖

獲取當(dāng)前頁面的URL

獲取頁面的title

修改HTML元素標(biāo)簽的值

插入js代碼

提交表單

下載源代碼:

http://download.csdn.net/detail/baihuaxiu123/9524216

原文鏈接:http://blog.csdn.net/baihuaxiu123/article/details/51674726

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末验靡,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子吸占,更是在濱河造成了極大的恐慌晴叨,老刑警劉巖凿宾,帶你破解...
    沈念sama閱讀 216,692評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件矾屯,死亡現(xiàn)場離奇詭異,居然都是意外死亡初厚,警方通過查閱死者的電腦和手機(jī)件蚕,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,482評論 3 392
  • 文/潘曉璐 我一進(jìn)店門孙技,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人排作,你說我怎么就攤上這事牵啦。” “怎么了妄痪?”我有些...
    開封第一講書人閱讀 162,995評論 0 353
  • 文/不壞的土叔 我叫張陵哈雏,是天一觀的道長。 經(jīng)常有香客問我衫生,道長裳瘪,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,223評論 1 292
  • 正文 為了忘掉前任罪针,我火速辦了婚禮彭羹,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘泪酱。我一直安慰自己派殷,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,245評論 6 388
  • 文/花漫 我一把揭開白布墓阀。 她就那樣靜靜地躺著毡惜,像睡著了一般。 火紅的嫁衣襯著肌膚如雪斯撮。 梳的紋絲不亂的頭發(fā)上虱黄,一...
    開封第一講書人閱讀 51,208評論 1 299
  • 那天,我揣著相機(jī)與錄音吮成,去河邊找鬼橱乱。 笑死,一個胖子當(dāng)著我的面吹牛粱甫,可吹牛的內(nèi)容都是我干的泳叠。 我是一名探鬼主播,決...
    沈念sama閱讀 40,091評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼茶宵,長吁一口氣:“原來是場噩夢啊……” “哼危纫!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起乌庶,我...
    開封第一講書人閱讀 38,929評論 0 274
  • 序言:老撾萬榮一對情侶失蹤种蝶,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后瞒大,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體螃征,經(jīng)...
    沈念sama閱讀 45,346評論 1 311
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,570評論 2 333
  • 正文 我和宋清朗相戀三年透敌,在試婚紗的時候發(fā)現(xiàn)自己被綠了盯滚。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片踢械。...
    茶點(diǎn)故事閱讀 39,739評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖魄藕,靈堂內(nèi)的尸體忽然破棺而出内列,到底是詐尸還是另有隱情,我是刑警寧澤背率,帶...
    沈念sama閱讀 35,437評論 5 344
  • 正文 年R本政府宣布话瞧,位于F島的核電站,受9級特大地震影響寝姿,放射性物質(zhì)發(fā)生泄漏移稳。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,037評論 3 326
  • 文/蒙蒙 一会油、第九天 我趴在偏房一處隱蔽的房頂上張望个粱。 院中可真熱鬧,春花似錦翻翩、人聲如沸都许。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,677評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽胶征。三九已至,卻和暖如春桨仿,著一層夾襖步出監(jiān)牢的瞬間睛低,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,833評論 1 269
  • 我被黑心中介騙來泰國打工服傍, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留钱雷,地道東北人。 一個月前我還...
    沈念sama閱讀 47,760評論 2 369
  • 正文 我出身青樓吹零,卻偏偏與公主長得像罩抗,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子灿椅,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,647評論 2 354

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