从 mongodb + gridfs 检索图像到 Ember js

Question

我在 Ember JS 中有一个函数可以将图像上传到 Sails JS，它使用“gridfs”适配器将图像存储在 Mongo db 中，到目前为止一切顺利。

我可以看到块和文件记录正在更新，一切正常。

问题在于检索图像本身，我不知道为什么，但似乎 Ember 找不到刚刚上传的图像，我尝试使用“gridfs”适配器中描述的读取方法但得到了什么都没有。

这是我的 Ember 模板

<div class="image">
    {{#each model.files as |image|}}
        <img src="http:localhost:1337/{{file.path}}" class="img-thumbnail">
    {{/each}}
</div>

我在 Ember 控制器中的上传方法是：

upload(file) {
    file.upload('http://localhost:1337/uploads/file').then(response => {
        this.get('model.files).pushObject({ path : response.body.file })
})

我在 Sails JS 中的上传控制器是：

module.exports = {
    file : function(req, res) {
        console.log(req.body);
        req.file('file').upload({
            adapter : require('skipper-gridfs'),
            uri : 'mongodb://192.168.99.100:32769/admin.uploads',
        }, function (err, files) {
            if (err) return res.negotiate('this is my error ' + err);
            skipperAdapter.read(files, function(error, file) {
                if (err) return res.negotiate('Reading Error' + err);
                console.log(files, file);
                res.json({ file : files[0] })
            })
        })
    }
};

也试过了

module.exports = {
    file : function(req, res) {
        console.log(req.body);
        req.file('file').upload({
            adapter : require('skipper-gridfs'),
            uri : 'mongodb://192.168.99.100:32769/admin.uploads',
        }, function (err, files) {
            if (err) return res.negotiate('this is my error ' + err);
            res.json( { file : files[0].fd.split('/assets') } )[0]
        });
    }
};

我收到错误“GET http://localhost:1338/237e0d9e-7554-41e0-b2ac-666cdc5c2efa.jpg 404（未找到）”

Answer 1

我会从这个开始：

我收到一个错误“GET http://localhost:1338/237e0d9e-7554-41e0-b2ac-666cdc5c2efa.jpg404 （未找到）”

所以首先你应该检查谁在为返回 404 的端点提供服务。你有一个路由和一个控制器来响应匹配的 url：/:file_name？

您还可以尝试通过该端点动态（通过控制器操作）提供硬编码文件（图像），以确保其他一切正常。然后你可以看到你与 gridfs 的集成还有什么问题。我的猜测是，您不能像尝试那样直接使用文件路径，而是需要使用它来查询 gridfs 的文件，然后将来自 gridfs 的响应流式传输/返回到客户端（通过控制器操作）。我的意思是做类似于下面代码的事情（取自https://ciphertrick.com/2017/02/28/file-upload-with-nodejs-and-gridfs-mongodb/）：

app.get('/file/:filename', function(req, res){
    // replace gfs with whatever you make a connection to gfs with e.g. the adapter you're mentioning
    gfs.collection('ctFiles'); //set collection name to lookup into

    /** First check if file exists */
    gfs.files.find({filename: req.params.filename}).toArray(function(err, files){
        if(!files || files.length === 0){
            return res.status(404).json({
                responseCode: 1,
                responseMessage: "error"
            });
        }
        /** create read stream */
        var readstream = gfs.createReadStream({
            filename: files[0].filename,
            root: "ctFiles"
        });
        /** set the proper content type */
        res.set('Content-Type', files[0].contentType)
        /** return response */
        return readstream.pipe(res);
    });
});