Flutter Web getting 'XMLHttpRequest' error while making http call

Question

I am trying to query Apache drill running in my local server but i'm getting the below error. Please help me, I tried adding '.htaccess' inside my /web folder of the project as well but it did't work.... Thanks!

http
    .post(
  'http://localhost:8047/query.json',
  headers: <String, String>{
    'Content-Type': 'application/json',
    'Access-Control-Allow-Headers':
        'Origin, Content-Type, Cookie, X-CSRF-TOKEN, Accept, Authorization, X-XSRF-TOKEN, Access-Control-Allow-Origin',
    'Access-Control-Expose-Headers': "" 'Authorization, authenticated',
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'GET,POST,OPTIONS,DELETE,PUT',
    'Access-Control-Allow-Credentials': 'true',
  },
  body: jsonEncode(<String, String>{
    'queryType': 'SQL',
    'query':
        'select * from dfs.`C:/Users/drill/data/*.parquet`'
  }),
)
    .then((_response) {
  setState(() {
     response = jsonDecode(_response.body);
  });
}

---

Error: XMLHttpRequest error.
    C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 264:20      get current
packages/http/src/browser_client.dart 84:22                                                                                    <fn>
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/zone.dart 1450:54                                              runUnary
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 143:18                                        handleValue
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 696:44                                        handleValueCallback
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 725:32                                        _propagateToListeners
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 519: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 1300: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 324: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 329:39  dcall
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/html/dart2js/html_dart2js.dart 37287:58                              <fn>
    at Object.createErrorWithStack (http://localhost:62659/dart_sdk.js:4348:12)
    at Object._rethrow (http://localhost:62659/dart_sdk.js:37892:16)
    at async._AsyncCallbackEntry.new.callback (http://localhost:62659/dart_sdk.js:37886:13)
    at Object._microtaskLoop (http://localhost:62659/dart_sdk.js:37718:13)
    at _startMicrotaskLoop (http://localhost:62659/dart_sdk.js:37724:13)

Answer 1

I currently have the same error message and it is very misleading. It seems to simply indicate that the request fails for whatever reason.

To debug it, use Chrome's DevTools (Ctrl+Shift+C), go to 'Network' and check there. You will almost certainly see that some parts of the request are not what you intended and that the request failed.

EDIT: Maybe it is a CORS-issue, then this great answer might be helpful: No 'Access-Control-Allow-Origin' header is present on the requested resource—when trying to get data from a REST API

Answer 2

If the above solutions didn't work , It may be just an issue with the device you are running on (Like my case)

in task manager make sure to quit all chrome processes

then

flutter clean

then

flutter run -d chrome

This fixed the problem for me.