PhoneGapBuild - 本地资产未加载到 webview 中

Question

我正在尝试使用 PhoneGapBuild 网站将我的 AngularJS 移动网站打包为 PhoneGap/Cordova 混合应用程序。我能够为 IOS 和 Android 成功上传、构建和安装应用程序，但是，当运行任何设备上的应用程序时，我只会看到空白屏幕。

附加信息：

这是我第一次尝试创建移动应用程序。
我正在使用 build.phonegap.com 构建我的移动网站的 html 资产作为 android 和 ios 的混合应用程序，利用 config.xml 文件(以上).
目标是 Android sdk 版本 7 和 iOS 默认。
我正在 Android Charge 和 iPhone 5c

如果 "window.cordova" 存在但不存在，我已将调试器 "weinre" 用于 console.log。但是，"window.angular" 和 "window._" 之类的东西确实存在，因为我是从外部 CDN 加载它们的。看起来我的本地引用资产中的 none 正在加载（通过其中的 console.log 确认）。我试过引用“/cordova.js”、"www/cordova.js"、“/www/cordova.js”都无济于事。

是否有我缺少的权限或 XML 配置或其他完全没有的东西？

需要说明的是，我在 index.html 文件中引用了 cordova：

<script src="cordova.js"></script>

这是我的配置文件：

<?xml version="1.0" encoding="utf-8"?>

<widget id="com.tristatetennis.app" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0" xmlns:gap="http://phonegap.com/ns/1.0">
    <name>TriStateTennis</name>
    <description>Tennis</description>
    <content src="index.html" />
    <icon src="icon.png" />
    <access origin="*" />
    <preference name="permissions" value="none" />
    <preference name="orientation" value="default" />
    <preference name="target-device" value="universal" />
    <preference name="fullscreen" value="true" />
    <preference name="webviewbounce" value="true" />
    <preference name="prerendered-icon" value="true" />
    <preference name="stay-in-webview" value="false" />
    <preference name="ios-statusbarstyle" value="black-opaque" />
    <preference name="detect-data-types" value="true" />
    <preference name="exit-on-suspend" value="false" />
    <preference name="show-splash-screen-spinner" value="true" />
    <preference name="auto-hide-splash-screen" value="true" />
    <preference name="disable-cursor" value="false" />
    <preference name="android-minSdkVersion" value="14" />
    <preference name="android-installLocation" value="auto" />
    <plugin name="cordova-plugin-battery-status" />
    <plugin name="cordova-plugin-camera" />
    <plugin name="cordova-plugin-media-capture" />
    <plugin name="cordova-plugin-console" />
    <plugin name="cordova-plugin-contacts" />
    <plugin name="cordova-plugin-device" />
    <plugin name="cordova-plugin-device-motion" />
    <plugin name="cordova-plugin-device-orientation" />
    <plugin name="cordova-plugin-dialogs" />
    <plugin name="cordova-plugin-file" />
    <plugin name="cordova-plugin-file-transfer" />
    <plugin name="cordova-plugin-geolocation" />
    <plugin name="cordova-plugin-globalization" />
    <plugin name="cordova-plugin-inappbrowser" />
    <plugin name="cordova-plugin-media" />
    <plugin name="cordova-plugin-network-information" />
    <plugin name="cordova-plugin-splashscreen" />
    <plugin name="cordova-plugin-vibration" />
    <!-- <plugin name="cordova-plugin-whitelist" version="1" /> -->
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
    </platform>
</widget>

谢谢

Answer 1

好消息是你的 config.xml 看起来不错，比大多数人都要好。

可以肯定的是，我们正在谈论 PGB (PhoneGap Build)，由 Phonegap/Adobe 提供的 cloud-based 构建服务。
你的大部分问题都源于误入
#5 在设计应用程序时，认为 phonegap 就像网站或网络浏览器一样工作。 Top Mistakes by Developers new to Cordova/Phonegap
请务必阅读所有粗体句子，因为您可能需要一遍又一遍地阅读。
关于我之前谈到的部分，您的应用程序不能成为您网站的包装器，这是您需要知道的：

Quote Apple iTunes Guidelines - 2.12

Apps that are not very useful, unique, are simply web sites bundled as Apps, or do not provide any lasting entertainment value may be rejected
对于Phonegap Build，它的主要资产（index.html、config.xml）必须在根目录中。这意味着两个文件 *必须* 位于同一目录中。这也意味着子目录可以包含其他 web-related 资产，例如 javascript、css 和更多网页。
这个错误来自于误入 #1 Top Mistakes by Developers new to Cordova/Phonegap。如果您使用的是 Cordova/Phonegap CLI，那么 config.xml 位于 index.html 下面一个目录，而 index.html 位于 www/ .
在config.xml中不使用phonegap-version时，您将获得最新版本，目前为cli-5.2.0。这有很多含义。
您不能要求 android-minSdkVersion 小于编译器支持的值。文档说 7 没问题，但这是一个错误。支持的最低 Android API 是 14（Ice Cream Sandwich).
This requirement is extremely difficult to realize because you have to read the *Cordova* documentation. Android Platform Guide -> 要求和支持。如果要支持 7，则需要使用 Phonegap CLI.
如果您使用的是 Android 6.0，PGB，YET 不支持。如果您正在使用 iOS9，Cordova 最近刚刚 released 08 Dec 2015 (with hot fixes 2015 年 12 月 18 日），PGB 不支持，YET。 这是因为 PGB，仍然使用 Cordova 编译器来完成它的工作。
您可以使用 cordova.js 或 phonegap.js。没关系，两者都支持。有关详细信息，请参阅：Documentaion -> Introduction -> Getting Started with Build -> Sections -> 确保您仍然可以访问 PhoneGap API
确保你使用所有插件的版本。
Documentaion -> 配置 -> Plugins -> Including a plugin in your project

If you omit the spec (version) tag, your app will always be built with the latest version of the plugin. It will be updated automatically the next time you update your app code after a plugin is updated, which may cause unexpected behaviour.

另外，这里有一些帮助链接和常见问题解答可以提供帮助：

Google Group of Cordova/Phonegap CLI 和 SDK（适用于 IDE）
"official" Nitobi forum for Phonegap Build
Top Mistakes by Developers new to Cordova/Phonegap
Core Plugins Setup
HOW TO apply the Cordova/Phonegap the whitelist system

Answer 2

原来我的问题与 AngularJS 与 PhoneGap/Cordova 的集成有关。首先，手头的具体问题是由于我的 HTML 标记中的 base 标记引起的。当 html5 模式设置为 true 时，Angular 需要基本标签。但是，html5 模式不适用于 PhoneGap/Cordova，如 here 所述。要解决此问题，您必须执行以下操作：

从 HTML 标记中完全删除 base 标签
确保所有 URL 引用都是 相对的 （即没有前导“/”）
设置$locationProvider.html5模式(false);
$sceDelegateProvider.resourceUrlWhitelist(['**']); (docs)
$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|tel):/); (reference)

希望这对某人有所帮助

PhoneGapBuild - 本地资产未加载到 webview 中

PhoneGapBuild - Local assets are not loaded in webview

webview

cordova

phonegap-build

hybrid-mobile-app