CORSとは?

CORSを初めて見たとき、自分が初めてAPIサーバとクライアントを作成したときに発生した問題.
APIサーバでコールした結果、エラーメッセージが出力されGoogle化されたのを覚えています.
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とは何でしょうか.
CROSS-Origin Resource Sharingは韓国語でクロスソースのリソース共有と解釈できる.
交差ソースとは、異なるソースを指します.
ここで、ソースとは、プロトコル、ホスト、ポートの合計です.

2つの異なるソースのアプリケーションが自由にコミュニケーションするのは、セキュリティ上危険です.そのため、CORS政策を通じて基本的に阻止している.

解決策

これは、サーバがアクセス制御のすべてのOriginヘッダに適切な値を設定することを意味します.
Webpack-dev-serverを使用して、このライブラリが提供するエージェント機能を使用して、CORSポリシーを迂回することができます.

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: '[타켓주소]',
        changeOrigin: true,
        pathRewrite: { '^/api': '' },
      },
    }
  }
}

node.js ExpressでCORSを許可する方法

const cors = require('cors');

app.use(cors()); //모두허용

// 옵션으로 해당 도메인만 CORS 허용
let corsOptions = {
    origin: 'https://www.domain.com',
    credentials: true
}

app.use(cors(corsOptions));

ソース:https://evan-moon.github.io/2020/05/21/about-cors/#%EA%B0%99%EC%9D%80-%EC%B6%9C%EC%B2%98%EC%99%80-%EB%8B%A4%EB%A5%B8-%EC%B6%9C%EC%B2%98%EC%9D%98-%EA%B5%AC%EB%B6%84