我看不到刚刚上传的图片 [sails.js]

Question

我有这个要上传照片：

module.exports = function (req, image, url, callback) {
var filename = (Math.floor((Math.random() * 100000000000) + 1)) + ".png";
req.file(image).upload({
  dirname: '../../assets/images' + url
,
  saveAs: function(file, cb) {
    cb(null, filename);
  }
}, function(error, uploadedFiles) {
  return callback(null, "http://" + req.headers.host + "/images" + url + filename)
});

}

它会返回一个这样的 url：http://localhost:1349/images/dependent/photos/30363010266.png

我可以看到我的照片已上传到项目文件夹中，因为我亲眼看到它。但是网址不起作用，出现了找不到错误。

如果我重新启动服务器，URL 可以正常工作。

谢谢！

Answer 1

正如@Eugene Obrezkov 指出的那样，您的问题与您上传图片的位置和 grunt 任务运行器有关。所有资产都从该文件夹 (/assets) 复制到 .tmp，并由 grunt 任务运行程序监视更改，但这不包括新的图像文件（如果您要访问资产文件夹中的空文件夹，在您的情况下到图像文件夹）。所以解决方法很简单，你必须直接上传到.tmp文件夹，最好是.tmp/public/uploads/year/month/，你可以选择你认为合适的路径。现在有一个 caveat 使用这种方法，它是有一个 grunt 任务清除sails lift 上.tmp 文件夹的内容，所以你会得到相反的效果，现在要避免这种情况也很容易，您必须编辑 clean.js 任务以删除特定文件夹，以避免删除您的上传文件夹。

转到您的项目文件夹tasks/config/clean.js，并替换其中的代码以获取此代码，或根据需要进行修改。

module.exports = function(grunt) {
    grunt.config.set('clean', {
      dev: [
        getFolderPath('fonts/**'),
        getFolderPath('images/**'),
        getFolderPath('images/**'),
        getFolderPath('js/**'),
        getFolderPath('styles/**'),
        getFolderPath('*.*')
      ],
      build: ['www']
    });

    grunt.loadNpmTasks('grunt-contrib-clean');
};

function getFolderPath(folderName){
  return '.tmp/public/' + folderName;
}

现在您的上传内容将立即显示给您的最终用户，无需重新启动，并且重新启动不会删除这些上传内容。在尝试上传之前确保.tmp/public/uploads/ 路径存在，如果找不到，请使用mkdir 通过代码创建它。

还有其他解决方案，例如确保在服务器启动时要上传到的文件夹中至少有一个文件，或者使用符号链接，但我认为这是一种更简洁的方法。您可以在此处查看这些选项：

Image not showing immediately after uploading in sails.js

Answer 2

如果您查看tasks 文件夹，您会发现Grunt 任务将所有assets 文件夹复制到.tmp 文件夹并将.tmp 文件夹设为静态公用文件夹。

当您运行 Sails 应用程序时，它会运行这些 Grunt 任务，因此如果您将文件直接上传到 assets 文件夹，则在您重新运行服务器和 Grunt 任务之前将无法访问它。

解决方案？没有解决办法。基本上，你做错了。最佳实践是将图像\文件\任何内容存储在 S3 存储桶、Google 存储、至少另一个硬盘驱动器上，而不是 assets 本身。因为它是您项目的源文件，其中应该只包含项目本身所需的文件，而不是用户的文件等...

Answer 3

您无需修改​​任何繁重的任务即可实现。我有同样的问题，我刚刚解决了。

我看到您已经对其他 cmets 中发生的事情进行了解释，所以我将直接讨论我的解决方案。我将文件上传到 .tmp 文件夹，在上传回调时，我使用文件系统将它们复制到 assets 文件夹（fs-extra 是一个很棒的包）。

所以现在我可以在添加图像后立即在我的 UI 中看到图像（因为我将它们上传到 .tmp），当我的服务器停止时，.tmp 将丢失，但在下一次提升时再次生成并复制文件到资产。

希望对你有帮助！

Answer 4

这就是我解决这个问题的方法。答案需要几个步骤。我假设您想将最近上传的图片放在名为 users 的文件夹中。

步骤： 1.npm install express --save（如果你没有安装）

1. 在您的应用根目录中创建一个 Users 文件夹。

2. 打开文本编辑器，查看以下文件config\express.js

3. 添加或替换为代码 ` var express = require('express'); 模块.exports.http = { 自定义中间件：功能（应用程序）{ app.use('/users', express.static(process.cwd() + '/users')); } };

` 5. 确保新上传的图片放在Users文件夹中

6. 完成