Meteor android 应用不显示图像

Question

我正在使用优秀的 file-collection 软件包，

https://atmospherejs.com/vsivsi/file-collection

将图像存储在我的 Mongo 数据库中。运行 Android 上的应用程序不显示图像（它们显示为损坏的图像）。在浏览器中完美。

我不认为这个问题是这个包独有的，因为它使用 Mongo 的 gridfs 来存储图像，并提供 URL 来访问它们。

这是 Vaughn 在文档中的注释：

Cordova Android Bug with Meteor 1.2+

Due to a bug in the Cordova Android version that is used with Meteor 1.2, you will need to add the following to your mobile-config.js or you will have problems with this package on Android devices:

App.accessRule("blob:*");

我做了，但没有成功。

我还看到文档引用设置 headers 来处理 CORS 问题，如下所示：

myFiles = new FileCollection('myFiles',
  { resumable: true,    // Enable built-in resumable.js chunked upload support
    http: [             // Define HTTP route
      { method: 'get',  // Enable a GET endpoint
        path: '/:md5',  // this will be at route "/gridfs/myFiles/:md5"
        lookup: function (params, query) {  // uses express style url params
          return { md5: params.md5 };       // a query mapping url to myFiles
        },
        handler: function (req, res, next) {
           if (req.headers && req.headers.origin) {
             res.setHeader('Access-Control-Allow-Origin', 'http://meteor.local'); // For Cordova
             res.setHeader('Access-Control-Allow-Credentials', true);
           }
           next();
        }
      },

但还是没有成功。

查看检查器上的网络选项卡，我什至看不到来自服务器的图像请求，这表明它被 Cordova 代码中的某些东西拒绝了，它甚至没有尝试出去并获取图像。

我已经使用 Vaughn 的演示应用重现了这个问题，我已经分叉并添加了 android 平台，所以如果你愿意尝试和帮助，它已经准备好了。

https://github.com/mikkelking/meteor-file-sample-app

如果你做流星运行 android-device 它应该运行在 Android 上。您将需要注册然后上传图像才能看到问题。在浏览器中它工作正常。

任何帮助将不胜感激，这是我项目的一个障碍。我考虑过的一种选择是将图像移动到 S3 存储桶，我认为这应该可行，但如果可以的话，我想将图像保留在数据库中。

Answer 1

我曾经遇到过与 gridfs 类似的问题。我认为问题的出现是因为图像源是相对源。所以你的图像源来自本地主机。它适用于网络版本，因为浏览器与您的服务器位于同一台机器上，因此本地主机源可以正常工作。但在 android 设备上它不会工作，因为图像不在该设备上提供。

当我遇到这个问题时，我刚刚部署到生产环境并且它在移动设备上工作，因为图像源指向互联网上的 url 而不是相对于设备。这适用于生产，但不适用于开发测试。

当我看到这个问题时，我克隆了你的代码并让它在本地开发的 android 设备上运行。

我做的第一步是将 ROOT_URL 环境变量和移动服务器设置为指向您的本地服务器。当你在本地运行 meteor 时，你可以运行这样的命令来设置这些变量，使用你计算机的本地 ip 地址

export ROOT_URL=http://192.168.1.255:3000 && meteor run android-device --mobile-server=http://192.168.1.255:3000

接下来，在你的 sample.coffee Template.collTest.helpers link 函数中，你需要使用绝对 url 而不是相对 url （这样在你的移动设备上它将查看您的本地服务器而不是本地主机）。要动态获取它以便它在不同的服务器上工作，您可以使用类似这样的东西

Meteor.absoluteUrl(myData.baseURL + "/md5/" + this.md5)

然后我不得不将计算机的 IP 地址 http://192.168.1.255:3000 添加到 sample.jade 文件中的内容安全策略中。

我差点忘了，此时我遇到了 403 forbidden 错误。我更改了 sample.coffee 中的 myData.allow 读取函数，然后返回 true 并且 403 消失了，那里的权限发生了一些事情

之后图像出现在我的 android 设备上。

Meteor android 应用不显示图像

Meteor android app not showing images

javascript

blob

gridfs

meteor