以前に、以下の記事で書いたが少し訂正があります。
https://i-say.net/note/1058/
json形式でヘッダーを指定すると、CROSエラーになるという件ですが、
以下のようにヘッダーを指定しなければ、問題が解決します。
json形式で送れます。
dataがオブジェクトとしています。
fetch(endPoint, {
method: 'POST',
body: JSON.stringify({ data: data }),
})
// HTTPリクエストが完了した場合
.then(response => response.text()) // レスポンスはテキスト形式であると仮定
.then(data => {
console.log('Success:', data);
})
.catch((error) => {
console.error('Error:', error);
});
GASは、application/json
形式のContent-Typeを持つプリフライトリクエストを処理できないため、この形式でリクエストを送るとCROSエラーが発生することがあります。
この件をContent-Typeを変更することで解決していたのですが、そうではなく
たんにContent-Typeを含むheadersを送らないという方法で解決できるということです。
ちなみにGAS内部でエラーを起こすと、CROSエラーなります。
これは、CROSに関係しているというよりは、GASでのエラーが原因です。
【エラーの確認方法】
doPost(e)関数内でエラーを起こすとそうなってしまうので、
try,catch構文でエラーを補足して、Javascriptに戻そうとしても無駄です。
doPost(e)関数内でdoPost2(e)関数を呼び出して、そちらでtry,catch構文を作り
処理を書きます。doPost2(e)関数内でcatchでエラーを返したものを
doPost(e)で、Javascriptに送信すると、エラーがわかります。
もしくは、doPost関数にもcatchを入れることで、そちらのエラー文がJavascriptに渡ります。
あとは、スプレッドシートに「LOG」などのシートを追加して、そこにエラーや確認したいデータを書き込むのもよいです。
ちなみにですが、GASをwebアプリ化した後で、GASを変更した場合は、たんに保存では
アプリが更新されません。
必ず、「デプロイの管理」からペン(編集ボタン)から、新バージョンを作成して、更新しましょう。
これを忘れると、直しても変化がないことになります。手間ですが、するしかありません。
今回は、いろいろテストを行い、かなりすっきりしました。
GASへは、JSON形式でデータを送りますが、返答はプレーンテキスト形式がおすすめです。
(JSON形式でも返答はできるはずですが、それにする程の目的がないので、テキストで受け取っています)
WEBプログム、WEBデザインなどの制作については、以下を御覧ください。
WEBプログム、WEBデザインなどの制作