NodeJS Express AMP形式req.body。 POST未定义,获得成功

时间:2017-04-01 23:21:14

标签: node.js

NodeJS,AMP-form,TLS / SSL,Nginx,npm,HTTP / 2 所有最低版本。

POST

var bodyParser = require('body-parsre');
app.use(bodyParser.urlencoded({true}); // tried false 
app.use(bodyParser.json()); // tried text(), json({type:*})

app.post('/post', function(req, res) {
    res.setHeader('Content-Type', 'text/plain');
    console.log('sent the name ' + req.body.name);
    console.log(util.inspect(req.body));
    console.log('request ' + req.query);
    res.json('Yo' + req.body.name);
});

Shell Console.log结果未定义

sent the name undefined
{}
request /vote?__amp_source_origin=https%3A%2F%2Fexample.com

浏览器控制台成功

Yo tanaka

HTML毫无疑问

Powered by AMP ⚡ HTML – Version
<form method="post" action-xhr="https://example.com/post" target="_top" novalidate="">
    <input type="text" name="name" value="a" placeholder="Name..." required="">
    <input type="submit" value="Subscribe" disabled="">
</form>

vote?__amp_source_origin=https%3A%2F%2Fexample.com  200 fetch
preview Yo tanka
response Yo tanaka

GET

Need not Body-Parser.
//var bodyParser = require('body-parsre');
//app.use(bodyParser.urlencoded({true}); // tried false 
//app.use(bodyParser.json()); // tried text(), json({type:*})

// Use req.request
app.get('/post', function(req, res) {
    res.setHeader('Content-Type', 'text/plain');
    console.log('sent the name ' + req.query);
    console.log('request ' + req.query);
    res.json('Yo' + req.query);
});

表单方法获取

<form method="get" action-xhr="https://example.com/post" target="_top" novalidate="">

Shell Console.log结果

sent the name tanaka
{name: tanaka}
request [/vote?__amp_source_origin=https%3A%2F%2Fexample.com,
         {name:tanaka}]

浏览器控制台成功

Yo tanaka

我想发帖。 我认为身体解析器原因。

npm list --depth=0
ds@1.0.0 /usr/local/src/ds
├── body-parser@1.17.1
├── cookie-session@2.0.0-beta.1 extraneous
├── express@4.15.2
├── express-session@1.15.2 extraneous
├── helmet@3.5.0
├── mongodb@2.2.25
├── mongoose@4.9.2 extraneous
├── nunjucks@3.0.0
├── safe-regex@1.1.0 extraneous
└── session@0.1.0 extraneous

body-parser最少版本 https://github.com/expressjs/body-parser

BODYPARSER和AMPFORM是否彼此不兼容?

2 个答案:

答案 0 :(得分:4)

amp-form组件实际上使用enctype multipart/form-data发送数据,因此无法使用body-parser对其进行解析。他们建议使用busboy,multiparty,strongidable或multer来处理多部分主体。以下是使用multer的示例:

var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({true});
app.use(bodyParser.json());

var multer  = require('multer');
var multipart = multer();

app.post('/post', multipart.fields([]), function (req, res) {
    res.setHeader('Content-type', 'application/json');
    res.setHeader('Access-Control-Allow-Credentials', true);
    res.setHeader('Access-Control-Allow-Origin', '*.ampproject.org');
    res.setHeader('AMP-Access-Control-Allow-Source-Origin', 'http://' + req.headers.host);
    res.setHeader('Access-Control-Expose-Headers', 'AMP-Access-Control-Allow-Source-Origin');

    console.log('sent the name ' + req.body.name);
    console.log(util.inspect(req.body));
    console.log('request ' + req.query);

    res.json('Yo' + req.body.name);
});  

您还需要更改标头以避免AMP验证错误。

答案 1 :(得分:2)

我认为,问题是CORS,json是这样写的: res.json(“Yo”)

   app.post('/post', function(req, res) {
         res.header("Access-Control-Allow-Origin", "*");
         res.header("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With");
         res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
         console.log('sent the name ' + req.body['name']);
         console.log('sent the name ' + req.body[0]);
         console.log('sent the name ' + req.body.name);
         console.log('sent the name ' + req.body.test); // input name test
         console.log(util.inspect(req.body));
        res.json('Yo');
        });