Flutter DIO library XMLHttpRequest error Web

Question

I have working with Flutter DIO Library. Its working fine on my Android App but giving error on Web. Error: DioError [DioErrorType.response]: XMLHttpRequest error.

If I tried same url with http its working fine for Web. My Dio Library code

Dio dio = Dio();
dio.options.method = "POST";
dio.options.headers["Access-Control-Allow-Origin"] = "*";
    dio.options.headers["Access-Control-Allow-Credentials"] = true;
    dio.options.headers["Access-Control-Allow-Headers"] =
        "Origin,Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token,locale";
    dio.options.headers["Access-Control-Allow-Methods"] =
        "GET, HEAD, POST, OPTIONS";
var response = await dio
        .post('http://45.79.124.182/app_php/PagarGuru_test/requestAdd.php');

Error Logs

C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/patch/core_patch.dart 908:28   get current
packages/dio/src/dio_mixin.dart 819:20                                                                            assureDioError
packages/dio/src/dio_mixin.dart 678:13                                                                            _dispatchRequest
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 60:31   <fn>
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/zone.dart 1692:54                                 runBinary
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 175:22                           handleError
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 779:46                           handleError
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 800:13                           _propagateToListeners
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 610:5                            [_completeError]
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 666:7                            callback
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/schedule_microtask.dart 40:11                     _microtaskLoop
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/schedule_microtask.dart 49:5                      _startMicrotaskLoop
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 166:15  <fn>
    at Object.throw_ [as throw] (http://localhost:58438/dart_sdk.js:5374:11)
    at http://localhost:58438/packages/dio/src/interceptors/log.dart.lib.js:1390:21
    at _RootZone.runBinary (http://localhost:58438/dart_sdk.js:40508:58)
    at _FutureListener.catchError.handleError (http://localhost:58438/dart_sdk.js:35445:33)
    at handleError (http://localhost:58438/dart_sdk.js:36033:51)
    at Function._propagateToListeners (http://localhost:58438/dart_sdk.js:36059:17)
    at _Future.new.[_completeError] (http://localhost:58438/dart_sdk.js:35905:23)
    at _SyncCompleter.new.[_completeError] (http://localhost:58438/dart_sdk.js:35363:36)
    at _SyncCompleter.new.completeError (http://localhost:58438/dart_sdk.js:35286:29)
    at onError (http://localhost:58438/dart_sdk.js:35131:60)
    at _RootZone.runBinary (http://localhost:58438/dart_sdk.js:40508:58)
    at _FutureListener.then.handleError (http://localhost:58438/dart_sdk.js:35445:33)
    at handleError (http://localhost:58438/dart_sdk.js:36033:51)
    at Function._propagateToListeners (http://localhost:58438/dart_sdk.js:36059:17)
    at _Future.new.[_completeError] (http://localhost:58438/dart_sdk.js:35905:23)
    at async._AsyncCallbackEntry.new.callback (http://localhost:58438/dart_sdk.js:35944:31)
    at Object._microtaskLoop (http://localhost:58438/dart_sdk.js:40808:13)
    at _startMicrotaskLoop (http://localhost:58438/dart_sdk.js:40814:13)
    at http://localhost:58438/dart_sdk.js:36279:9

I tried other forum answer, but its not helpful.

My whole project is based on Dio Library.

What should I do?

refer my answer [here](https://stackoverflow.com/a/68493792/13997210) hope its help to you — Ravindra S. Patil, Oct 02 '21 at 17:19
with http library its working fine but not working with duo library and headers are already added in request still giving error — Honey Last, Oct 04 '21 at 10:23
same error log : C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/patch/core_patch.dart 908:28 get current — Honey Last, Oct 04 '21 at 10:41

vinchuli · Answer 1 · 2022-06-20T11:29:21.730

19

I was experiencing the same problem. But after a quite research I found a working solution:

Go to flutter\bin\cache
find a file named flutter_tools.stamp , compress it to zip file or whatever to retain a copy then delete the original one.
Go to flutter\packages\flutter_tools\lib\src\web and open chrome.dart file in your editor.
Find line '--disable-extension'
Comment it out and replace it with --disable-web-security.

HAPPY CODING

if you see this 'You are using an unsupported comment-line flag: --disable-web-security. Stability and security will suffer' on your browser assume it. It only does that on ur local env no need to worry

edited Jun 20 '22 at 11:29

answered Jun 20 '22 at 11:24

vinchuli

409
5
6

2

This method only works for development. not work on release mood – Imran Sk Feb 10 '23 at 12:41
thanks for this information, this method works for me, but I want to know that what is the main cause of this problem or why this issue occurs. If you know then please help me – Krishnansh Singh Tomar Apr 24 '23 at 13:16
@KrishnanshSinghTomar what did you do. i am facing same issue – Hadi Khan Jun 15 '23 at 18:40
@HadiKhan so the problem is related to the CORS, and its occurs when I integrated the Google maps autosearch complete API you just need to follow the same steps or you can use heroku proxy server to resolve this problem or in backend you can create a proxy server to resolve this issue – Krishnansh Singh Tomar Jun 22 '23 at 08:34
@KrishnanshSinghTomar by "follow the same steps" do you mean the steps in this answer? As someone said that won't work in release mode. – BeniaminoBaggins Jul 13 '23 at 21:41
How do you fix this in backend? If it is CORS related should one change some headers in backend? I don't want to use a heroku proxy, our backend is on nginx. What should I do, maybe in nginx config files? – Oleg Yablokov Jul 17 '23 at 21:11
It didn't help? – Vepa Sabyrow Jul 27 '23 at 09:03
This didn't work for me. – markhorrocks Aug 20 '23 at 12:02

Flutter DIO library XMLHttpRequest error Web

1 Answers1