簡體   English   中英

Sails.js上傳圖片不起作用

[英]Sails.js upload image is not work

我正在嘗試上傳圖像並將圖像名稱獲取到MySQL中。 但是我仍然堅持上傳圖片。 我總是得到“成功上傳文件”的結果

這是控制器。

upload: function(req, res){
    var picture_path = req.param('picture_path');

    req.file('image').upload({maxBytes: 1000000, dirname : '/assets/pic_items'},function whenDone(err, uploadedFiled){
        if (err) {
            return res.negotiate(err);
        }   
            console.log(uploadedFiled);
            return res.json({
                message: uploadedFiled.length + ' files(s) uploaded successfully'
            });
        if (uploadedFiled.length === 0){
            return res.badRequest('no file was uploaded');
        }
    });
},

為了回答您的問題,我將假設一些事情。

  1. 您已成功將MySQL連接添加到配置目錄中的connections.js文件中。
  2. 您已經生成了一個名為“ gallery”的模型和控制器,該模型和控制器表示MySQL數據庫中也稱為“ gallery”的一個表,並且已成功創建模型作為該表中字段的表示。
  3. 在圖庫表/模型中,您有一個名為“ image_name”的字段來存儲圖像的名稱,還有一個名為“ image_uid”的字段,該字段將存儲一個唯一的標識符(文件描述符)。

因此,現在您應該擁有一個類似於以下內容的Gallery模型:

/**
 * Gallery.js
 *
 * @description :: TODO: You might write a short summary of how this model works and what it represents here.
 * @docs        :: http://sailsjs.org/documentation/concepts/models-and-orm/models
 */

module.exports = {

  attributes: {
    // Anything else you want to capture in your DB
    image_name : {
      type : 'string'
    },

    image_uid : {
      type: 'string'
    },
  }
};

在GalleryController中,創建一個上傳功能/路線來處理圖像上傳和數據庫插入。 看起來應該像這樣:

upload: function(req, res, next) {
    var params = req.params.all();
    console.log(params);

    req.file('fileToUpload').upload({
        // don't allow the total upload size to exceed ~10MB
        dirname: '../../assets/images/gallery',
        maxBytes: 10000000
    },function (err, uploadedFile) {
        if (err) {
            return res.serverError(err); 
        }

        // If no files were uploaded, respond with an error.
        if (uploadedFile.length === 0){
            return res.serverError("No files were uploaded!"); 
        }

        // Use this log all the uploaded file info
        // console.log(uploadedFile[0]);

        // Get the name of the file
        var fileName = uploadedFile[0].filename;
        // Get the file descriptor and remove the directory details
        var fileUID = uploadedFile[0].fd.replace(/^.*[\\\/]/, '');

        // Create a galleryItem to insert into database
        var galleryItem = {};
        galleryItem.image_name = fileName;
        galleryItem.image_uid = fileUID;

        // Create the image in your Database
        Gallery.create(galleryItem, function (err, gallery) {
            if(err) {
                return res.serverError('An error occured while adding Image in the DB');
            }

            // return whatever or wherever you want
            return res.redirect("/gallery/");
        });
    });
},

最后,在客戶端,應確保表單捕獲使用分段編碼,並且輸入名稱與控制器中的'req.file(“ fileToUpload”)'參數匹配。 這是一個非常基本的示例:

<form action="/gallery/upload" method="post" enctype="multipart/form-data">
  <input type="file" name="fileToUpload" id="fileToUpload">
  <input type="submit" value="Upload Image" name="submit">
</form>

顯示圖像就像從數據庫中讀取圖庫項目並將image_uid傳遞到圖像標簽一樣簡單。

<img src="/images/gallery/<%= gallery.image_uid %>" alt="<%= gallery.image_name %>" >

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM