禁用 CORS Chrome

当我们在开发 Web 应用程序的时候，需要时常进行跨域请求。但是在这个过程中，我们也会面临到浏览器跨域限制的问题。

跨域资源共享（CORS）是一个浏览器的安全策略，用于限制来自不同源的 JavaScript 中的资源访问。虽然这是一个好的安全措施，但有时候需要在开发过程中禁用它。在本文中，我们将讨论如何禁用 CORS Chrome。

设置 Chrome 开发人员工具

在 Chrome 中开发人员工具中启用 CORS 禁用，可以临时禁用同源策略，以便在同一计算机上运行的两个不同端口的应用或 Web 服务之间进行互动。

在开发人员工具中打开预览下面的链接，可以找到一个控制台选项卡，用于在控制台中预览数据。

1. 在 Webaite 开发期间启用跨域请求
2. 安装谷歌浏览器扩展程序 Chrome DevTools 
3. 打开 Chrome 开发人员工具按 F12（或 Ctrl+Shift+I）
4. 选择设置菜单或使用快捷键 Ctrl + Shift + P
5. 输入"allow-control-allow-origin"并在下面选择"Allow-Control-Allow-Origin: *"
6. 重启 Chrome 浏览器，并在开发器中重新加载页面。

代码：

var cors_api_url = 'https://cors-anywhere.herokuapp.com/';
var url = 'http://localhost:3000/'; // 目标URL
var params = {
  headers: {
    'X-Requested-With': 'XMLHttpRequest'
  }
};

fetch(cors_api_url + url, params)
  .then(response => response.text())
  .then(contents => console.log(contents))
  .catch(console.error);

在以上代码中，我们可以看到使用了一个名为cors-anywhere的 CORS 代理 API，它可以将我们的请求绕过跨域限制。使用这个 API，我们可以绕过任何来源的 CORS。

终极解决方案

虽然在开发过程中，我们可以禁用 CORS，但在生产中，我们必须能够处理来自不同来源的请求。这可以通过在服务器端配置 CORS 来实现。

1. 将以下内容添加到请求响应头中：Access-Control-Allow-Origin:*
2. 在请求响应头中添加Access-Control-Allow-Methods和Access-Control-Allow-Headers来定义允许使用的方法和请求头。 
3. 如果浏览器使用Cookie进行身份验证，则还需要添加Access-Control-Allow-Credentials。

以上就是禁用 CORS Chrome 的方法。请谨慎使用此方法，并仅在开发过程中使用，以便在生产中避免不必要的安全风险。