now.shにデプロイしたAPIサーバーに、CORS(Cross-Origin Resource Sharing)設定をする
公開日: 2019.6.18
now.shでAPIなどのアプリをデプロイすると時に、CORS(Cross-Origin Resource Sharing)設定が必要になります。now.shでは、設定ファイルで簡単にheaderを追加できるので、そのやり方をまとめました。
編集ノート: SERVERSUSでは、パートナーリンクからコミッションを得ています。コミッションが記事の意見や、サービスの評価に影響を与えることはありません。
now.jsonにheaderセクションを追加する
now.shの挙動はnow.jsonに書くことになっていますが、こちらにはHTTPヘッダの情報も含めることができます。
CORSにも対応しているので、下記のように記述(追記)します。
{
"routes": [
{ "src": ".*", "headers":
{
"Access-Control-Allow-Origin": "*"
}
}
]
}
上記の設定では、すべてのオリジンを受け付ける(「*」の部分)ようになっていますが、ここは適宜変更してください。
その他HTTPヘッダの設定
アクセス可能なメソッドの追加
"Access-Control-Allow-Methods":"GET, POST, PUT, DELETE, OPTIONS"
レスポンスヘッダの共有
"Access-Control-Allow-Headers":"X-Requested-With, Content-Type, Accept"
CORS設定ファイルのサンプル
{
"routes": [
{
{"Access-Control-Allow-Origin": "*"
"Access-Control-Allow-Methods":"GET, POST, PUT, DELETE, OPTIONS"
"Access-Control-Allow-Headers":"X-Requested-With, Content-Type, Accept"},
"src":"/.*",
"dest":"/index.js"
}
]
}
設定ができたら、now.shにデプロイすればOKです。
プログラム側でheaderを追加することもできる
なお、node.jsなどHTTPヘッダーをいじれるアプリの場合は、もちろんそちらで設定することも可能です。
しかし、静的ファイル(jsonなど)には、プログラム側からHTTPヘッダを追加できないので、今回の「now.json」にHTTPヘッダ情報を含める方が一括で対応ができて便利かと思います。
now.shにデプロイしたAPIサーバーに、CORS(Cross-Origin Resource Sharing)設定をする方法を見てきました。
CORS設定は、APIを使う際に必須の条件なので、now.shでAPIを作ろうという方はぜひ設定してみてください。
価格は記載がある場合を除き、すべて税込みです。
関連キーワード
サーバレスの新着記事
サーバレス複数サイト運営をする際の無料サーバー使いこなし術 2022.9.5
サーバレスHerokuの無料プランが終了へ。移行するならどこがいい? 2022.8.26
サーバレスCloudflare Pages Functionsをローカルでテストする方法 2022.8.12
サーバレスCloudfalre Pagesでリダイレクトを使う方法 2022.8.11
サーバレスCloudflare WorkersとCloudflare Pages Functionの違いと使い分け 2022.8.10
サーバレスCloudinaryの自分のデータを自動でバックアップさせる方法 2022.8.1
サーバレスいまさら聞けないレンタルサーバーとHerokuの違い 2022.5.10
サーバレスCloudflare Pagesでアクセス制限を実装する 2022.4.26