こんにちは！
今回は「JavascriptでGASに対してAPIリクエストを送ったら、corsエラーになってしまう原因と対策」についてお伝えしたいと思います。
あくまで一例ですので、原因は他の場合もあります。
予めご了承ください。
エラー内容：GASのAPIに対してリクエストを送ると、corsエラー
GASのAPIに対してリクエストを送ると以下のエラーがフロントで表示されました。
Access to fetch at 'https://script.google.com/macros/s/AKfycbyDJCmxBheCcjaCcavyHAUBPZtQMGdq_lwLrVQoXUcO5Wwda9D-NPISaCyKU_P98QQCxw/exec'
from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
cors（クロスオリジン）のエラーで怒られているようです。
エラー原因：コードのレスポンスでオブジェクトを返却しているのが原因だった
色々原因を調べたところ、クロスオリジンは関係なく、APIレスポンスの形に問題がありました。
エラーとなったコードは以下のようにオブジェクトをそのまま返却していました。
NG例
// // GASのAPI処理
const gasApi = () => {
const result = {name: 'taro'};
return result;
};
一見問題なさそうに見えますが、これがcorsエラーの原因でした。。
エラー対策：レスポンスのオブジェクトをContentService.createTextOutput()を使って返却する
オブジェクトをそのまま返却するのではなく、ContentService.createTextOutput(JSON.stringify(object))で変換して返却することで解決しました！
ContentService.createTextOutput() はGASに元々用意されているので、定義する必要はありません。
先程のコードを修正したのが以下になります。
OK例
// // GASのAPI処理
const gasApi = () => {
const result = ContentService.createTextOutput(JSON.stringify({name: 'taro'}))
return result;
};
これでcorsエラーは表示されなくなりました！
以上、お疲れさまでした〜🍵