使用supertest提交表單資料物件時請求正文未定義

我在 Vue 中有一個 Web 應用程式，它與用 NodeJS 撰寫的 REST API 對話。在 Web 應用程式中，用戶可以將檔案連同其資訊一起提交。Web 使用 REST API 將此資訊傳遞到后端。網頁端的代碼：

var formData = new FormData();
formData.append("number", this.number);
formData.append("file", this.file);
// More fields inside the Form Data object

this.$http.post('http://localhost:8081/api/new',formData,{emulateJSON: true},{
    header:{ "Content-Type":"multipart/form-data" },
}).then(function(response) {
    if (response.status == 200) {
        this.handleClose();
    } else {
        console.log("Failed to submit new report");
    }
}).catch((err) => {
    console.log("Failed to submit new report");
});

在后端，我有：

const router = require('express').Router();

router.post('/new', function(request, response) {
  console.log("New Report");
  console.log(request.body);

  var info = {
    "number": request.body.number,
    // More fields
  };
  var file = request.files.file;

  // More Code
  
});

它作業得很好，但現在我想為 REST API 創建測驗。我有以下代碼：

const chai     = require('chai');
const nock     = require('nock');
const FormData = require('form-data');
const request  = require('supertest');

run_new_report_test: function(server) {
    describe('Test: New report check', function() {
        it('should return status 200', function(done) {
            var formData = new FormData();
            formData.append("number", "55555");
            // More fields
            request(server)
                .post('/api/new')
                .set("Content-Type", "multipart/form-data")
                .attach(formData)
                .expect(200)
                .end(function(err, res) {
                    expect(err).to.equal(null);
                    expect(res.body).to.be.an('object').that.is.not.empty;
                    expect(res.body.message).to.be.equal('success');
                    done();
                });
        });
    });
},

但是當我使用 運行測驗時mocha，我得到：

New Report
undefined

出于某種原因request.body是undefined。我不明白這些FormData欄位位于何處request。為什么當我從網路發出請求而不是從測驗發出請求時它會起作用？

uj5u.com熱心網友回復：

而不是form-data，您需要使用.field(for req.body) 和.attach(for file) 方法。檢查檔案：https ://visionmedia.github.io/superagent/#multipart-requests

另外，您可以使用緩沖區模擬檔案，您還需要添加一些檔案資訊，試試這個：

describe('Test: New report check', function() {

    it('should return status 200', function(done) {

        const testFile = 'test file';

        request(server)
            .post('/api/new')
            // add each filed for req.body
            .field('number', '99999')
            // mock file
            .attach('file', Buffer.from(testFile, 'utf-8'), {

                // add file info accordingly
                filename: 'file.txt',
                contentType: 'text/plain',
                knownLength: testFile.length

            })
            .expect(200)
            .end(function(err, res) {
                expect(err).to.equal(null);
                expect(res.body).to.be.an('object').that.is.not.empty;
                expect(res.body.message).to.be.equal('success');
                done();
            });
    });
});

uj5u.com熱心網友回復：

您在 params 前端傳遞資料，并嘗試在后端訪問正文行資料，這就是未定義的原因。

試試這個

router.post('/new', function(request, response) {
console.log("New Report");
console.log(request.param);

var info = {
   "number": request.param.number,
   // More fields
};
var file = request.files.file;

 // More Code

});

標籤：节点.js Vue.js mocha.js 表单数据 超测

上一篇：在mongodb節點驅動程式中運行自定義命令

下一篇：等到整個功能完成