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

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

新規登録して質問してみよう
ただいま回答率
85.50%
CORS

CORSとはCross-Origin Resource Sharingの頭文字をとったもので、ブラウザがオリジン以外のサーバからデータを取得するシステムのことです。

Q&A

解決済

2回答

1317閲覧

Formとaxiosの違い. CORS

2_34_koki

総合スコア67

CORS

CORSとはCross-Origin Resource Sharingの頭文字をとったもので、ブラウザがオリジン以外のサーバからデータを取得するシステムのことです。

0グッド

1クリップ

投稿2020/05/07 11:26

htmlのFormとJavascriptのaxiosについて質問です。
ある外部のデータ管理システムを使用していて、その発行URLにデータをパラメータで送ることでデータが流し込める仕組みなのですが、
htmlのFormのactionにそのURLを設定してSubmitするとデータが流し込まれているのですが、
axiosを使用してデータを送信するとCORSで怒られてしまいます。
ここで質問なのですが、ここでの両者の違いがわかりません。
Formはなぜ、CORSに引っかからないのでしょうか?

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

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

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

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

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

guest

回答2

0

ベストアンサー

それは歴史的な理由からです。

FORMはCGIと共に誕生したと言って良いと思いますが、CGIは 1993年に NCSA により策定されました。その誕生以来、一貫して、FORMはドメインやオリジンの制約はありません。

CORSの前に同一オリジンポリシー(Same Origin Policy)について触れる必要があります。同一オリジンポリシーは、異なるサイトに対してJavaScriptアクセスができると脆弱性になることから、それを制限するために設けられた制約です。英語版WikiPediaによると、同一オリジンポリシーの誕生は1995年です。

一方、JavaScript向けのAPIが発達するにつれて、オリジンを超えてJavaScriptによるアクセスを許可したいというニーズが高まりました。このため、同一オリジンポリシーを緩める形で、CORSが制定されました。CORSの仕様書草稿は2006年に作られましたが、正式に承認されたのは2014年ですので、ウェブの歴史から見ると比較的最近です。
そして、axiosはJavaScriptで動きますから、JavaScriptの制限はaxiosでも有効です。

元の質問に返りますと、FORMは同一オリジンポリシーやCORSよりも先に誕生したので、互換性の理由から、ドメインやオリジンの制約は設けられていない、というのが「Formはなぜ、CORSに引っかからないの」かの理由です。

投稿2020/05/07 12:20

ockeghem

総合スコア11701

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

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

2_34_koki

2020/05/07 13:34

なるほど。詳しい説明ありがとうございました。そんな、歴史の背景があったんですね。
guest

0

その前にformでも普通にPOSTできてる時点でCSRFの危険があるのでは…。

これの回答にはWebセキュリティの長い歴史の話が必要なので自分で調べてもらうか詳しい人の回答を待つしかない。
1990年代からの大量のCSRFやXSSの被害の上で
それでもJSからクロスサイトでアクセスしたいのでCORSの仕様ができた。

投稿2020/05/07 11:57

kawax

総合スコア10377

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問