ReferenceError: Property 'ReadableStream' doesn't exist, in React Native EXPO 51 iOS #6269
Description
Checkboxes for prior research
- I've gone through Developer Guide and API reference
- I've checked AWS Forums and StackOverflow.
- I've searched for previous similar issues and didn't find any solution.
Describe the bug
The following code works fine in Expo SDK50 Android, but on Expo SDK50 and SDK51 iOS, I'm getting the [ReferenceError: Property 'ReadableStream' doesn't exist] error.
const uploadImage = async (image, fileName) => { const options = { keyPrefix: path, bucket: bucketName, region: "ap-south-1", successActionStatus: 201 }; let credentials = { accessKeyId: "", secretAccessKey: "", }; const client = new S3Client({ region: options.region, credentials: credentials }); try { const file = { uri: image, name: fileName, type: 'image/jpeg', }; await client.send(new PutObjectCommand({ Bucket: options.bucket, Key: path, Body: file })); return true; } catch (error) { console.error(error); return false; } };
SDK version number
@aws-sdk/client-s3: ^3.556.0, react-native-url-polyfill@^2.0.0, react-native-get-random-values: ^1.11.0
Which JavaScript Runtime is this issue in?
React Native
Details of the browser/Node.js/ReactNative version
v0.74.2
Reproduction Steps
const uploadImage = async (image, fileName) => { const options = { keyPrefix: path, bucket: bucketName, region: "ap-south-1", successActionStatus: 201 }; let credentials = { accessKeyId: "", secretAccessKey: "", }; const client = new S3Client({ region: options.region, credentials: credentials }); try { const file = { uri: image, name: fileName, type: 'image/jpeg', }; await client.send(new PutObjectCommand({ Bucket: options.bucket, Key: path, Body: file })); return true; } catch (error) { console.error(error); return false; } };Observed Behavior
Error thrown in production & development
Expected Behavior
The image should have been uploaded
Possible Solution
Referred Stackoverflow solution and tried
import 'react-native-get-random-values'; import 'react-native-url-polyfill/auto'; import { ReadableStream } from 'web-streams-polyfill/ponyfill'; globalThis.ReadableStream = ReadableStream;With v4.0.0, I get the error ‘Unable to resolve module web-streams-polyfill/ponyfill’. And with v3.3.3, getting [TypeError: null is not a function] error thrown.
Additional Information/Context
The above block of code works fine in Expo SDK50 Android, but on Expo SDK50 and SDK51 iOS, it throws the mentioned error.