InAppBrowser不适用于iOS的Phonegap 3.4.0

Question

我正尝试使用phonegap 3.4.0和jQuery mobile 1.4.0为iOS构建应用程序。我尝试了每个人都建议的一切。在应用程序中，我将点击链接，它将在应用程序中打开，但没有“后退”按钮或任何内容。因此，我必须强制关闭应用程序并重新开始回到主主屏幕。我有以下几点：

<a href="#" onclick="window.open('http://ok-ecig.com','_blank','location=no,closebuttoncaption=Done');" class="ui-btn"><i class="fa fa-shopping-cart fa-2x"></i><span> Shop Now</span></a> 

在我的config.xml文件：

<?xml version="1.0" encoding="UTF-8"?> 
<!-- config.xml reference: https://build.phonegap.com/docs/config-xml --> 
<widget xmlns  = "http://www.w3.org/ns/widgets" 
xmlns:gap = "http://phonegap.com/ns/1.0" 
id  = "com.[author].[appname]" 
version = "1.0.0"> 

<name>App Name</name> 

<description> 
</description> 

<author href="http://appauthor.com"> 
    App Author 
</author> 

<!-- 
Enable individual API permissions here. 
The "device" permission is required for the 'deviceready' event. 
--> 
<feature name="http://api.phonegap.com/1.0/device" /> 
<feature name="InAppBrowser"> 
    <param name="ios-package" value="CDVInAppBrowser" /> 
</feature> 

<plugin name="InAppBrowser" value="org.apache.cordova.InAppBrowser" /> 

<!-- 
If you do not want any permissions to be added to your app, add the 
following tag to your config.xml; you will still have the INTERNET 
permission on your app, which PhoneGap requires. 
--> 
<preference name="permissions"    value="none"/> 

<!-- Customize your app and platform with the preference element. --> 
<!-- <preference name="phonegap-version"  value="3.4.0" /> -->  <!-- all: current version of PhoneGap --> 
<preference name="orientation"    value="portrait" />  <!-- all: default means both landscape and portrait are enabled --> 
<preference name="target-device"    value="handset" />  <!-- all: possible values handset, tablet, or universal --> 
<preference name="fullscreen"     value="true" />   <!-- all: hides the status bar at the top of the screen --> 
<preference name="DisallowOverscroll"   value="true" /> 
<preference name="webviewbounce"    value="false" /> 
<preference name="UIWebViewBounce"   value="false" />  <!-- ios: control whether the screen 'bounces' when scrolled beyond the top --> 

<preference name="prerendered-icon"   value="true" />   <!-- ios: if icon is prerendered, iOS will not apply it's gloss to the app's icon on the user's home screen --> 
<preference name="stay-in-webview"   value="true" />   <!-- ios: external links should open in the default browser, 'true' would use the webview the app lives in --> 
<preference name="ios-statusbarstyle"   value="black-opaque" /> <!-- ios: black-translucent will appear black because the PhoneGap webview doesn't go beneath the status bar --> 
<preference name="detect-data-types"   value="true" />   <!-- ios: controls whether data types (such as phone no. and dates) are automatically turned into links by the system --> 
<preference name="exit-on-suspend"   value="false" />   <!-- ios: if set to true, app will terminate when home button is pressed --> 
<preference name="show-splash-screen-spinner" value="true" />   <!-- ios: if set to false, the spinner won't appear on the splash screen during app loading --> 
<preference name="auto-hide-splash-screen" value="true" />   <!-- ios: if set to false, the splash screen must be hidden using a JavaScript API --> 

<preference name="disable-cursor"    value="false" /> 

<!-- blackberry: prevents a mouse-icon/cursor from being displayed on the app --> 
<preference name="android-minSdkVersion"  value="7" />    <!-- android: MIN SDK version supported on the target device. MAX version is blank by default. --> 
<preference name="android-installLocation" value="auto" />   <!-- android: app install location. 'auto' will choose. 'internalOnly' is device memory. 'preferExternal' is SDCard. --> 

<!-- Plugins can also be added here. --> 
<!-- 
<gap:plugin name="Example" /> 
A list of available plugins are available at https://build.phonegap.com/docs/plugins 
--> 
<gap:plugin name="org.apache.cordova.inappbrowser" version="0.2.4" /> 

<!-- Define app icon for each platform. --> 
<icon src="icon.png" /> 
<icon src="res/icon/android/icon-36-ldpi.png" gap:platform="android" gap:density="ldpi" /> 
<icon src="res/icon/android/icon-48-mdpi.png" gap:platform="android" gap:density="mdpi" /> 
<icon src="res/icon/android/icon-72-hdpi.png" gap:platform="android" gap:density="hdpi" /> 
<icon src="res/icon/android/icon-96-xhdpi.png" gap:platform="android" gap:density="xhdpi" /> 
<icon src="res/icon/blackberry/icon-80.png"  gap:platform="blackberry" /> 
<icon src="res/icon/blackberry/icon-80.png"  gap:platform="blackberry" gap:state="hover"/> 
<icon src="res/icon/ios/icon-57.png"   gap:platform="ios"  width="57" height="57" /> 
<icon src="res/icon/ios/icon-72.png"   gap:platform="ios"  width="72" height="72" /> 
<icon src="res/icon/ios/icon-57-2x.png"   gap:platform="ios"  width="114" height="114" /> 
<icon src="res/icon/ios/icon-72-2x.png"   gap:platform="ios"  width="144" height="144" /> 
<icon src="res/icon/webos/icon-64.png"   gap:platform="webos" /> 
<icon src="res/icon/windows-phone/icon-48.png" gap:platform="winphone" /> 
<icon src="res/icon/windows-phone/icon-173.png" gap:platform="winphone" gap:role="background" /> 

