Flutter web api getting XMLHttpRequest

Question

My app works fine on android, but on web, I get the error :

Error: XMLHttpRequest error. dart-sdk/lib/_internal/js_dev_runtime/patch/core_patch.dart

I m using PHP API that generate Json data , I ve already added the header:

header("Access-Control_Allow_Origin: *");
header("Content-type:application/json;charset=utf-8"); 
header("Access-Control-Allow-Methods: GET");

the error output:

Error: XMLHttpRequest error.
dart-sdk/lib/_internal/js_dev_runtime/patch/core_patch.dart 908:28                get current
packages/http/src/browser_client.dart 69:22                                       <fn>
dart-sdk/lib/async/zone.dart 1687:54                                              runUnary
dart-sdk/lib/async/future_impl.dart 160:18                                        handleValue
dart-sdk/lib/async/future_impl.dart 767:44                                        handleValueCallback
dart-sdk/lib/async/future_impl.dart 796:13                                        _propagateToListeners
dart-sdk/lib/async/future_impl.dart 593:7                                         [_complete]
dart-sdk/lib/async/stream_pipe.dart 61:11                                         _cancelAndValue
dart-sdk/lib/async/stream.dart 1232:7                                             <fn>
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 37332:58                              <fn>
    at Object.createErrorWithStack (http://localhost:52772/dart_sdk.js:5388:12)
    at Object._rethrow (http://localhost:52772/dart_sdk.js:40987:16)
    at async._AsyncCallbackEntry.new.callback (http://localhost:52772/dart_sdk.js:40981:13)
    at Object._microtaskLoop (http://localhost:52772/dart_sdk.js:40808:13)
    at _startMicrotaskLoop (http://localhost:52772/dart_sdk.js:40814:13)
    at http://localhost:52772/dart_sdk.js:36279:9

try with adding `Access-Control-Allow-Headers` – Md. Yeasin Sheikh Dec 29 '21 at 13:18 — Md. Yeasin Sheikh, Dec 29 '21 at 13:18

score 0 · Accepted Answer · answered Jan 11 '22 at 02:17

it works after following those steps:

1- Go to flutter\bin\cache and remove a file named: flutter_tools.stamp

2- Go to flutter\packages\flutter_tools\lib\src\web and open the file chrome.dart.

3- Find '--disable-extensions'

4- Add '--disable-web-security'

score 0 · Answer 2 · answered Jan 21 '22 at 19:12

0

I've faced the same problem in deploying on the web, make sure that you :

add the headers to .htaccess file.
better use a POST instead of GET.
use HTTPS instead of HTTP on the API in your flutter code.

answered Jan 21 '22 at 19:12

Ayoub Arroub

302
2
10

Flutter web api getting XMLHttpRequest

2 Answers2