NodeJS＆Angular Image上傳

嘗試了很多可用的互聯網教程，但我仍然無法使其功能。我在NodeJS中使用多模模塊，在AngularJS中使用ng-file-upload。我用multer設置了兩個助手（因爲我有兩個場景，兩個上傳都必須到不同的文件夾）。後端文件位於APP/APP_BACK /文件夾中，因此在目標路徑中，我返回一個文件夾並輸入APP_FRONT/images/header。這裏是一個輔助片斷（/helpers/uploadHeader.js）：NodeJS＆Angular Image上傳

var storage = multer.diskStorage({ 
destination: function (req, file, callback) { 
    callback(null, '../APP_FRONT/images/header/'); 
}, 
filename: function (req, file, callback) { 
    var ext = filename.slice((filename.lastIndexOf(".") - 1 >>> 0) + 2); 
    callback(null, file.fieldname + '-' + '.' + ext); 
} 

}); 
var upload = multer(
    {storage: storage} 
); 

var helper = { 
    upload: upload 
}; 

module.exports = helper;

這裏是路由器的文件：

var headerHelper= require('../helpers/uploadHeader'); 

router.post('/header', headerHelper.upload.single('header'), function(req, res, next) { 
    headerHelper.upload(req, res, function(err){ 
     if(err){ 
      res.status(400).send(err); 
      console.log(err); 
      return; 
     } 
     res.status(200).send({ code:200, message:'Header upload successful!' }); 
    }); 
});

「報頭」。將輸入的形式或郵差密鑰值的名稱。

在角，我在應用注入「ngFileUpload」模塊，並注射「上傳」服務到所需的控制器，並用它內部uploadHeader（），其被結合在按鈕內部表格上客戶機側功能：

$scope.uploadHeader = function (file) { 
     Upload.upload({ 
      url: 'http://localhost:3003/upload/header', 
      method: 'POST', 
      file: file 
     }).then(function (response) { 
      console.log('Success ' + response.config.data.file.name + 'uploaded. Response: ' + response.data); 
     }, function (error) { 
      console.log('Error status: ' + error.status); 
     }, function (evt) { 
      var progressPercentage = parseInt(100.0 * evt.loaded/evt.total); 
      console.log('progress: ' + progressPercentage + '% ' + evt.config.data.file.name); 
     });

我試圖與郵差：

Postman request SS

而得到這個錯誤：

「錯誤：ENOENT：沒有這樣的文件或目錄，打開' C：\ Users \用戶名\桌面\ APP \ APP_FRONT \影像\頭\ header.jpg '」

當我從客戶方嘗試，我得到這些錯誤：

「錯誤：意外現場
在makeError」和「類型錯誤：DBG是未定義」

我已經諮詢了谷歌，T參加了一些教程，但陷入了這個問題。

來源

2017-01-05 basic

「TypeError：dbg is undefined」是一個mozilla螢火蟲錯誤 – AlainIb

你會提供你的'html'代碼嗎？我相信那裏存在錯誤。你確定'name'屬性的值是'header'嗎？ –

在你的路由器中，你告訴multer在mulitpart表單數據中尋找一個名爲「header」的對象。您的angularJS代碼將其添加爲名爲'file'的對象。

如果你在你的路由器更改從行：

router.post('/header', headerHelper.upload.single(**'header'**), function(req, res, next) { 
//..... 
    }

到：

router.post('/header', headerHelper.upload.single(**'file'**), function(req, res, next) { 
//.... 
}

它應該做的伎倆。

來源

2017-01-05 22:02:58 CvZ

編輯：解決發現

其實，這是在multer的storate設置在文件名功能問題。在上述文章中，我附加datetimestamp和文件擴展字段名：

filename: function (req, file, callback) { 
    var datetimestamp = moment().format('DD-MM-YY_HH:mm:ss'); 
    var filename = file.originalname; 
    var ext = filename.slice((filename.lastIndexOf(".") - 1 >>> 0) + 2); 

    callback(null, file.fieldname + '-' + datetimestamp + '.' + ext); 
}

出於某種原因，它不能完成上傳，我得到了錯誤。

我改變文件名函數返回只有文件的ORIGINALNAME：

filename: function (req, file, callback) { 
     callback(null, file.originalname); 
    }

，現在一切正常。但現在，問題是，爲什麼自定義文件名不起作用？

來源

2017-01-06 09:38:19 basic

NodeJS＆Angular Image上傳

回答

相關問題