Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

flutter web DioException“TypeError: Instance of 'HttpRequestEventTarget': type 'HttpRequestEventTarget' is not a subtype of type 'HttpRequest'” #2158

Closed
ZhangZeQiao opened this issue Mar 25, 2024 · 3 comments
Closed

flutter web DioException“TypeError: Instance of 'HttpRequestEventTarget': type 'HttpRequestEventTarget' is not a subtype of type 'HttpRequest'” #2158

ZhangZeQiao opened this issue Mar 25, 2024 · 3 comments
Labels
i: cannot reproduce

Comments

@ZhangZeQiao
Copy link

Package

dio

Version

5.4.1

Operating-System

Web

Adapter

Default Dio

Output of flutter doctor -v

[√] Flutter (Channel stable, 3.19.4, on Microsoft Windows [版本 10.0.19045.4170], locale zh-CN)
    • Flutter version 3.19.4 on channel stable at C:\dev\flutter\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 68bfaea224 (4 days ago), 2024-03-20 15:36:31 -0700
    • Engine revision a5c24f538d
    • Dart version 3.3.2
    • DevTools version 2.31.1
    • Flutter download mirror https://storage.flutter-io.cn

[√] Windows Version (Installed version of Windows is version 10 or higher)

Dart Version

3.3.2

Steps to Reproduce

1、flutter web development（Not Android or iOS！）
2、flutter 3.19.4 + Dart 3.3.2（sdk: '>=3.0.0 <4.0.0'） + Web（Chrome）+ dio 5.4.1
3、demo：
Future<void> test() async { final response = await Dio().get('https://dart.dev'); print(response); }

Expected Result

When using Flutter for web development, you can use DIO for normal network interface requests.

Actual Result

The following error message appears when using Flutter for web development：
Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure you trust this source!
Launching lib\main.dart on Chrome in debug mode...
Waiting for connection from debug service on Chrome...
This app is linked to the debug service: ws://127.0.0.1:53930/4klEzkswD3I=/ws
Debug service listening on ws://127.0.0.1:53930/4klEzkswD3I=/ws
Debug service listening on ws://127.0.0.1:53930/4klEzkswD3I=/ws
wasm streaming compile failed: TypeError: Failed to execute 'compile' on 'WebAssembly': An argument must be provided, which must be a Response or Promise object
falling back to ArrayBuffer instantiation
Error: DioException [unknown]: null
Error: TypeError: Instance of 'HttpRequestEventTarget': type 'HttpRequestEventTarget' is not a subtype of type 'HttpRequest'
dart-sdk/lib/internal/js_dev_runtime/private/ddc_runtime/errors.dart 297:3 throw
packages/dio/src/dio_mixin.dart 510:7
dart-sdk/lib/async/zone.dart 1661:54 runUnary
dart-sdk/lib/async/future_impl.dart 180:22 handleError
dart-sdk/lib/async/future_impl.dart 850:46 handleError
dart-sdk/lib/async/future_impl.dart 871:13 _propagateToListeners
dart-sdk/lib/async/future_impl.dart 651:5 [_completeError]
dart-sdk/lib/async/future_impl.dart 63:5 [_completeError]
dart-sdk/lib/async/future_impl.dart 27:5 completeError
dart-sdk/lib/async/future.dart 613:44 onError
dart-sdk/lib/async/zone.dart 1666:54 runBinary
dart-sdk/lib/async/future_impl.dart 177:22 handleError
dart-sdk/lib/async/future_impl.dart 850:46 handleError
dart-sdk/lib/async/future_impl.dart 871:13 _propagateToListeners
dart-sdk/lib/async/future_impl.dart 651:5 [_completeError]
dart-sdk/lib/async/future_impl.dart 737:7 callback
dart-sdk/lib/async/schedule_microtask.dart 40:11 _microtaskLoop
dart-sdk/lib/async/schedule_microtask.dart 49:5 _startMicrotaskLoop
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 181:7

Through debugging, I found that type conversion exceptions occur in the following code nodes：
17113326169172
@ZhangZeQiao ZhangZeQiao added h: need triage This issue needs to be categorized s: bug Something isn't working labels Mar 25, 2024
@AlexV525
Copy link
Member

#2157 (comment) Please follow the comment to reproduce, rather than create custom implementations. As I've stated, I'm running on Flutter Web with our example and reproducing no issues.

@AlexV525 AlexV525 added i: cannot reproduce and removed h: need triage This issue needs to be categorized s: bug Something isn't working labels Mar 25, 2024
@AlexV525
Copy link
Member

It is very likely your implementation imports libraries from the native platform, where HttpRequest is a subtype of Stream<Uint8List>, rather than HttpRequestEventTarget.

@AlexV525 AlexV525 closed this as not planned Won't fix, can't repro, duplicate, stale Mar 26, 2024
@ZhangZeQiao
Copy link
Author

ZhangZeQiao commented Mar 30, 2024 •
edited
Loading

I finally found the problem because I added the following content to web/index.html:

<head>
  ... ...
  <!-- This script adds the flutter initialization JS code -->
  <script src="flutter.js" defer></script>
  ... ...
  <script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js">
    // 调试台：https://github.com/Tencent/vConsole
  </script>
  <script>
    var vConsole = new window.VConsole();
  </script>
  ... ...
</head>

Adding this content will cause:
wasm streaming compile failed: TypeError: Failed to execute 'compile' on 'WebAssembly': An argument must be provided, which must be a Response or Promise object
falling back to ArrayBuffer instantiation

As a result, it can cause:
Error: DioException [unknown]: null
Error: TypeError: Instance of 'HttpRequestEventTarget': type 'HttpRequestEventTarget' is not a subtype of type 'HttpRequest'

Remove the content to use Dio normally!

But it's strange, last year this method was still working properly?!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
i: cannot reproduce
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@AlexV525 @ZhangZeQiao