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.

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

Already on GitHub? Sign in to your account

bug: Capacitor Http and Native Bridge don't handle ReadableStream #7032

Closed
philjones88 opened this issue Oct 27, 2023 · 6 comments 路 Fixed by #7374
Closed

bug: Capacitor Http and Native Bridge don't handle ReadableStream #7032

philjones88 opened this issue Oct 27, 2023 · 6 comments 路 Fixed by #7374
Labels
platform: ios type: bug A confirmed bug report

Comments

@philjones88
Copy link
Contributor

Bug Report

Capacitor Version

npx cap doctor
[warn] The bundledWebRuntime configuration option has been deprecated. Can be safely deleted.
馃拪   Capacitor Doctor  馃拪

Latest Dependencies:

  @capacitor/cli: 5.5.1
  @capacitor/core: 5.5.1
  @capacitor/android: 5.5.1
  @capacitor/ios: 5.5.1

Installed Dependencies:

  @capacitor/android: not installed
  @capacitor/cli: 5.5.1
  @capacitor/core: 5.5.1
  @capacitor/ios: 5.5.1

[success] iOS looking great! 馃憣

Platform(s)

iOS (only tested)

Current Behavior

calling fetch('url', { method: 'POST', body: new URLSearchParams([ ['foo', 1], ['bar', true] ])

results in https://github.com/ionic-team/capacitor/blob/main/core/native-bridge.ts#L475 Request being made with a body of ReadableStream

which is passed through convertBody https://github.com/ionic-team/capacitor/blob/main/core/native-bridge.ts#L54

onto cap.nativePromise which fails with a DataCloneError: The object can not be cloned. in postToNative

Expected Behavior

you can call fetch with the first parameter being a string url and the body being in the second parameter

Code Reproduction

Other Technical Details

npm --version output: 9.8.1

node --version output: 18.18.0

pod --version output (iOS issues only): 1.10.1

Additional Context

@philjones88
Copy link
Contributor Author

Investigating and debugging more:

https://github.com/ionic-team/capacitor/blob/main/core/native-bridge.ts#L57

This doesn't seem to work, I had planned to expand it to cover URLSearchParams but the body property of the Request object is a ReadableStream so not sure how instanceof would ever work...

@philjones88
Copy link
Contributor Author

Here's a sample:

https://codesandbox.io/s/capacitor-fetch-instanceof-testing-98cmm6?file=/src/index.ts

You will notice a JSON (string) request and a URLSearchParams request both log out as intanceof Object and ReadableStream NOT the original types...

This code surely doesn't work? My next step is to build a full Capacitor example. Maybe there's something specific to iOS and Android devices that makes body of not type ReadableStream ?

@Evand3r
Copy link

Evand3r commented Dec 10, 2023

I'm having a similar issue but it seems like it goes a bit deeper. I've been testing my app on my Android 12 phone (APK 31) with Chrome web view version 117 and when I tried to test it in an "old" Samsung S8+ with Android 9 (APK 28) and Chrome WebView version 97.0.4692.70 by login into my app, the request went off with an undefined body. Digging through the issue I found that the Request API body as a ReadableStream is only available in Chrome from version 105 & what I think is the main issue for me, the fact that when the new Request() constructor is called (either in RTK Query in my case, or called again in the fetch patch in capacitor) the request's body ends up undefined. If I disable CapacitorHttp in the config, the RTK query cloned request works as expected, so I'm suspecting the issue might be in the patched fetch in the native bridge code.

Android 12 (APK 31) Chrome WebView 117:
Android 12 (APK 31) Chrome WebView 117

Samsung S8+ with Android 9 (APK 28) and Chrome WebView version 97.0.4692.70:
Screenshot 2023-12-09 at 10 44 15 PM

*Edit: Seems like I was wrong and jumped the gun, I changed the form request to use fetch instead of the rtk query mutation and the new Request() in the native bridge didn't alter the request body. Looks like the issue might be some other place.

@mr-matt-b
Copy link

I'm getting the same issue trying to get the oidc-client-ts OAuth flow from a Web App working in Android. The /token endpoint creates a URLSearchParams object and passes it to the body, which winds up empty after sending it across the bridge.

I can go into more detail but since the PR that solves this issue has already been approved I figure there's no need. Is there something else stopping this PR from being merged?

Copy link

ionitron-bot bot commented Mar 15, 2024

This issue has been labeled as type: bug. This label is added to issues that that have been reproduced and are being tracked in our internal issue tracker.

Copy link

ionitron-bot bot commented May 2, 2024

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Capacitor, please create a new issue and ensure the template is fully filled out.

@ionitron-bot ionitron-bot bot locked and limited conversation to collaborators May 2, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
platform: ios type: bug A confirmed bug report
Projects
None yet
5 participants