如何显示其他域中的图像/Chrome打包应用程序

我有一个 JSON，它返回图像 URL 列表，以访问已放置在此域白名单 manifest.json 中的字段中的 JSON，但是当我尝试查看图片时，它抱怨无法访问图像。

1 - 如何Perm可以显示包App内没有的图片

2 - 如何下载图片到下载APP然后显示

对于第二个问题，我使用了 RAL，一个库试用谷歌，它工作了，但是我无法使用此出版物库进行测试，他声称出现错误，请点击图像库的链接并抱怨该错误：

lib: https://github.com/GoogleChrome/apps-resource-loader https://github.com/GoogleChrome/apps-resource-loader

Error: http://twitter.yfrog.com/oe24998653p http://twitter.yfrog.com/oe24998653p

您可以使用 XMLHttpRequest 请求外部图像并将其转换为 ObjectURL。然后设置src属性<img>标记每个 ObjectURL 并且它应该可以工作。

由于这是一个非常常见的用例，我们创建了一个库来简化它。只需删除 apps-resource-loaderral.min.js https://github.com/GoogleChrome/apps-resource-loader/blob/master/lib/ral.min.js到您的项目，然后：

var remoteImage, 
    container = document.querySelector('.imageContainer'),
    toLoad = { 'images': [ 
       'http://myserver.com/image1.png', 
       'http://myserver.com/image2.png' ] }; // list of image URLs

toLoad.images.forEach(function(imageToLoad) {
      remoteImage = new RAL.RemoteImage(imageToLoad);
      container.appendChild(remoteImage.element);
      RAL.Queue.add(remoteImage);
});
RAL.Queue.setMaxConnections(4);
RAL.Queue.start();

请记住，您需要获得许可manifest.json您将对其进行 XHR 处理的所有域。如果您事先不知道这些图像将托管在哪里，您可以请求任何网址的许可：

    permissions: ['<all_urls>'],

对于其他用途并获取完整的库，请参阅项目页面：https://github.com/GoogleChrome/apps-resource-loader https://github.com/GoogleChrome/apps-resource-loader

以及一个简单的演示：https://github.com/GoogleChrome/apps-resource-loader/tree/master/demo https://github.com/GoogleChrome/apps-resource-loader/tree/master/demo