なんとなく CORS がわかる...はもう終わりにする。

Access to XMLHttpRequest at 'http://localhost:8081' from origin 'http://localhost:8080' has been blocked by CORS policy:
Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://localhost:8080' is therefore not allowed access. If an opaque response serves your needs, 
set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Origin: https://trusted-one.co.jp

fetch('https://trusted-api.co.jp', {
  mode: 'cors'
});

Access-Control-Allow-Origin: https://trusted-one.co.jp  // 特定のサイトを許可する
Access-Control-Allow-Origin: *   // 全てのサイトを許可する(危険なのでプロダクトでは基本的には使わない)
Access-Control-Allow-Headers "X-Requested-With, Origin, X-Csrftoken, Content-Type, Accept"  // この辺は使うフレームワークにより異なるが許可するヘッダーを定義しておく。

　// OK: https://front-end.com or https://abc.front-end.com...
  // NG: https://evilsite.com...
  const origin = req.headers.origin;
  if (
    origin === process.env.FRONTEND_ORIGIN  // https://front-end.com
    || /^https:\/\/.+\.front-end\.com$/.test(origin)
  ) {
    res.header('Access-Control-Allow-Origin', origin);
    res.header('Access-Control-Allow-Headers', 'X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept');
    res.header('Access-Control-Allow-Methods', 'PUT, DELETE, OPTIONS');
    ...
  }
...

Access-Control-Allow-Methods: PUT, DELETE, PATCH

const xhr = new XMLHttpRequest();
xhr.withCredentials = true; // ここを追加。

fetch('https://trusted-api.co.jp', {
  mode: 'cors',
  credentials: 'include' // ここを追加。
});

axios.get('https://trusted-api.co.jp', { 
  withCredentials: true
});

axios.defaults.withCredentials = true; // global に設定してしまう場合

Access to XMLHttpRequest at 'http://b.com' from origin 'a.com' has been blocked by CORS policy:
The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.
The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

Access-Control-Allow-Origin: https://trusted-one.co.jp // CORS を許可する Origin を明示的にする
Access-Control-Allow-Credentials: true

import cors from 'cors';

const app = express();
app.use(cors({ origin: true, credentials: true }));

origin: Configures the Access-Control-Allow-Origin CORS header. Possible values:
Boolean - set origin to true to reflect the request origin, as defined by req.header('Origin'), or set it to false to disable CORS.
String - set origin to a specific origin. For example if you set it to "http://example.com" only requests from “http://example.com” will be allowed.
RegExp - set origin to a regular expression pattern which will be used to test the request origin. If it's a match, the request origin will be reflected. For example the pattern /example\.com$/ will reflect any request that is coming from an origin ending with "example.com".

Access to XMLHttpRequest at 'https://authentication.com/auth?client_id=12345&scope=openid&profile&email&response_type=code&redirect_uri=http://api.com/auth/cb&state=abcdefg'
(redirected from 'http://api.com') from origin 'http://front-end.com' has been blocked by CORS policy:
No 'Access-Control-Allow-Origin' header is present on the requested resource.

app.use((req, res, next) => {
  const origin = req.headers.origin;

  // 脆弱性を考慮し、https://front-end.com or https://*.front-end.com からのリクエストのみ許可
  // OK: https://front-end.com or https://abc.front-end.com...
  // NG: https://evilsite.com...
  if (
    origin === process.env.FRONTEND_ORIGIN  // https://front-end.com
    || /^https:\/\/.+\.front-end\.com$/.test(origin)
  ) {
    res.header('Access-Control-Allow-Origin', origin);
    res.header('Access-Control-Allow-Headers', 'X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept');
    res.header('Access-Control-Allow-Methods', 'PUT, DELETE, OPTIONS');
    res.header('Access-Control-Allow-Credentials', true);
  }

  if ('OPTIONS' == req.method) {
    res.send(204); // 204: No Content
  } else {
    next();
  }
});

import cors from 'cors';
app.use(cors());

app.use(cors({ origin: true, credentials: true }));