Dart/Flutter: Http request raises XMLHttpRequest error

Question

I am trying to make an RSS reader with flutter but the program raises the XMLHttpRequest error.

In my test I used web (Chrome) as my target platform.

Thank you for your help.

  Future<RssFeed> fetchFeed() async {
try {
  final response = await http.get(Uri.parse(url), headers: {"Access-Control-Allow-Origin": "*"});
  return RssFeed.parse(response.body);
} catch (e) {
  print(e);
  return RssFeed(title: "Test");
  }}

  var feed = await fetchFeed();

Full Error Log:

Error: XMLHttpRequest error.
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-

sdk/lib/_internal/js_dev_runtime/patch/core_patch.dart 910:28                get current
packages/http/src/browser_client.dart 69:22                                                                                    <fn>
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/zone.dart 1685:54                                              runUnary
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 159:18                                        handleValue
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 766:44                                        handleValueCallback
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 795:13                                        _propagateToListeners
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 592:7                                         [_complete]
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/stream_pipe.dart 61:11                                         _cancelAndValue
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/stream.dart 1288:7                                             <fn>
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/operations.dart 334:14  _checkAndCall
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/operations.dart 339:39  dcall
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/html/dart2js/html_dart2js.dart 37301:58                              <fn>


    at Object.createErrorWithStack (http://localhost:49656/dart_sdk.js:5080:12)
    at Function._throw (http://localhost:49656/dart_sdk.js:20337:18)
    at Function.throwWithStackTrace (http://localhost:49656/dart_sdk.js:20334:18)
    at async._AsyncCallbackEntry.new.callback (http://localhost:49656/dart_sdk.js:40851:18)
    at Object._microtaskLoop (http://localhost:49656/dart_sdk.js:40708:13)
    at _startMicrotaskLoop (http://localhost:49656/dart_sdk.js:40714:13)
    at http://localhost:49656/dart_sdk.js:36191:9

flutter doctor output:

[√] Flutter (Channel stable, 2.10.1, on Microsoft Windows [Version 10.0.19042.1526], locale de-DE)
[√] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
[√] Chrome - develop for the web
[√] Visual Studio - develop for Windows (Visual Studio Community 2022 17.0.5)
[√] Android Studio (version 2021.1)
[√] VS Code (version 1.63.2)
[√] Connected device (4 available)
[√] HTTP Host Availability

Dependencies:

dependencies:
  flutter:
    sdk: flutter



  # The following adds the Cupertino Icons font to your application.
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^1.0.2
  url_launcher: ^6.0.20
  http: ^0.13.0
  flutter_staggered_grid_view: ^0.6.1
  calendar_view: ^0.0.3
  webfeed: ^0.7.0
  string_similarity: ^2.0.0
  sortedmap: ^0.5.1

Answer 1

The cause of this error is when you use Uri.parse(url) instead you should use Uri.https('urlPath', 'callPath') (example: Uri.https('api.to.consults', 'login')), I spent days looking for a solution and nothing worked until I changed this. I hope it helps someone. Example

...
var uri = Uri.https('my.apiurl.com', 'my/api/endopoint/path');
var response = await client.get(uri);
...

you may notice that 'my.apiurl.com' does not include "http://" or "https://" in case it carries either protocol you should call Uri.http or Uri.https as appropriate.

also note that 'my/api/endopoint/path' is the path of the endpoint to query e.g. 'api/users/login', or 'api/categories'.

Answer 2

I tried a lot of solutions but the one worked for we was just use the following headers in your request :

headers: {
      "Access-Control-Allow-Origin": "*",
      'Content-Type': 'application/json',
      'Accept': '*/*'
    }

and make sure that you are using https in your request

Answer 3

in my case i was using my phone hotspot for internet, i just changed my internet to other carrier and its working. Reason i found this solution beause my browser was navigating to "http//one.airtel.in/rcconf" each time.