Sails.js文件上傳 - 在上傳實際完成之前銷毀req.body和.upload（）回調

Question

我正在使用Sails構建一個網站，其中一個頁面包含一個表單。 此表單具有多個文本輸入，以及用於上載圖像的文件上載輸入。 來自所有文本輸入的信息存儲在Postgres數據庫中，圖像使用此處 sails文檔中描述的.upload()函數上傳並轉換為數據uri，然后存儲在同一Postgres數據庫中並用於顯示網站上的圖片。

文件輸入是頁面上倒數第三個輸入，我注意到發生了兩件事：

1）文件輸入后兩個輸入中的文本沒有作為req.body一部分傳遞給控制器​​，通常是表單輸入。

2）對於某些圖像，數據庫中沒有存儲數據uri。

我創建了一個新的基本風帆應用程序，其中包含一個允許您上傳圖像的表單，這里發生了完全相同的事情。

經過測試，我發現小圖像工作正常，而較大的圖像則沒有。 我使用的“小”圖像是66kb，而另一個800kb圖像產生了與上面提到的相同的效果。

新的res.view應用程序，在.upload()函數的回調中， res.view是另一個只顯示上傳圖像的頁面。 使用800kb圖像和更大的圖像，在頁面呈現時，不顯示上傳的圖像，而是顯示損壞的圖像。 在chrome dev控制台中，它給圖像鏈接帶來了404錯誤，但是如果我在圖像URL的末尾添加一個查詢（即讓chrome認為它是一個不同的URL，所以重新加載相同的圖像），圖像顯示正常。 從此我猜測在圖像實際上傳完成之前調用.upload()回調，並且當我重新加載圖像時它已經完成上傳。

我可以在請求標題中看到文件輸入后的輸入被發送，但是在控制器中執行console.log(req.body)只會記錄在表單中輸入文件之前放置的輸入。

我使用sails v0.11.0，我使用的代碼如下：

HTML表單（index.ejs）

<h1>Image Upload Test</h1>

<form method="post" enctype="multipart/form-data" action="/submit">

  <div>
    <input type="text" name="firstInput">
  </div>

  <div>
    <input type="file" name="image">
  </div>

  <div>
    <input type="text" name="imageUploaded" value="false">
  </div>

  <div>
    <input type="hidden" name="test" value="hello!">
  </div>

  <button type="submit">Upload</button>

  <script type="text/javascript">
    $('input:file').change(function() {
      $('input[name=imageUploaded]').val('true')
    });
  </script>

</form>

配置/ routes.js

module.exports.routes = {

  '/': 'ImageController.show',
  '/submit': 'ImageController.create'

控制器（ImageController.js）

module.exports = {
    show: function(req, res) {
        res.view('index.ejs');
    },

    create: function(req, res) {

        var fileName = 'image' + Date.now() + '.jpg';

    req.file('image')
    .upload({saveAs: __dirname + '/../../assets/images/' + fileName}, function(err, uploadedFiles) {
      if (err) return res.serverError(err);

            console.log('file uploaded');
            console.log();
            console.log(req.body);

            res.view('uploadedImage', {fileName: fileName});

    });

    }

};

顯示上傳圖片的頁面（uploadedImage.ejs）

<%if (typeof(fileName) !== 'undefined') {%>
  <a href="/">
    <img src="/images/<%=fileName%>" style="width:100%; height:100%;">
  </a>
<%}%>

任何人都可以解釋為什么會這樣，並幫助我解決它？

謝謝

Answer 1

根據sails文件上傳文檔，所有文本字段必須在文件字段之前上傳，否則它們不會傳遞給操作。 Sails文檔文件上傳風帆