axios proxyを使わなで、corsを解決する。

Question

axiosでcors警告で弾かれてしまいます。今回はあえて、proxyを使用しないで解決したいのですが、
下記のコードでなぜ弾かれるのか理解できません。

 var config = {
     headers: {
        'Content-Type': 'application/json;charset=UTF-8',
        'Access-Control-Allow-Origin': '*',
      }
    };

    axios.post("http://service.hoge.co.jp/l/81111/2020-05-2/aaa", config).then(response => {
      console.log("response");
      console.log(response);
    });

これを行うと

Access to XMLHttpRequest at 'http://service.hoge.co.jp/l/81111/2020-05-2/aaa' from origin 'http://localhost:4000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

ご教授よろしくお願いします

Answer 1

http://service.hoge.co.jp/l/81111/2020-05-2/aaa 側が、Cross Origin を許可してないからではないですか？

Comments

[2_34_koki]

素人質問で申し訳ないのですが、corsというのは両者がcorsを許可しないと(両者とはフロント側とAPI側)いけないのでしょうか？

[Yasumichi]

正確には、リクエストを受ける側がcorsを許可しないといけないのではないでしょうか？

リクエストする側で設定すればOKだったりするとなんのセキュリティ対策にもならないですからね。

[2_34_koki]

なるほど。ありがとうございます。