一、應用場景
我們在做cordova app開發的時候，可能會經常遇到這種需求。比如在你的app中，你想打開一個URL，但是又不想跳轉到系統的瀏覽器去打開，而是希望直接在app中打開，這個時候就要用到這個插件了。 它會直接在我們的app中生成一個瀏覽器對象并打開你的網頁。
二、添加插件
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入門系列（一）創建項目)。創建好這個項目我們就可以用命令添加inappbrowser插件了。參考上面步驟1。這樣的話我們就獲取到了這個插件。
接著我們要將這個插件手動添加到我們的公司或自己的項目下面。我們有5處地方需要改：
1). 打開我們創建的原生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步可以參考你創建的那個原生cordova項目下面這兩個文件都是什么信息。）
5). 將res下面的資源圖片，復制到我們自己的項目下面。
最近做我們公司的項目，使用這個插件的時候，添加進去后（手動添加的，并不是通過命令添加的），效果沒實現，InAppBrowser點擊后會自動閃退。發現是由于資源圖片沒添加導致的。添加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參數為瀏覽器跳轉的地址；
2. target的參數有三種：
_self：如果URL地址在WhiteList中，則用Cordova的WhiteList將其打開；
_blank：直接在App中將其地址打開；
_system：則是用手機默認瀏覽器將新頁面打開；
3. options參數包含以下信息：
location：設置為yes或no來打開或關閉插件的locationbar；
hidden：設置為yes則加載出頁面但不顯示；設置為no則正常加載頁面；
Android獨有屬性：
zoom：設置為yes則顯示縮放瀏覽器頁面的按鈕，設置為no則不顯示縮放按鈕；
hardwareback：設置為yes則調用Android返回鍵回到前一界面，設置為no則返回鍵為退出瀏覽器頁面；
iOS獨有屬性：
closebuttoncaption：設置yes則顯示Done按鈕，設置為no則隱藏Done按鈕，點擊Done按鈕關閉瀏覽器頁面；
toolbar：設置為yes則顯示toolbar；no則隱藏toolbar（toolabar相當于Android的返回鍵功能）；
keyboardDisplayRequiresUserAction：設置為yes或者no來控制打開鍵盤時是否通過JavaScript調用focus()接收焦點，默認為yes；
toolbarposition：設置為top或者bottom，使工具欄顯示在窗口的頂部或底部；
四、舉個栗子
舉個簡單的例子，假如在你的頁面上有一個button，點擊它會調用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>
