I'm developing a Flutter web application that needs to access APIs from different domains. Due to CORS issues, I need to run Chrome with the --disable-web-security flag.
Currently, I can run the application through the terminal with the command:
flutter run -d chrome --web-browser-flag "--disable-web-security"
What I want is for VSCode to automatically use this flag when I use the Run & Debug button in VSCode, so I don't always have to use the terminal.
Is there a way to configure VSCode to automatically run Chrome with this flag when debugging Flutter web?
I'm using:
Latest Flutter version VSCode with Flutter extension Chrome as the browser for debugging
Thank you for your help.
I tried manually running my Flutter web application with the terminal command:
flutter run -d chrome --web-browser-flag "--disable-web-security"
This works correctly and allows my application to bypass CORS restrictions when accessing APIs from different domains.
I expected to find a simple way to configure VSCode's Run & Debug functionality to automatically append these flags when launching my Flutter web app, but I couldn't find the correct configuration to do this in the VSCode settings or in the Flutter extension settings.
I looked in the launch.json file, but I'm not sure about the correct format to add these Chrome flags. When I try to debug my application using the default Run & Debug button in VSCode, it launches Chrome without the --disable-web-security flag, causing my API calls to fail with CORS errors.
I'm developing a Flutter web application that needs to access APIs from different domains. Due to CORS issues, I need to run Chrome with the --disable-web-security flag.
Currently, I can run the application through the terminal with the command:
flutter run -d chrome --web-browser-flag "--disable-web-security"
What I want is for VSCode to automatically use this flag when I use the Run & Debug button in VSCode, so I don't always have to use the terminal.
Is there a way to configure VSCode to automatically run Chrome with this flag when debugging Flutter web?
I'm using:
Latest Flutter version VSCode with Flutter extension Chrome as the browser for debugging
Thank you for your help.
I tried manually running my Flutter web application with the terminal command:
flutter run -d chrome --web-browser-flag "--disable-web-security"
This works correctly and allows my application to bypass CORS restrictions when accessing APIs from different domains.
I expected to find a simple way to configure VSCode's Run & Debug functionality to automatically append these flags when launching my Flutter web app, but I couldn't find the correct configuration to do this in the VSCode settings or in the Flutter extension settings.
I looked in the launch.json file, but I'm not sure about the correct format to add these Chrome flags. When I try to debug my application using the default Run & Debug button in VSCode, it launches Chrome without the --disable-web-security flag, causing my API calls to fail with CORS errors.
- This question is similar to: Flutter DIO library XMLHttpRequest error Web. If you believe it’s different, please edit the question, make it clear how it’s different and/or how the answers on that question are not helpful for your problem. – Ardeshir ojan Commented Mar 10 at 22:03
1 Answer
Reset to default 1If you look in the project folder, you can find .vscode
folder and launch.json
file in that folder.
You can create it or let VSCode create it automatically if it doesn't exist.
In launch.json
, add option below to the configurations
.
{
"name": "chrome-debug",
"request": "launch",
"type": "dart",
"args": [
"--web-browser-flag",
"--disable-web-security",
],
"deviceId": "chrome",
"flutterMode": "debug",
"program": "lib/main.dart"
}
Then you will have an option chrome-debug
for VSCode start debugging.