ajaxにてCloud FunctionsへjsonデータをPOST送信するも、req.bodyが空となってしまう

Question

こんにちは。JavaScript初心者です。
クライアント側からajaxを使用し、JSONデータをPOST送信するも
サーバー側でJSONのbodyをログ出力しても空（{}）となり困っています。
サーバー側は、GoogleのCloud FunctionsでJavaScriptで実装しています。

空となる原因と対策を教えていただければと思います。

[クライアント側]
index.html　一部省略しています。

    <script>
      var obj = {
          title: 'test title',
          description: 'test description',
          platforms: ['A', 'B'],
          million: false,
          releasedAt: '2018-05-01'
      }
      var json = JSON.stringify(obj);

      // 通信実行
      $.ajax({
          type:"post",                // method = "POST"
          url:"https://us-central1-<Cloud Functionsで作成したプロジェクト名>.cloudfunctions.net/addMemo",        // POST送信先のURL
          // data:JSON.stringify(data),  // JSONデータ本体
          data:json,  // JSONデータ本体
          contentType: 'application/json', // リクエストの Content-Type
          dataType: "json",           // レスポンスをJSONとしてパースする
          success: function(json_data) {   // 200 OK時
              alert(json_data, undefined, 4); // Chrome用
          },
          error: function() {         // HTTPエラー時
              alert("Server Error. Pleasy try again later.");
          },
          complete: function() {      // 成功・失敗に関わらず通信が終了した際の処理
              button.attr("disabled", false);  // ボタンを再び enableにする
          }
        });
      });
    </script>

[サーバー側]
index.js

const functions = require('firebase-functions');

exports.addMemo = functions.https.onRequest((req, res) => {
  try {
    console.log("req.body :", JSON.stringify(req.body));
    res.status(200).send(req.body);
  } catch(error) {
    console.error( "エラー：", error.message);
  }
});

[サーバー側のログ]
以下の通り、空となっています。

2021-05-07T02:40:18.696ZaddMemosbt6cdnxq5im req.body : {}

Comments

[m.ts10806]

stringifyせずに送信したらどうなりますか？

[rick]

JSON.stringify(obj)せずにobjを送信してみましたが、空でした。
2021-05-07T04:45:38.606ZaddMemouerehgu48ekp req.body : {}

Answer 1

よく分かりませんが、レスポンスに対し以下のヘッダーを設定してあげれば
送信したJSONデータを取得できました。
参考にしたURL
https://teratail.com/questions/247088

    res.setHeader('Access-Control-Allow-Origin', '*')
    res.setHeader('Access-Control-Request-Method', '*')
    res.setHeader('Access-Control-Allow-Methods', 'OPTIONS, GET')
    res.setHeader('Access-Control-Allow-Headers', '*')