使用Phonegap构建时,Angular应用程序不起作用

时间:2014-10-29 13:44:11

标签: angularjs debugging cordova phonegap-build

背景:

我已经构建了一个在浏览器上运行良好的Angular应用程序。 在前端,我有HTML / CSS / Angular / Bootstrap,后端是Web API。所以它是完全分开的。

我把前面的代码压缩了,用Phonegap构建了android应用程序。当我运行它时,我可以看到我的网站的第一个屏幕。我已经确认有效的角度代码,因为我可以根据用户未登录的事实看到它过滤导航。 但是当我尝试去我的应用程序的任何其他页面时,我得到一个空屏幕,所以我尝试使用PG远程调试器远程调试它。每当我尝试加载除主页之外的任何内容时,我都会松开与目标的连接。我还没有在控制台中看到任何JS错误。

这是日志中唯一的东西:

    "exception firing pause event from native"
    "exception firing resume event from native"

我错过了可能导致此行为的某些配置部分,还是有其他方法可以调试此问题?

1 个答案:

答案 0 :(得分:1)

由于您使用的是angularJS,我猜测您在本地使用网络服务器在浏览器上运行应用程序,所以一切似乎都运行良好

虽然PhoneGap使用 file server WebView上运行您的应用,这类似于在没有网络服务器的情况下在浏览器上打开index.html。最重要的是,如果您只需打开index.html而不使用网络服务器就可以让您的应用在桌面浏览器上运行,那么当您构建为PhoneGap应用时,它将起作用。

在浏览器上测试应用时,您可能遇到Cross-Origin问题,如果您的应用正在进行REST API调用,或者您正在从另一个.html文件加载angularJS模板,则会发生这种情况,这些跨源限制是在PhoneGap构建中注意。因此,在本地浏览器上进行测试时,您可能需要使用web security disabled打开Chrome。

如果您使用网络服务器开发了应用以进行测试,那么您可能拥有用于加载资源或href的绝对网址,您必须将这些网址更改为 relative URL paths

例如,将<a href="/#/next-page">更改为<a href="#/next-page">,或<img src="/images/logo.png">更改为<img src="images/logo.png">