2017-08-04 398 views
1

我有一個用戶表單,用戶可以在其系統中選擇一個文件並使用FormData將其上載到另一個服務器。當測試直接發送到api時它工作正常。但是我需要在發送之前修改頭文件。所以我發佈到客戶端應用程序的後端。使用請求或axios nodejs將文件上傳到另一個服務器

router.post('/upload', function(req, res, next) { 
    //...some axios or request logic 

    var fs = require('fs'); 
    var request = require('request'); 
    var formData = { 
    my_field: 'my_value', 
    my_file: fs.createReadStream(__dirname + '/example.doc'), 
    }; 

    request.post({url:'http://someothereapp/upload-file', formData: formData}, function(err, httpResponse, body) { 
    if (err) { 
     return console.error('upload failed:', err); 
    } 
    console.log('Upload successful! Server responded with:', body); 
    res.send('good!'); 
    }); 

}); 

axiosrequest的偉大工程張貼範式或GET請求。但是當我嘗試使用它來發送文件時,它不起作用。上面的代碼總是返回成功,但不會上傳文件。所以我去here,仍然不明白,看看我失蹤。

我有驗證和跟蹤關閉其他服務器(本地),而測試,所以我不必修改標題。它具有如下的代碼,如果我的文件直接從Web表單發送給它工作正常,但不能從我的客戶快遞的應用程序:

// http://someothereapp/upload-file 
    router.post('/upload-file', (req, res, next) => { 
    let multer = require('multer') 
    let p = path.join(__dirname, '../uploads'); 
    let storage = multer.diskStorage({ 
     destination: function(req, file, callback) { 
     callback(null, p) 
     }, 
     filename: function(req, file, callback) { 
     console.log('what is file', file) 
     callback(null, file.fieldname + '-' + Date.now() + path.extname(file.originalname)) 
     } 
    }) 

    let upload = multer({ 
     storage: storage 
    }).single('userFile') 
    upload(req, res, function(err) { 
     res.end('File is uploaded') 
    }) 
    }); 

我看到this問題,並認爲這可能意味着它不會與愛可信可能但你如何處理請求?例如,在post ... upload代碼中,我如何將my_file作爲用戶在其表單中選擇的文件?爲什麼即使它沒有上傳文件也不會失敗?

回答

1

我改變了客戶端的後端應用程序下面,它讓我可以修改頁眉和發送形式:

router.post('/upload-file', function(req, res, next) { 
    var httpProxy = require('http-proxy'); 
    var proxy = httpProxy.createProxyServer({headers: customHeader}); 
    proxy.web(req, res, { target: 'http://someothereapp' }, function(e) { 
    // will proxy request to http://someothereapp/upload-file 
    ... 
    }); 
}); 

客戶端形式(不變):

<form name='uploadfile' enctype="multipart/form-data" method="post"> 
    <input type="file" name="userFile" /> 
    <input type="submit" value="Upload File" name="submit"> 
</form> 


<script> 
var form = document.forms.namedItem("uploadfile"); 
form.addEventListener('submit', function(ev) { 

    var oOutput = document.querySelector("div"), 
     oData = new FormData(form); 

    var oReq = new XMLHttpRequest(); 
    oReq.open("POST", "/upload-file", true); 
    oReq.onload = function(oEvent) { 
    if (oReq.status == 200) { 
     // oOutput.innerHTML = "Uploaded!"; 
     console.log('Uploaded'); 
    } else { 
     console.log('error', oReq.status); 
     // oOutput.innerHTML = "Error " + oReq.status + " occurred when trying to upload your file.<br \/>"; 
    } 
    }; 

    oReq.send(oData); 
    ev.preventDefault(); 
}, false); 
</script> 

目標服務器(不變):

// http://someothereapp/upload-file 
    router.post('/upload-file', (req, res, next) => { 
    let multer = require('multer') 
    let p = path.join(__dirname, '../uploads'); 
    let storage = multer.diskStorage({ 
     destination: function(req, file, callback) { 
     callback(null, p) 
     }, 
     filename: function(req, file, callback) { 
     console.log('what is file', file) 
     callback(null, file.fieldname + '-' + Date.now() + path.extname(file.originalname)) 
     } 
    }) 

    let upload = multer({ 
     storage: storage 
    }).single('userFile') 
    upload(req, res, function(err) { 
     res.end('File is uploaded') 
    }) 
    }); 
相關問題