節點/請求錯誤：“處理POST請求：無內容類型”

Question

我有一個前端Canvas，可以將其轉換為png文件，然后將其發布到第三方供應商的api。 它作為base64文件傳回節點，並對其進行解碼，但是當我嘗試上傳時，它給了我以下錯誤：

處理POST請求時出現問題：未指定Content-Type

但是，我在POST調用中明確指定了內容類型。 我的最終目標是將文件上傳到供應商的API。

以下是關鍵的前端方面：

var canvasImage = document.getElementById("c");
        var img = canvas.toDataURL({
            multiplier: canvasMultiplier
        });

var fileTime = Date.now();
            var myFileName = $scope.productCode + fileTime;
            $scope.filenameForVendor = myFileName;
            var filename = $scope.filenameForVendor;

$http.post('/postVendor', { filename: filename, file: img }).success(function (data) {
                console.log("Uploaded to Vendor");

這是后端POST：

app.post('/postVendor', function (req, res, next) {
    var filename = req.body.filename;
    var file = req.body.file;
    fileBuffer = decodeBase64Image(file);

    request({
        url: "http://myvendorapi/ws/endpoint",
        method: "POST",
        headers: {
            'contentType': fileBuffer.type
        },
        body: fileBuffer.data
    }, function (error, response, body) {
        console.log(response);
    });
})

// Decode file for upload
function decodeBase64Image(dataString) {
    var matches = dataString.match(/^data:([A-Za-z-+\/]+);base64,(.+)$/),
        response = {};

    if (matches.length !== 3) {
        return new Error('Invalid input string');
    }

    response.type = matches[1];
    response.data = new Buffer(matches[2], 'base64');

    return response;
}

我可以在前端使用AJAX進行POST，但是由於CORS和供應商阻止了所有（除了服務器端）對端點的調用（並且它們沒有JSONP），因此無法使用它。 他們允許我的IP用於測試目的，因此只有我才能在計算機上完成此工作：

var send = function (blob) {
 var fileTime = Date.now();
            var myFileName = $scope.productCode + fileTime;
            $scope.filenameForVendor = myFileName;
            var filename = $scope.filenameForVendor;
            var formdata = new FormData();
            formdata.append('File1', blob, filename);

            $.ajax({
                url: 'http://myvendorapi/ws/endpoint',
                type: "POST",
                data: formdata,
                mimeType: "multipart/form-data",
                processData: false,
                contentType: false,
                crossDomain: true,
                success: function (result) {
                    console.log("Upload to Vendor complete!");

// rest of code here/including error close out
}

 var bytes = atob(dataURL.split(',')[1])
        var arr = new Uint8Array(bytes.length);
        for (var i = 0; i < bytes.length; i++) {
            arr[i] = bytes.charCodeAt(i);
        }
        send(new Blob([arr], { type: 'image/png' }));

更新：

我意識到contentType應該是“ content-type”。 當我這樣做時，它會產生一個沒有邊界的錯誤，因為我正在嘗試使用多部分形式的數據（我做錯了所有事情）。 如何將formData傳遞給Node進行上傳？

更新2：

根據提供的建議，我嘗試使用multer，但遇到了ReferenceError：未定義XMLHttpRequest。

客戶端：

   var fileTime = Date.now();
            var myFileName = $scope.productCode + fileTime;
            $scope.filenameForVendor = myFileName;
            var filename = $scope.filenameForVendor;
            var formdata = new FormData();
            formdata.append('File1', blob, filename);

            $http.post('/postVendor', formdata, { transformRequest: angular.identity, headers: { 'Content-Type': undefined } }).success(function (data) {

服務器端：

app.post('/postVendor', function (req, res, next) {
    var request = new XMLHttpRequest();
    request.open("POST", "http://myvendorapi.net/ws/endpoint");
    request.send(formData);
})

Answer 1

為什么要對文件進行base64編碼？

您可以使用FormData將原始文件上傳到您的Node，而無需解碼任何內容。

前端

...
var request = new XMLHttpRequest(); 
request.open('POST', 'http://node.js/method'); 
request.send(formData); // vanilla 

- - 要么 - -

...
$http.post('http://node.js/method', formData, { 
  transformRequest: angular.identity, 
  headers: {'Content-Type': undefined} 
}); // angular

后端

只需安裝請求 。

...
var request = require('request');
app.post('/method', function (req, res, next) {
  // if you just want to push request you don't need to parse anything
  req.pipe(request('http://vendor.net')).pipe(res);
}) // express