web-dev-qa-db-ja.com

HTTP呼び出し中に「XMLHTTPRequest」エラーを得る

私はXAMPPコントロールパネルを使用し、Apache Port No 80のようなローカルサーバーを使用していますが、Flutter WebではXMLHTTPRequestエラーとモバイルデバイスを取得します。同じ符号化は、エラーが発生していないAPIを使用してデータをフェッチする。 APIを使用してデータを取得する方法AppはFlutter-Web上で実行されますか？

エラー

Launching lib\main.Dart on Chrome in debug mode...
Syncing files to device Chrome...
Debug service listening on ws://127.0.0.1:56619/FsXy3a4ZrZg=
Debug service listening on ws://127.0.0.1:56619/FsXy3a4ZrZg=
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 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 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 (http://localhost:5555/Dart_sdk.js:4361:12)
    at Object._rethrow (http://localhost:5555/Dart_sdk.js:38189:16)
    at async._AsyncCallbackEntry.new.callback (http://localhost:5555/Dart_sdk.js:38183:13)
    at Object._microtaskLoop (http://localhost:5555/Dart_sdk.js:38015:13)
    at _startMicrotaskLoop (http://localhost:5555/Dart_sdk.js:38021:13)
    at http://localhost:5555/Dart_sdk.js:33518:9
 _

バックエンドサイドPHP WebService）

<?php

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

include 'config.php';

$sql="select * from calinsert";
$result=mysqli_query($conn,$sql)or die("query failed");

if(mysqli_num_rows($result) >0){
    $output=mysqli_fetch_all($result,MYSQLI_ASSOC);
    echo json_encode($output);
}
else{   
    echo json_encode(array('message'=>'no record found','status'=>false));
}
?>
 _

フラッターサイドコード

Future getdata()async {
    final response = await http.get(
        'http://localhost:80/web_service/calview.php',
        headers: {
          "Accept": "application/json",
          "Access-Control_Allow_Origin": "*"
        });

    print(response.statusCode);
    print(response.body);
  }
 _
phpflutterflutter-web
8
Darpit Patel

Flutter APIのほとんどの場合、_Access-Control-Allow-Origin_値を追加すると問題が解決される可能性があります。 （注：これはローカルまたは外部APIにアクセスするのに役立ちます）

_header("Access-Control-Allow-Origin: *");
_

ヒント：上記のヘッダーではタイプがありますので、確認してください。

1
Jubin Patel

私は最近このエラーを得ていました、そして私は私のパッケージを最新の0.12.2 versionにアップグレードすることによって修正されたようです、そしてそれはこれまでのところ助けてくれたようです。

https://pub.dev/packages/http

1
jaredbaszler