Flutter如何支持浏览器跨域

当使用 flutter 构建 web 项目，直接运行在 chrome 浏览器发出网络请求会发生跨域错误 strict-origin-when-cross-origin（CROS），比如在 dart 代码直接用 dio.get("https://www.yunfuit.com")，dio 会报错，在 chrome 的 DevTools 中会发现 CROS 错误。

解决办法：

• 在flutter\bin\cache删除flutter_tools.stamp
• 在flutter\packages\flutter_tools\lib\src\web下打开chrome.dart，并在--disable-extensions下新增--disable-web-security。详细如下：

final List args = [
      chromeExecutable,
      // Using a tmp directory ensures that a new instance of chrome launches
      // allowing for the remote debug port to be enabled.
      '--user-data-dir=${userDataDir.path}',
      '--remote-debugging-port=$port',
      // When the DevTools has focus we don't want to slow down the application.
      '--disable-background-timer-throttling',
      // Since we are using a temp profile, disable features that slow the
      // Chrome launch.
      '--disable-extensions',
      '--disable-web-security',
      '--disable-popup-blocking',
      '--bwsi',
      '--no-first-run',
      '--no-default-browser-check',
      '--disable-default-apps',
      '--disable-translate',
      if (headless)
        ...[
          '--headless',
          '--disable-gpu',
          '--no-sandbox',
          '--window-size=2400,1800',
        ],
      ...webBrowserFlags,
      url,
    ];

然后重启编译器（VS Code / Android Studio），重新运行即可成功！

推荐一个非常好用的chatgpt，微信扫码：