Adnan Vallippadan
Adnan Vallippadan

Reputation: 11

Flutter web http CORS issue

I am developing a web application with flutter. The http requests are made with flutter http plugin. The requests were working fine before. Recently I am getting a CORS Error like this

Access to XMLHttpRequest at 'https://www.google.com/' from origin 'http://localhost:33121' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

I've added corresponding headers with my request. Even that didn't help me to figure it out. I am sharing the code snippet that I've used for testing.

`var client = http.Client();
try {
  var url = 'https://www.google.com/';
  var response = await http.get(Uri.parse(url));
  print(response.body);
  print(response.statusCode);
} finally {
  client.close();
}`

These are logs that I am getting from the browser console

Access to XMLHttpRequest at 'https://www.google.com/' from origin 'http://localhost:33189' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. www.google.com/:1 Failed to load resource: net::ERR_FAILED errors.dart:299 Uncaught (in promise) Error: XMLHttpRequest error. dart-sdk/lib/_internal/js_dev_runtime/patch/core_patch.dart 963:28 get current packages/http/src/browser_client.dart 69:22 dart-sdk/lib/async/zone.dart 1653:54 runUnary dart-sdk/lib/async/future_impl.dart 147:18 handleValue dart-sdk/lib/async/future_impl.dart 766:44 handleValueCallback dart-sdk/lib/async/future_impl.dart 795:13 _propagateToListeners dart-sdk/lib/async/future_impl.dart 557:7 [_complete] dart-sdk/lib/async/stream_pipe.dart 61:11 _cancelAndValue dart-sdk/lib/async/stream.dart 1587:7 dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/operations.dart 334:14 _checkAndCall dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/operations.dart 339:39 dcall dart-sdk/lib/html/dart2js/html_dart2js.dart 37341:58

I've tried adding these header information with my request. But this also didn't work.

`var client = http.Client();
try {
  var url = 'https://www.google.com/';
  var response = await http.get(
      Uri.parse(url),
      headers: <String, String> {
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Methods": "GET,POST,PUT,OPTIONS",
        "Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept"
      },
    );
  print(response.body);
  print(response.statusCode);`

Upvotes: 0

Views: 1488

Answers (1)

Zozo
Zozo

Reputation: 33

flutter run -d chrome --web-renderer html docs https://docs.flutter.dev/development/platform-integration/web/renderers

Upvotes: 1

Related Questions