为何本地localhost发起的HTTP GET请求遭CORS拦截？

• 地址栏访问 ≠ 脚本跨域请求
  直接在地址栏输入URL属于浏览器主动导航行为，浏览器不会触发CORS校验——这是用户主动发起的跨源访问，不属于脚本获取跨域数据的场景，所以不管服务器有没有CORS配置，都能正常显示内容。
  但fetch是页面脚本发起的跨域AJAX请求，浏览器会严格执行同源策略：只有目标服务器明确通过响应头允许当前页面的源访问，才会让脚本拿到响应数据。

• 两个服务器的CORS配置差异

  • api.dictionaryapi.dev的服务器配置了CORS允许规则，会在响应中返回Access-Control-Allow-Origin: *（或匹配你当前页面的源http://127.0.0.1:8080），所以浏览器允许你的脚本读取响应。
  • evilinsult.com的服务器没有配置任何CORS允许头，当你的脚本发起请求后，浏览器检查响应头发现缺少Access-Control-Allow-Origin，就会拦截这个请求——哪怕服务器已经返回了内容，也会把它屏蔽，不让脚本获取。

• 为什么地址栏访问url2看不到CORS头？
  因为地址栏访问不属于跨域脚本请求，浏览器不会要求服务器返回CORS相关头，服务器也就不会发送这个字段。只有当请求是脚本发起的跨域请求时，服务器才需要返回CORS头供浏览器校验。

内容的提问来源于stack exchange，提问作者scribe