9

使用 Ripple 在浏览器中测试 PhoneGap 应用程序的正确方法是什么？我需要做任何配置吗？

我有一个使用 PhoneGap 制作的“hello world”应用程序，我想在浏览器中对其进行测试，而不是为每次更改启动手机模拟器。我在本地网络服务器上运行它。我使用http://emulate.phonegap.com前往地址（例如，localhost:8888/sites/hello/www）。该应用程序开始加载，但我得到一个 404 的phonegap.js. 它正在检查的路径是localhost:8888/sites/hello/www/phonegap.js——这应该由模拟器提供吗？我需要挖掘文件吗？我正在使用股票 hello world 应用程序，所以我希望这些部件到位。

4

4 回答 4

14

您需要提供 phonegap.js 以使 Ripple 工作 - 只需在<head>index.html 中插入一个脚本标签以指向它。注意 Ripple 无法与 Phonegap 3.x 一起正常工作，因此请使用 Phonegap 2.x 版本中的 JS - 我使用的是 Android 包中的 cordova-2.9.0.js。Ripple 仅适用于 Google Chrome。

顺便说一句，如果您在启动 chrome 时使用该选项，您可以直接在 Chrome 中从文件系统打开 index.html 文件，而无需本地网络服务器--allow-file-access-from-files- 只需将其添加到快捷方式中，例如"C:\Program Files\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files

于 2013-11-03T18:45:40.813 回答
11

以下是我如何设置使用 Cordova 进行开发的机器。这些步骤显示了需要下载的内容以及创建一个简单的 hello world 应用程序，最后几个步骤启动了涟漪模拟器来测试应用程序。

Linux Mint 15：如何为 Android 开发设置 nodejs、npm、Apache Cordova、Ripple、Android SDK

参考：

Cordova Android 指南： http ://cordova.apache.org/docs/en/3.1.0/guide_platforms_android_index.md.html#Android%20Platform%20Guide

NodeJS 指南： https ://github.com/joyent/node/wiki/Installing-Node.js-via-package-manager

NPM Cordova 指南： https ://npmjs.org/package/cordova

Prereqs - 文件夹名称和位置都是变量，这意味着它们可以是你想要的任何东西

- 必须使用 chrome 进行波纹模拟器

  1. 下载 android sdk - http://developer.android.com/sdk/index.html
  2. 解压文件夹
  3. 将文件夹重命名为 adt-bundle
  4. 将目录更改为您的主文件夹。例子。cd /home/布莱恩
  5. 创建一个名为 Development 的文件夹
  6. 将 adt-bundle 移至 Development 示例。/home/brian/Development/adt-bundle
  7. 导出 PATH=${PATH}:/home/brian/Development/adt-bundle/sdk/platform-tools:/home/brian/Development/adt-bundle/sdk/tools
  8. sudo apt-get 安装蚂蚁

  9. 输入 android 会弹出 android sdk 窗口检查 api17 并安装

  10. sudo apt-get 删除 nodejs nodejs-dev npm

  11. sudo apt-get install python-software-properties python g++ make
  12. sudo apt-get install software-properties-common
  13. sudo add-apt-repository ppa:chris-lea/node.js
  14. sudo apt-get 更新
  15. sudo apt-get install nodejs
  16. 节点 -v
  17. npm -v
  18. npm install -g 科尔多瓦

  19. npm install -g 波纹模拟器

  20. cd /home/brian/开发/

  21. 科尔多瓦创建你好“HelloWorld”
  22. 你好
  23. 科尔多瓦平台添加android
  24. 科尔多瓦建造
  25. cd /home/brian/Development/hello/platforms/android/assets/www
  26. 波纹模拟-端口 1234
  27. 打开镀铬
  28. 导航到 localhost:1234/index.html?enableripple=cordova-2.0.0-Nexus4
  29. 回到终端，您可以按 Ctrl+c 杀死服务器
于 2013-11-10T15:56:52.593 回答
8

重要提示：首先卸载涟漪 Chrome-Addon！

解决方案 1：“修补它！”

要在 Ripple 中测试您的 phonegap3 应用程序，您必须使用apache git 存储库ripple_phonegap3.patch中的最新版本（0.9.19）并使用位于此 git-repo的补丁对其进行修补。按照位于同一存储库中的 README.md 文件中的说明进行操作。

新版本的涟漪不再是 chrome 扩展。它现在是一个 nodejs/expressjs 网络服务器，也支持其他浏览器。

解决方案 2：“逐步”（仅当您仅使用 phonegap3 时）

  • 下载波纹

    git clone https://git-wip-us.apache.org/repos/asf/incubator-ripple.git

  • 编辑lib/server/emulate/hosted.js

添加行

    var PG3_SCRIPTTAG_OLD= /<script type="text\/javascript" src="phonegap.js"><\/script>/;
    var PG3_SCRIPTTAG_NEW= '<script type="text/javascript" src="cordova.js"></script>';
    doc = doc.replace(PG3_SCRIPTTAG_OLD, PG3_SCRIPTTAG_NEW);

介于两者function localInjection()之间

        var doc = data.replace(HEAD_TAG,
                  '<head>' +
                    '<script>' +
                        BOOTSTRAP_FROM_IFRAME +
                    '</script>');

和

        res.send(doc);
  • 跑./configure
  • 跑jake
  • 利用bin/riddle

lg

快速

于 2013-11-08T13:50:17.590 回答
1

Icenium 有免费试用版，非常棒： http: //www.icenium.com/

于 2013-11-10T05:53:52.883 回答