<plugin name="InAppBrowser" value="CDVInAppBrowser" /> 

<!-- Define app splash screen for each platform. --> 
<gap:splash src="res/screen/android/screen-ldpi-portrait.png" gap:platform="android" gap:density="ldpi" /> 
<gap:splash src="res/screen/android/screen-mdpi-portrait.png" gap:platform="android" gap:density="mdpi" /> 
<gap:splash src="res/screen/android/screen-hdpi-portrait.png" gap:platform="android" gap:density="hdpi" /> 
<gap:splash src="res/screen/android/screen-xhdpi-portrait.png" gap:platform="android" gap:density="xhdpi" /> 
<gap:splash src="res/screen/blackberry/screen-225.png"   gap:platform="blackberry" /> 
<gap:splash src="res/screen/ios/screen-iphone-portrait.png" gap:platform="ios"  width="320" height="480" /> 
<gap:splash src="res/screen/ios/screen-iphone-portrait-2x.png" gap:platform="ios"  width="640" height="960" /> 
<gap:splash src="res/screen/ios/screen-ipad-portrait.png"  gap:platform="ios"  width="768" height="1024" /> 
<gap:splash src="res/screen/ios/screen-ipad-landscape.png"  gap:platform="ios"  width="1024" height="768" /> 
<gap:splash src="res/screen/windows-phone/screen-portrait.jpg" gap:platform="winphone" /> 
<gap:config-file platform="ios" parent="UIViewControllerBasedStatusBarAppearance" overwrite="true"> 
    <false/> 
</gap:config-file> 

<!-- 
Define access to external domains. 

<access />   - a blank access tag denies access to all external resources. 
<access origin="*" /> - a wildcard access tag allows access to all external resource. 

Otherwise, you can specify specific domains: 
--> 
<access origin="http://127.0.0.1*"/> <!-- allow local pages --> 
<access origin="*" /> 
<!-- 
<access origin="http://phonegap.com" />     - allow any secure requests to http://phonegap.com/ 
<access origin="http://phonegap.com" subdomains="true" /> - same as above, but including subdomains, such as http://build.phonegap.com/ 
<access origin="http://phonegap.com" browserOnly="true" /> - only allows http://phonegap.com to be opened by the child browser. 
--> 

我的index.html头：

<link rel="stylesheet" href="css/style.css" /> 
<link rel="stylesheet" type="text/css" href="css/jquery.mobile.flatui.min.css" /> 
<link rel="stylesheet" href="fa/css/font-awesome.min.css"> 
<script src="js/jquery.js"></script> 
<script src="js/jquery.mobile-1.4.0-rc.1.js"></script> 
<script src="cordova.js"></script><!-- 3.4.0 --> 

我缺少什么？

Answer 1

让我告诉你我是如何使用它。它可以帮助你找出问题所在。

在​​3210你应该具备以下条件：

<widget xmlns = "http://www.w3.org/ns/widgets" 
    xmlns:gap = "http://phonegap.com/ns/1.0" 
    id  = "...." 
    version = "...."> 

....

<access origin="*" /> 

....

<feature name="InAppBrowser"> 
    <param name="android-package" value="org.apache.cordova.InAppBrowser"/> 
</feature> 
<feature name="InAppBrowser"> 
    <param name="ios-package" value="CDVInAppBrowser" /> 
</feature> 

....

<gap:plugin name="org.apache.cordova.inappbrowser" /> 

在你要开innAppBrowser链接，您应该具备以下每.html文件：

<link rel="stylesheet" href="css/jquery.mobile-1.4.2.min.css"> 

<script type="text/javascript" charset="utf-8" src="cordova.js"></script> 

<script type="text/javascript" charset="utf-8" src="js/jquery-1.11.1.min.js"></script> 
<script type="text/javascript" charset="utf-8" src="js/jquery.mobile-1.4.2.min.js></script> 

注：我认为cordova.js应该是包含在你的代码中的第一个JavaScript的。任何其他的JavaScript应该遵循。

希望它有帮助！

Answer 2

这听起来像inapp浏览器插件没有加载。

通过你的配置，它看起来像你正在使用电话差距构建来建立你的项目。但是，它包含了电话差距构建和常规电话差距配置项目的组合。

由于您使用的构建应该只使用：

<gap:plugin name="org.apache.cordova.inappbrowser" version="0.2.4" /> 

添加的应用程式内浏览器插件。见https://build.phonegap.com/plugins/658

您应该删除这一点，其他任何引用插件：

<plugin name="InAppBrowser" value="CDVInAppBrowser" /> 

这将使该插件正确加载，你应该能够验证它是否包含在手机缝隙构建建立页面。

（如果你不使用PhoneGap的版本，您需要删除生成相关的配置项目，并按照下列指示安装的插件本地http://docs.phonegap.com/en/3.4.0/guide_cli_index.md.html#The%20Command-Line%20Interface）

Answer 3

<gap:plugin name="org.apache.cordova.inappbrowser" version="0.2.4" />

将确保inappbrowser插件项目。

请确保cordova.js位于index.html的第一个javascript中。

这对我的项目很有效。