PhoneGap中的绝对路径问题

Question

我的情况如下： 我有一个index.html和一些JavaScript，从服务器加载HTML片段。在这些片段中，我有一些图片的URL，例如/some/folder/picture.jpg。

当然，在PhoneGap中这些不起作用。Weinre告诉我，PhoneGap试图从file:///some/folder/picture.jpg加载图片。

有什么解决办法吗？我想到了像base href这样的东西，或者在PhoneGap中进行一些配置，可以指定根路径，但我没有找到类似的内容...

谢谢， Michael

- Michael Sauter

---

这些图片是加载在设备上还是在服务器上？ - Simon MacDonald

对于服务器上的文件，您必须使用绝对 URL（http://www.myserver.com/some/folder/picture.jpg）。 - lexicore

@Simon 在网站上，我想要从服务器加载图片。在手机上，我希望能够本地加载图片。 - Michael Sauter

Answer 1

我曾经遇到过同样的问题，尤其是当你有很多视图（页面）并且想要从菜单中加载其中一个时，但你不知道当前位置。

简单的解决方法是使用window.location对象。

window.location.href.split('www')[0] + 'www'

这将为您提供到您“基础”的绝对URL。 www是IOS和Android相关的文件夹，因此这也使您的应用程序在多个平台上兼容。

从这里，您可以使用一个正则表达式，像jquery mobile一样通过data- *属性来描述它们的元素来传递整个文档。您只需使用返回的路径替换正则表达式即可。您需要在初始化期间执行此操作，否则会创建大量瓶颈。

希望这能帮助您，并符合您的要求。

问候，

Sententia

- Sententia

Answer 2

使用<base>是不行的，因为/总是相对于主机的，它不能被重新定义为子目录中的路径。你有两个选择：

• 重写你的HTML，使用完全相对路径，例如../../some/folder/picture.jpg（或者让某些东西在构建步骤中为你进行重写）；或者

• 修改“浏览器”（PhoneGap的包装器），使其以不同的方式加载URL。

我不熟悉PhoneGap，所以无法评论自动选项，但我个人会开始使用相对URL。

- Kevin Reid

---

感谢您的回答。与此同时，我实现了以下解决方案：

• 在网站上使用<base>和相对于其的图像URL
• 为PhoneGap重写所有（绝对）图像路径，如CSS等。

- Michael Sauter