Flutter Web Http错误:未捕获(承诺)错误:XMLHttpRequest错误 [英] Flutter Web Http Error : Uncaught (in promise) Error: XMLHttpRequest error
问题描述
我正在尝试开发一个Flutter应用程序，该应用程序将http请求发送到托管在000webHost上的远程php文件.
I am trying to develop a flutter app that sends an http request to a remote php file hosting on 000webHost.
当我为桌面构建Flutter应用程序时，我设法检索了信息，一切都很好.但是，由于另一个问题(视频播放器无法与Desktop一起使用....)，我想回到Web构建.
When I build my Flutter application for Desktop, I manage to retrieve the information, everything is fine. However, due to another problem (video player doesn't work with Desktop....), I want to go back to a web build.
我看过几篇文章，但没有发现与我类似的错误.有人说是由于跨源请求(CORS)导致的错误，但在我看来，这并不是这个问题.
I have looked on several posts, but I did not find an error similar to mine. Some speak of an error due to Cross Origin Request (CORS), but it does not seem to me to be this problem.
当我尝试使用http.post检索数据时，出现以下错误:
When I try to retrieve my data with a http.post I have the following errors:
browser_client.dart:87 POST https://<myadresse>.000webhostapp.com/<nameFile>.php net::ERR_HTTP2_PROTOCOL_ERROR
Uncaught (in promise) 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 906:28 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 1446:54 runUnary
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 150:18 handleValue
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 703:44 handleValueCallback
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 732:32 _propagateToListeners
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/async/future_impl.dart 526: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 1302: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 37312:58 <fn>
at Object.createErrorWithStack (errors.dart:249)
at Object._rethrow (async_patch.dart:200)
at async._AsyncCallbackEntry.new.callback (zone.dart:1171)
at Object._microtaskLoop (schedule_microtask.dart:41)
at _startMicrotaskLoop (schedule_microtask.dart:50)
at async_patch.dart:166
我的代码:
void fetchData() async {
/**Map for instructions with php**/
var map = Map<String, dynamic>();
HandlerResponse
handlerResponse2; //Use to manage errors and parsing of received responses
map['action'] = Constants.GET_ALL_OPERATIONS;
try {
//Retrieving the response with the file containing the accesses to the database
http.Response responseCall = await http.post(Constants.ROOT,
body: map, headers: {"Access-Control-Allow-Origin": "*" , "Access-Control-Allow-Credentials": "true"});
//Definition of the behavior to adopt upon receipt of the response
handlerResponse2 = HandlerResponse(parseReponse: parseResponse);
//Recovery of response processing
_operations =
handlerResponse2.response(responseCall); //response(responseCall);
//Notify the change to widgets using the provider to update the interface
notifyListeners();
} on SocketException {
throw FetchDataException('No Internet connection');
}
}
当我使用Flutter Doctor时:
When I use flutter doctor :
flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel dev, 1.25.0-4.0.pre, on Microsoft Windows [version 10.0.18362.900], locale fr-FR)
[√] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
[√] Chrome - develop for the web
[√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.4.5)
[√] Android Studio (version 4.0)
[√] Connected device (3 available)
• No issues found!
预先感谢您的帮助
推荐答案
好的，只是临时修复了此错误.为了允许来自Chrome(web)的cors，必须遵循几个步骤
Okay, just fixed this bug temporarily. There are several steps must be followed in order to allow cors from Chrome(web)
简单的方法是:
在Web服务器(web)上运行应用程序
run the application on the Web server(web)
要想直接在Chrome(web)上运行应用程序，您应该进行很多更改.
更具体地说，您会看到该应用程序运行的chrome浏览器，它不是您真正同步的chrome，它只是一个简单的空chrome浏览器的镜像.
To be more specific, you would see that the chrome browser that the application runs, It isn't your real-syncronized chrome, It is just a mirror of a simple empty chrome browser.
- 在空的镶边中添加我之前提到的扩展名，如果可以，请不要触摸它.
如果空白的浏览器不允许您添加扩展名
第1步:导航至flutter的目录，然后进入flutter \ bin \ cache并删除名为flutter_tools.stamp的文件(以便在进行必要的更改后重建flutter)
Step 1: navigate to flutter's directory and then go flutter\bin\cache and remove a file named: flutter_tools.stamp(in order to rebuild flutter after the necessary changes)
第2步:导航至flutter \ packages \ flutter_tools \ lib \ src \ web并打开文件chrome.dart.
Step 2: navigate to flutter\packages\flutter_tools\lib\src\web and open the file chrome.dart.
第3步:必须在文件内部删除'-disable-extensions'
Step 3: Inside the file, you must remove a line '--disable-extensions'
第4步:在同一个文件中，并且恰好在最终列表< String>之前.args 规范，您应该添加此最终目录='C:\ Users \ {用户名} \ {create_a_new_folder_and_add_here_its_name}'; 并更改此行'-user-data-dir = $ {userDataDir.path}'到此'-user-data-dir = $ directory'如果您不应用这些更改，则每次运行代码时都需要添加扩展名，因为它不会被保存.
Step 4: Inside the same file and exactly before the final List<String> args specification, you should add this final directory = 'C:\Users\{user_name}\{create_a_new_folder_and_add_here_its_name}'; and change this line '--user-data-dir=${userDataDir.path}' to this '--user-data-dir=$directory'
if you don't apply these changes, you will need to add the extension every time you run your code 'cause it wouldn't be saved.
第5步:保存文件并重新运行代码.
Step 5: Save the file and rerun your code.
第6步:打开浏览器后，它将允许您应用所需的任何扩展名.
Step 6: When the browser opens, It will allow you to apply any extension you want.
第7步:立即添加扩展程序.
Step 7: Add the extension now.
第8步:畅玩网络.
这篇关于Flutter Web Http错误:未捕获(承诺)错误:XMLHttpRequest错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
