一、應用場景
我們在做cordova app開發(fā)的時候，可能會經(jīng)常遇到這種需求阶女。比如在你的app中，你想打開一個URL哩治，但是又不想跳轉(zhuǎn)到系統(tǒng)的瀏覽器去打開秃踩，而是希望直接在app中打開，這個時候就要用到這個插件了业筏。 它會直接在我們的app中生成一個瀏覽器對象并打開你的網(wǎng)頁憔杨。
二、添加插件
1. 如果你的項目是cordova原生項目蒜胖，也就是說包含CordovaLib消别，可以通過命令去安裝插件的抛蚤，那你可以直接進入項目下面，運行：
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"> cordova plugin add cordova-plugin-inappbrowser</pre>
這樣inappbrowser插件就添加到我們的項目中了妖啥。
2.如果你的項目是改動后的cordova項目霉颠，估計大部分公司的cordova項目是改動后的。不可以直接用命令安裝荆虱， 這個時候就要去手動添加這個插件了蒿偎。
手動添加當然也很簡單，但是你需要先獲得這個插件怀读，你可以通過命令去建一個cordova原生項目(參考我的另一篇文章：Cordova入門系列（一）創(chuàng)建項目)诉位。創(chuàng)建好這個項目我們就可以用命令添加inappbrowser插件了。參考上面步驟1菜枷。這樣的話我們就獲取到了這個插件苍糠。
接著我們要將這個插件手動添加到我們的公司或自己的項目下面。我們有5處地方需要改：
1). 打開我們創(chuàng)建的原生cordova項目（并且安裝了inappbrowser插件）啤誊。將src下面的org.apache.cordova.inappbrowser復制到我們自己的項目的src下面岳瞭。
2). 將assets/www/plugins/cordova-plugin-inappbrowser，復制到我們自己項目下的assets/www/plugins/下面蚊锹。
3). 修改assets/www/cordova_plugins.js瞳筏，添加對應的inappbrowser的信息。
4). 修改res/xml/config.xml牡昆，添加對應的inappbrowser的<feature />信息姚炕。（3.4步可以參考你創(chuàng)建的那個原生cordova項目下面這兩個文件都是什么信息。）
5). 將res下面的資源圖片丢烘，復制到我們自己的項目下面柱宦。
最近做我們公司的項目，使用這個插件的時候播瞳，添加進去后（手動添加的掸刊，并不是通過命令添加的），效果沒實現(xiàn)赢乓，InAppBrowser點擊后會自動閃退忧侧。發(fā)現(xiàn)是由于資源圖片沒添加導致的。添加drawable/drawable-hdpi/.....下的圖片(3個骏全，next, previous, remove)到對應的文件夾即可。
三尼斧、使用這個插件
使用方法很簡單姜贡，只需要在我們的js中通過window.open()或者cordova.inappbrowser.open()即可。
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"> cordova.InAppBrowser.open(URL,target,options)
window.open(URL,target,options)</pre>
1. URL參數(shù)為瀏覽器跳轉(zhuǎn)的地址棺棵；
2. target的參數(shù)有三種：
_self：如果URL地址在WhiteList中楼咳，則用Cordova的WhiteList將其打開熄捍；
_blank：直接在App中將其地址打開；
_system：則是用手機默認瀏覽器將新頁面打開母怜；
3. options參數(shù)包含以下信息：
location：設置為yes或no來打開或關(guān)閉插件的locationbar余耽；
hidden：設置為yes則加載出頁面但不顯示；設置為no則正常加載頁面苹熏；
Android獨有屬性：
zoom：設置為yes則顯示縮放瀏覽器頁面的按鈕碟贾，設置為no則不顯示縮放按鈕；
hardwareback：設置為yes則調(diào)用Android返回鍵回到前一界面轨域，設置為no則返回鍵為退出瀏覽器頁面袱耽；
iOS獨有屬性：
closebuttoncaption：設置yes則顯示Done按鈕，設置為no則隱藏Done按鈕干发，點擊Done按鈕關(guān)閉瀏覽器頁面朱巨；
toolbar：設置為yes則顯示toolbar；no則隱藏toolbar（toolabar相當于Android的返回鍵功能）枉长；
keyboardDisplayRequiresUserAction：設置為yes或者no來控制打開鍵盤時是否通過JavaScript調(diào)用focus()接收焦點冀续，默認為yes；
toolbarposition：設置為top或者bottom必峰，使工具欄顯示在窗口的頂部或底部洪唐；
四、舉個栗子
舉個簡單的例子自点，假如在你的頁面上有一個button桐罕，點擊它會調(diào)用inappbrowser
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><button onclick="cordova.InAppBrowser.open('http://www.baidu.com', '_blank', 'location=yes')"> Test InAppBrowser </button></pre>
