我有一个（聚合物）Web 组件，我希望人们能够以跨源资源共享 (CORS) 方式访问该组件。这工作得很好，只是我不确定如何为该组件内的 JS 代码中的图像和 JSON 文件等资源提供相对路径。它们被解释为相对于包含页面，而不是相对于 HTML 导入。我什么think我想要一个 JS 变量，它给出导入的包含 html 文件的路径。相对路径很重要，因为我还希望人们能够轻松地将其部署到自己的站点，而不是依赖于我的资源副本的硬编码路径。
例如，您在 example.com 加载 index.html，它具有：
<link rel="import" href="//my-site.com/components/my-component/my-component.html">
<my-component> ... </my-component>
现在里面my-component.html，我有一些 JS 根据用户的配置文件加载一些资源 - i18next.js 的图像和 JSON 语言文件。问题是，除非我将它们指定为绝对路径my-site.com，我不想这样做，它们将被解释为相对于页面example.com/index.html，不相对于路径my-component.html
我在模板中静态指定的任何图像都可以正常工作并正确加载，因为它是相对于 HTML 导入路径的。我只是不确定如何对从 JS 加载的资源执行此操作，因为它们将相对于包含页面（example.com/index.html）。是否有某个属性或函数公开了此导入路径？谢谢。
要创建相对路径，您可以使用resolvePath聚合物元素的方法。这是关于它的文档 https://www.polymer-project.org/0.5/docs/polymer/polymer.html#resolvepath
ex: this.resolvePath('x-foo.png')
Update: resolvePath被替换为resolveUrl for 聚合物1.0 https://www.polymer-project.org/1.0/docs/api/Polymer.Base#method-resolveUrl
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
