質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.36%
Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

POST

POSTはHTTPプロトコルのリクエストメソッドです。ファイルをアップロードしたときや入力フォームが送信されたときなど、クライアントがデータをサーバに送る際に利用されます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Express

ExpressはNode.jsのWebアプリケーションフレームワークです。 マルチページを構築するための機能セットおよびハイブリッドのWebアプリケーションを提供します。

Q&A

1回答

5635閲覧

XMLHttpRequestでPOSTしたデータを受け取ってもundefinedが返ってくる(node.js)

moimoi_sushi

総合スコア26

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

POST

POSTはHTTPプロトコルのリクエストメソッドです。ファイルをアップロードしたときや入力フォームが送信されたときなど、クライアントがデータをサーバに送る際に利用されます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Express

ExpressはNode.jsのWebアプリケーションフレームワークです。 マルチページを構築するための機能セットおよびハイブリッドのWebアプリケーションを提供します。

0グッド

0クリップ

投稿2020/05/30 18:13

編集2020/05/30 18:14

前提・実現したいこと

FileAPIを使って受け取ったcsvファイルをnodeモジュールを使って加工したいです。

そのため、クライアントのlocalhost側からXMLHttpRequestでsend()しているのですがサーバー側のrequestの中身が空になってしまいます。
(localhost側で動きができたらnodeホスティングのglitchにコードをアップする予定です)

該当のソースコード

以下はファイルがアップロードされFileAPIでonload開始した後に発火するクライアントのjavascriptです。

javascript

1**クライアントのJS** 2const parseCSV = (csvData) => { 3 const xhr = new XMLHttpRequest(); 4 xhr.addEventListener("readystatechange", function() { 5 console.log(this.readyState); 6 if(this.readyState === 4) { 7 console.log(this.response); 8 return true; 9 } 10 }); 11 xhr.open("POST", "http://localhost:8000/parse"); 12 xhr.setRequestHeader("Content-Type", "application/json"); 13 xhr.send(csvData); 14} 15

node

1**サーバー側** 2const express = require("express"), 3 app = express(); 4 5//クライアント側を静的ホスティング。(上記のクライアントのJSファイルをホスティング) 6app.use(express.static('public')); 7 8app.use(function(req, res, next) { 9 res.header('Access-Control-Allow-Methods', "GET, POST"); 10 next(); 11}); 12 13app.set("port", process.env.PORT || 8000) 14 15app.post("/parse", (req, res) => { 16 (async() => { 17 //値が何も返ってこない。ここで値を受け取りたい 18 console.log(req.data); 19 console.log(req.params); 20 console.log(req.body); 21 22 res.send('hello world'); 23 })().catch(console.log("done")) 24}) 25 26app.listen(app.get("port"), () => { 27 console.log(`The Express.js server has started and is listening on port number: ${app.get("port")}`); 28});
**ターミナルに返ってくるメッセージ** undefined {} undefined

試したこと

クライアント側のContent-Typeを変えてみたり、xhr.send('hi')のような簡単な文字列で送ってみても空になってしまいます。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

"Content-Type"が"application/json"なので
body-parserを利用しないといけない…とかかなぁ

Express 4でPOSTされたJSONを扱う

投稿2020/05/30 20:52

rururu3

総合スコア5545

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

moimoi_sushi

2020/05/31 02:39

昨日はbody-parserを入れてもダメだったんですがターミナルを再起動したところjsonが返ってきました。ありがとうございます。 Content-Type を text/csv に変更した場合でbody-parseを使っても(オプションの指定は無し)送れなかったのですが何か方法はないでしょうか。(text/plainでもbody-parseを指定してもしなくても送れなかった) JSON形式でも大丈夫なのですが贅沢をいえば text/csv をダイレクトに送りたいです。
moimoi_sushi

2020/05/31 02:41

text/csv Expressでググったら良さそうな情報が出てきたためもう少し自分で調べてみます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問