SDK for JavaScript v3 - "Error: TypeError: NetworkError when attempting to fetch resource"

0

I followed this tutorial to get started using the AWS SDK for JavaScript (version 3) within React Native apps, in order to, say, create and delete buckets stored in Amazon S3. I completed all the steps in the tutorial, but ran into an issue on Step 6: running the example React Native app. The app does run in my browser, fortunately. The problem is, the app keeps giving me the error message in the question title, whenever I type a bucket name into the text input field and subsequently press the button that calls this asynchronous JavaScript function for creating buckets:

const createBucket = async () => {
    setSuccessMsg('');
    setErrorMsg('');
  
    try {
        await client.send(new CreateBucketCommand({ Bucket: bucketName }));
        setSuccessMsg(`Bucket '${bucketName}' created.`);
    } catch (e) {
          setErrorMsg(e);
    }
};

What gives? I successfully created a Cognito Identity pool and attached the AmazonS3FullAccess policy to the unauthenticated identities IAM role. And I am positive that I provided the correct credentials—region and identity pool ID—within the React Native code.

If it matters, I used Expo, not the React Native CLI, to create and run the app.

profile picture
Ben
질문됨 2년 전1420회 조회
1개 답변
0

Hello Ben,

It's possible that you have entered a bucket name that violated S3's bucket naming rules [1].

Additionally, "TypeError: Network error when attempting to fetch resource" usually indicates CORS error [2]. This might happens if you're sending your create bucket request to a region other than us-east-1, since your application will have to handle 307 Temporary Redirect [3], thus triggering a CORS error. The sample code from the tutorial allows you to change the configured region by changing the line (line 18) const REGION = "REGION" to const REGION = "us-east-1", which might resolve the CORS error.

Best,

1: S3 bucket naming rules

2: CORS - Mozilla documentation

3: S3 createbucket command

Triet_V
답변함 2년 전

로그인하지 않았습니다. 로그인해야 답변을 게시할 수 있습니다.

좋은 답변은 질문에 명확하게 답하고 건설적인 피드백을 제공하며 질문자의 전문적인 성장을 장려합니다.

질문 답변하기에 대한 가이드라인

관련 콘텐츠