回答:
Expressを使用する場合(Node.jsのための高性能、ハイクラスのWeb開発を)、あなたはこれを行うことができます。
HTML:
<form method="post" action="/">
<input type="text" name="user[name]">
<input type="text" name="user[email]">
<input type="submit" value="Submit">
</form>
APIクライアント:
fetch('/', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
user: {
name: "John",
email: "john@example.com"
}
})
});
Node.js:(Express v4.16.0以降)
// Parse URL-encoded bodies (as sent by HTML forms)
app.use(express.urlencoded());
// Parse JSON bodies (as sent by API clients)
app.use(express.json());
// Access the parse results as request.body
app.post('/', function(request, response){
console.log(request.body.user.name);
console.log(request.body.user.email);
});
Node.js:(Express <4.16.0の場合)
const bodyParser = require("body-parser");
/** bodyParser.urlencoded(options)
* Parses the text as URL encoded data (which is how browsers tend to send form data from regular forms set to POST)
* and exposes the resulting object (containing the keys and values) on req.body
*/
app.use(bodyParser.urlencoded({
extended: true
}));
/**bodyParser.json(options)
* Parses the text as JSON and exposes the resulting object on req.body.
*/
app.use(bodyParser.json());
app.post("/", function (req, res) {
console.log(req.body.user.name)
});
app.use(express.bodyParser());
。
次のquerystring
モジュールを使用できます。
var qs = require('querystring');
function (request, response) {
if (request.method == 'POST') {
var body = '';
request.on('data', function (data) {
body += data;
// Too much POST data, kill the connection!
// 1e6 === 1 * Math.pow(10, 6) === 1 * 1000000 ~~~ 1MB
if (body.length > 1e6)
request.connection.destroy();
});
request.on('end', function () {
var post = qs.parse(body);
// use post['blah'], etc.
});
}
}
たとえば、input
nameという名前のフィールドがある場合age
、変数を使用してそれにアクセスできますpost
。
console.log(post.age);
var POST = qs.parse(body); // use POST
私のような初心者のみ:入力テキストフィールドの名前が「user」Post.user
の場合、そのフィールドのデータが表示されます。例console.log(Post.user);
readable
データを本文文字列に構築する代わりに、コールバックを使用することもできます。いったん発射されると、遺体は次の場所から利用可能になりますrequest.read();
req.connection.destroy();
コールバックの実行を妨げないことに注意してください!たとえば、「オンエンド」コールバックは、切り捨てられたボディで実行されます!これはおそらくあなたが望んでいることではありません...
誰かがあなたのRAMを溢れさせようとした場合は、必ず接続を強制終了してください!
var qs = require('querystring');
function (request, response) {
if (request.method == 'POST') {
var body = '';
request.on('data', function (data) {
body += data;
// 1e6 === 1 * Math.pow(10, 6) === 1 * 1000000 ~~~ 1MB
if (body.length > 1e6) {
// FLOOD ATTACK OR FAULTY CLIENT, NUKE REQUEST
request.connection.destroy();
}
});
request.on('end', function () {
var POST = qs.parse(body);
// use POST
});
}
}
var POST = qs.parse(body); // use POST
noobsの場合のみ:入力テキストフィールドの名前が「user」の場合、Post.userはそのフィールドのデータを表示します。例:console.log(Post.user);
ここでの回答の多くは、もはや良い習慣ではないか、何も説明していません。そのため、私はこれを書いています。
http.createServerのコールバックが呼び出されるのは、サーバーが実際にリクエストのすべてのヘッダーを受信したときですが、データがまだ受信されていない可能性があるため、それを待つ必要があります。httpリクエストオブジェクト(http.IncomingMessageインスタンスは)実際に読める ストリーム。データのチャンクが到着するたびに読み取り可能なストリームで、イベントが発生しますdata
(コールバックが登録されている場合)、すべてのチャンクが到着するとend
イベントが発行されます。イベントをリッスンする方法の例を次に示します。
http.createServer((request, response) => {
console.log('Now we have a http message with headers but no data yet.');
request.on('data', chunk => {
console.log('A chunk of data has arrived: ', chunk);
});
request.on('end', () => {
console.log('No more data');
})
}).listen(8080)
これを試すと、チャンクがバッファであることがわかります。バイナリデータを扱っておらず、代わりに文字列を処理する必要がある場合は、request.setEncodingを使用することをお勧めしますメソッドをこれにより、ストリームは特定のエンコーディングで解釈された文字列を出力し、マルチバイト文字を適切に処理します。
これで、各チャンクは独自のものに興味がない可能性があるため、この場合はおそらく次のようにバッファリングする必要があります。
http.createServer((request, response) => {
const chunks = [];
request.on('data', chunk => chunks.push(chunk));
request.on('end', () => {
const data = Buffer.concat(chunks);
console.log('Data: ', data);
})
}).listen(8080)
ここではBuffer.concatが使用されており、すべてのバッファーを連結して1つの大きなバッファーを返します。同じことを行うconcat-streamモジュールを使用することもできます。
const http = require('http');
const concat = require('concat-stream');
http.createServer((request, response) => {
concat(request, data => {
console.log('Data: ', data);
});
}).listen(8080)
あなたはHTMLが無いファイルや手渡しでPOST送信を形成受け入れるようにしようとしている場合はjQueryのAjaxのデフォルトのコンテンツタイプと呼び出し、その後、コンテンツタイプがあるapplication/x-www-form-urlencoded
とuft-8
エンコーディング。querystringモジュールを使用して、シリアル化を解除し、プロパティにアクセスできます。
const http = require('http');
const concat = require('concat-stream');
const qs = require('querystring');
http.createServer((request, response) => {
concat(request, buffer => {
const data = qs.parse(buffer.toString());
console.log('Data: ', data);
});
}).listen(8080)
コンテンツタイプが代わりにJSONの場合、qs.parseの代わりにJSON.parseを使用できます。
ファイルを処理したり、マルチパートコンテンツタイプを処理したりする場合は、その場合は、手間のかかる作業をすべて取り除くformidableなどを使用する必要があります。この他の答えを見てください私はマルチパートコンテンツに役立つリンクやモジュールを掲載している鉱山のを。
コンテンツを解析したくないがどこかに渡したい場合、たとえば、データとして別のhttpリクエストに送信するか、ファイルに保存する場合、バッファリングするのではなくパイプすることをお勧めします。コードを使用すると、バックプレッシャをより適切に処理できます。必要なメモリが少なくなり、場合によっては高速になります。
したがって、コンテンツをファイルに保存する場合は、次のようにします。
http.createServer((request, response) => {
request.pipe(fs.createWriteStream('./request'));
}).listen(8080)
他の回答が指摘しているように、悪意のあるクライアントが大量のデータを送信してアプリケーションをクラッシュさせたり、メモリをいっぱいにしたりする可能性があることを覚えておいてください。ライブラリを使用して受信データを処理しない場合。指定された制限に達した場合にリクエストを中止できるストリームメーターのようなものを使用することをお勧めします:
limitedStream = request.pipe(meter(1e7));
limitedStream.on('data', ...);
limitedStream.on('end', ...);
または
request.pipe(meter(1e7)).pipe(createWriteStream(...));
または
concat(request.pipe(meter(1e7)), ...);
上記ではHTTPリクエストボディの使用方法について説明しましたが、コンテンツを単にバッファリングして解析するために、これらのモジュールのいずれかを使用することをお勧めします。エクスプレスについては、body-parserを使用することをお勧めします。koaには、同様のモジュールがあります。
フレームワークを使用しない場合、ボディは非常に優れています。
request
が再利用され、request.on('end')
複数回呼び出された可能性がありますか?どうすればそれを回避できますか?
request.on('end', ...)
が呼び出されることに注意してください。
ここに投稿された他の回答と記事に基づく非常に単純なフレームワークなしのラッパーは次のとおりです。
var http = require('http');
var querystring = require('querystring');
function processPost(request, response, callback) {
var queryData = "";
if(typeof callback !== 'function') return null;
if(request.method == 'POST') {
request.on('data', function(data) {
queryData += data;
if(queryData.length > 1e6) {
queryData = "";
response.writeHead(413, {'Content-Type': 'text/plain'}).end();
request.connection.destroy();
}
});
request.on('end', function() {
request.post = querystring.parse(queryData);
callback();
});
} else {
response.writeHead(405, {'Content-Type': 'text/plain'});
response.end();
}
}
使用例:
http.createServer(function(request, response) {
if(request.method == 'POST') {
processPost(request, response, function() {
console.log(request.post);
// Use request.post here
response.writeHead(200, "OK", {'Content-Type': 'text/plain'});
response.end();
});
} else {
response.writeHead(200, "OK", {'Content-Type': 'text/plain'});
response.end();
}
}).listen(8000);
response.post
が、それがより論理的であるよりもむしろあるべき理由はないrequest.post
。投稿を更新しました。
データをJSONにエンコードしてからNode.jsに送信すると、よりクリーンになります。
function (req, res) {
if (req.method == 'POST') {
var jsonString = '';
req.on('data', function (data) {
jsonString += data;
});
req.on('end', function () {
console.log(JSON.parse(jsonString));
});
}
}
qs.parse()
、JSON.parse()
身体を使用可能なものに変えました。例:var post = JSON.parse(body);
、次にでデータにアクセスしますpost.fieldname
。(物語のtypeof
request.setEncoding
これを正しく機能させるには、を使用する必要があります。そうしないと、ASCII以外の文字を適切に処理できない可能性があります。
Webフレームワークをインストールせずにこの簡単なタスクを実行する方法を考えている人のために、私はこれを一緒に構築することに成功しました。生産準備はほとんどできていませんが、動作するようです。
function handler(req, res) {
var POST = {};
if (req.method == 'POST') {
req.on('data', function(data) {
data = data.toString();
data = data.split('&');
for (var i = 0; i < data.length; i++) {
var _data = data[i].split("=");
POST[_data[0]] = _data[1];
}
console.log(POST);
})
}
}
body-parser
Node.jsボディ解析ミドルウェアであるを使用できます。
最初のロード body-parser
$ npm install body-parser --save
いくつかのサンプルコード
var express = require('express')
var bodyParser = require('body-parser')
var app = express()
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())
app.use(function (req, res) {
var post_data = req.body;
console.log(post_data);
})
その他のドキュメントはここにあります
リファレンス:https : //nodejs.org/en/docs/guides/anatomy-of-an-http-transaction/
let body = [];
request.on('data', (chunk) => {
body.push(chunk);
}).on('end', () => {
body = Buffer.concat(body).toString();
// at this point, `body` has the entire request body stored in it as a string
});
node-formidableを使用する場合の方法は次のとおりです。
var formidable = require("formidable");
var form = new formidable.IncomingForm();
form.parse(request, function (err, fields) {
console.log(fields.parameter1);
console.log(fields.parameter2);
// ...
});
純粋なNode.jsを使用する場合は、次に示すようにPOSTデータを抽出できます。
// Dependencies
const StringDecoder = require('string_decoder').StringDecoder;
const http = require('http');
// Instantiate the HTTP server.
const httpServer = http.createServer((request, response) => {
// Get the payload, if any.
const decoder = new StringDecoder('utf-8');
let payload = '';
request.on('data', (data) => {
payload += decoder.write(data);
});
request.on('end', () => {
payload += decoder.end();
// Parse payload to object.
payload = JSON.parse(payload);
// Do smoething with the payload....
});
};
// Start the HTTP server.
const port = 3000;
httpServer.listen(port, () => {
console.log(`The server is listening on port ${port}`);
});
1)'body-parser'
npmからインストールします。
2)次にapp.tsで
var bodyParser = require('body-parser');
3)次に、あなたは書く必要があります
app.use(bodyParser.json())
でapp.tsモジュール
4)含めることに注意してください
app.use(bodyParser.json())
先頭またはモジュール宣言の前。
例:
app.use(bodyParser.json())
app.use('/user',user);
5)次に使用
var postdata = req.body;
data
コールバックと一緒にデータをチャンクにしたくない場合は、常に次のようにreadable
コールバックを使用できます。
// Read Body when Available
request.on("readable", function(){
request.body = '';
while (null !== (request.body += request.read())){}
});
// Do something with it
request.on("end", function(){
request.body //-> POST Parameters as String
});
このアプローチは着信要求を変更しますが、応答が完了するとすぐに要求はガベージコレクションされるため、問題にはなりません。
巨大な体が怖い場合は、高度なアプローチとして、まず体のサイズを確認します。
request
は通常のnode.jsストリームなのでrequest.headers
、本文の長さを確認し、必要に応じてリクエストを中止できます。
それを行うには複数の方法があります。ただし、私が知っている最も早い方法は、body.parserでExpress.jsライブラリを使用することです。
var express = require("express");
var bodyParser = require("body-parser");
var app = express();
app.use(bodyParser.urlencoded({extended : true}));
app.post("/pathpostdataissentto", function(request, response) {
console.log(request.body);
//Or
console.log(request.body.fieldName);
});
app.listen(8080);
これは文字列でも機能しますが、POSTデータにJSON配列が含まれている場合は、代わりにbodyParser.urlencodedをbodyParser.jsonに変更します。
詳細:http : //www.kompulsa.com/how-to-accept-and-parse-post-requests-in-node-js/
あなたPOST
はチャンクでデータを受信する必要がありますrequest.on('data', function(chunk) {...})
const http = require('http');
http.createServer((req, res) => {
if (req.method == 'POST') {
whole = ''
req.on('data', (chunk) => {
# consider adding size limit here
whole += chunk.toString()
})
req.on('end', () => {
console.log(whole)
res.writeHead(200, 'OK', {'Content-Type': 'text/html'})
res.end('Data received.')
})
}
}).listen(8080)
jhが提案するように、示された位置にサイズ制限を追加することを検討する必要があります。
setTimeout
、完全なリクエストがそのウィンドウ内で受信されない場合、一定期間後に接続を終了するで防ぐことができます。
Express.jsを使用している場合は、req.bodyにアクセスする前に、ミドルウェアbodyParserを追加する必要があります。
app.use(express.bodyParser());
その後、あなたは求めることができます
req.body.user
そして、Expressのようなフレームワーク全体を使用したくないが、アップロードを含むさまざまな種類のフォームも必要な場合は、ホルマリン場合が適切な選択肢になる場合があります。
Node.jsモジュールにリストされている
これを達成する方法を説明するビデオを見つけました:https : //www.youtube.com/watch?v=nuw48-u3Yrg
デフォルトの「http」モジュールと「querystring」および「stringbuilder」モジュールを使用します。アプリケーションは、Webページから2つの数値(2つのテキストボックスを使用)を取得し、送信時に、これら2つの数値の合計を(テキストボックス内の値を永続化して)返します。これは私が他のどこでも見つけることができる最もよい例です。
関連するソースコード:
var http = require("http");
var qs = require("querystring");
var StringBuilder = require("stringbuilder");
var port = 9000;
function getCalcHtml(req, resp, data) {
var sb = new StringBuilder({ newline: "\r\n" });
sb.appendLine("<html>");
sb.appendLine(" <body>");
sb.appendLine(" <form method='post'>");
sb.appendLine(" <table>");
sb.appendLine(" <tr>");
sb.appendLine(" <td>Enter First No: </td>");
if (data && data.txtFirstNo) {
sb.appendLine(" <td><input type='text' id='txtFirstNo' name='txtFirstNo' value='{0}'/></td>", data.txtFirstNo);
}
else {
sb.appendLine(" <td><input type='text' id='txtFirstNo' name='txtFirstNo' /></td>");
}
sb.appendLine(" </tr>");
sb.appendLine(" <tr>");
sb.appendLine(" <td>Enter Second No: </td>");
if (data && data.txtSecondNo) {
sb.appendLine(" <td><input type='text' id='txtSecondNo' name='txtSecondNo' value='{0}'/></td>", data.txtSecondNo);
}
else {
sb.appendLine(" <td><input type='text' id='txtSecondNo' name='txtSecondNo' /></td>");
}
sb.appendLine(" </tr>");
sb.appendLine(" <tr>");
sb.appendLine(" <td><input type='submit' value='Calculate' /></td>");
sb.appendLine(" </tr>");
if (data && data.txtFirstNo && data.txtSecondNo) {
var sum = parseInt(data.txtFirstNo) + parseInt(data.txtSecondNo);
sb.appendLine(" <tr>");
sb.appendLine(" <td>Sum: {0}</td>", sum);
sb.appendLine(" </tr>");
}
sb.appendLine(" </table>");
sb.appendLine(" </form>")
sb.appendLine(" </body>");
sb.appendLine("</html>");
sb.build(function (err, result) {
resp.write(result);
resp.end();
});
}
function getCalcForm(req, resp, data) {
resp.writeHead(200, { "Content-Type": "text/html" });
getCalcHtml(req, resp, data);
}
function getHome(req, resp) {
resp.writeHead(200, { "Content-Type": "text/html" });
resp.write("<html><html><head><title>Home</title></head><body>Want to some calculation? Click <a href='/calc'>here</a></body></html>");
resp.end();
}
function get404(req, resp) {
resp.writeHead(404, "Resource Not Found", { "Content-Type": "text/html" });
resp.write("<html><html><head><title>404</title></head><body>404: Resource not found. Go to <a href='/'>Home</a></body></html>");
resp.end();
}
function get405(req, resp) {
resp.writeHead(405, "Method not supported", { "Content-Type": "text/html" });
resp.write("<html><html><head><title>405</title></head><body>405: Method not supported</body></html>");
resp.end();
}
http.createServer(function (req, resp) {
switch (req.method) {
case "GET":
if (req.url === "/") {
getHome(req, resp);
}
else if (req.url === "/calc") {
getCalcForm(req, resp);
}
else {
get404(req, resp);
}
break;
case "POST":
if (req.url === "/calc") {
var reqBody = '';
req.on('data', function (data) {
reqBody += data;
if (reqBody.length > 1e7) { //10MB
resp.writeHead(413, 'Request Entity Too Large', { 'Content-Type': 'text/html' });
resp.end('<!doctype html><html><head><title>413</title></head><body>413: Request Entity Too Large</body></html>');
}
});
req.on('end', function () {
var formData = qs.parse(reqBody);
getCalcForm(req, resp, formData);
});
}
else {
get404(req, resp);
}
break;
default:
get405(req, resp);
break;
}
}).listen(port);
使用してそれらのために生のバイナリPOSTのアップロードを使用できるオーバーヘッドエンコードせずに:
クライアント:
var xhr = new XMLHttpRequest();
xhr.open("POST", "/api/upload", true);
var blob = new Uint8Array([65,72,79,74]); // or e.g. recorder.getBlob()
xhr.send(blob);
サーバ:
var express = require('express');
var router = express.Router();
var fs = require('fs');
router.use (function(req, res, next) {
var data='';
req.setEncoding('binary');
req.on('data', function(chunk) {
data += chunk;
});
req.on('end', function() {
req.body = data;
next();
});
});
router.post('/api/upload', function(req, res, next) {
fs.writeFile("binaryFile.png", req.body, 'binary', function(err) {
res.send("Binary POST successful!");
});
});
エクスプレスを使用せずにポストパラメータを抽出できます。
1: nmp install multiparty
2:マルチパーティをインポートします。なのでvar multiparty = require('multiparty');
3: `
if(req.method ==='POST'){
var form = new multiparty.Form();
form.parse(req, function(err, fields, files) {
console.log(fields['userfile1'][0]);
});
}
4:HTMLフォームはです。
<form method=POST enctype=multipart/form-data>
<input type=text name=userfile1><br>
<input type=submit>
</form>
これがうまくいくことを願っています。ありがとう。
これらのようなフォームフィールド
<input type="text" name="user[name]" value="MyName">
<input type="text" name="user[email]" value="myemail@somewherefarfar.com">
上記の回答の一部はフラットデータしかサポートしていないため失敗します。
今のところ、Casey Chuの回答を使用していますが、「querystring」モジュールの代わりに「qs」を使用しています。これは、「body-parser」が使用するモジュールでもあります。したがって、ネストされたデータが必要な場合はqsをインストールする必要があります。
npm install qs --save
次に、最初の行を次のように置き換えます。
//var qs = require('querystring');
var qs = require('qs');
function (request, response) {
if (request.method == 'POST') {
var body = '';
request.on('data', function (data) {
body += data;
// Too much POST data, kill the connection!
// 1e6 === 1 * Math.pow(10, 6) === 1 * 1000000 ~~~ 1MB
if (body.length > 1e6)
request.connection.destroy();
});
request.on('end', function () {
var post = qs.parse(body);
console.log(post.user.name); // should work
// use post['blah'], etc.
});
}
}
"Request-Simplified HTTP client"とJavascript Promiseを使用することで、POSTリクエストのレスポンスを簡単に送受信できます。
var request = require('request');
function getData() {
var options = {
url: 'https://example.com',
headers: {
'Content-Type': 'application/json'
}
};
return new Promise(function (resolve, reject) {
var responseData;
var req = request.post(options, (err, res, body) => {
if (err) {
console.log(err);
reject(err);
} else {
console.log("Responce Data", JSON.parse(body));
responseData = body;
resolve(responseData);
}
});
});
}
req.bodyでフォームデータを利用できるようにするには、bodyParser()を使用する必要があります。body-parserはリクエストを解析し、必要な関連情報を簡単に抽出できる形式に変換します。
たとえば、フロントエンドにサインアップフォームがあるとします。あなたはそれを埋めて、どこかに詳細を保存するようサーバーに要求しています。
body-parserを使用すると、リクエストからユーザー名とパスワードを抽出するのは次のように簡単です。
……………………………………………………。
var loginDetails = {
username : request.body.username,
password : request.body.password
};
MIDDLEWAREなしの
1つのライナー
次のデータを投稿'name':'ABC'
すると、次の1つのライナーを使用して解析できます。
require('url').parse(req.url, true).query.name