Error code not provided when goes to catch block for fetch request

[orelHAnyvision]

Hi
Im trying to create a custom hook out of this package to wrap all my client requests
for some reason if there is error and it goes to the catch block the only info I get is error.stack and error.message
I would like to get the status code so that if its 403 i will logout the user

when looking at dev tools I do see error for the request with 403 Forbidden error

code snippet

function useApiGatewayClient() {
 const awsClient = new AwsClient({
   accessKeyId :...',
   secretAccessKey: ...,
   sessionToken: ...
   region: 'eu-central-1',
   service: 'execute-api',
 })

 const awsFetch = async (input: RequestInfo, init?: RequestInit) => {
   console.log('1')
   const response = await awsClient.fetch(input, init)
   console.log('2')
   console.log({ response })
   const json = await response.json()
   return json
 }

 return awsFetch
}

export { useApiGatewayClient }

thanks

[mhart]

I'm not sure what you're expecting here? You're creating and throwing the error yourself in this line:

throw new Error(`${response.status} ${response.statusText}`)

(I might just be misunderstanding the problem here)

[orelHAnyvision]

I'm not sure what you're expecting here? You're creating and throwing the error yourself in this line:

throw new Error(`${response.status} ${response.statusText}`)

(I might just be misunderstanding the problem here)

you're right, I updated the code
I see that in fetch even if you get error or not its not throwing erros
so i try to get the status code from the response but this line doesn't happen

[mhart]

So fetch doesn't throw errors just because it has a non-200 status codes.

Does this not work?

const response = await awsClient.fetch(input, init)
if (response.status === 403) {
  console.log('Got a 403')
}

If that doesn't work, what happens instead?

[orelHAnyvision]

if (response.status === 403) {
  console.log('Got a 403')
}

I updated the code snippet again
we just don't reach to this line after the fetch execution
(on the devtools console I see CORS errors)

[mhart]

Oh, CORS errors – well that's up to you to solve

[orelHAnyvision]

Oh, CORS errors – well that's up to you to solve

but still I see the request on the devtools network with 403 forbidden error

[mhart]

The actual GET/POST request won't actually make it to the server – it's the browser throwing the error. (Any request you do see getting sent to the backend is probably an OPTIONS request)

In any case, this is a browser issue – you need to deal with it the same as any fetch you would make from the browser

[mhart]

By that I mean, there should be no difference here between:

// Just calling the global fetch function
const response = await fetch(input, init)

And:

// Calling this library's fetch function
const response = await awsClient.fetch(input, init)

There will be CORS errors in both cases unless you handle CORS correctly

[orelHAnyvision]

By that I mean, there should be no difference here between:

// Just calling the global fetch function
const response = await fetch(input, init)

And:

// Calling this library's fetch function
const response = await awsClient.fetch(input, init)

There will be CORS errors in both cases unless you handle CORS correctly

you're right
problem is only when I send invalid STS(accessKeyId, secretAccessKey, sessionToken)
if I send those and they are valid the response looks great
once I remove one of them/one of them is invalid I get the CORS error

[mhart]

you're right problem is only when I send invalid STS(accessKeyId, secretAccessKey, sessionToken) if I send those and they are valid the response looks great once I remove one of them/one of them is invalid I get the CORS error

That doesn't really make sense. Just to confirm: are you seeing two requests? The first one being a pre-flight OPTIONS request and the second one being the request you're trying to make? And is it only the second request that's failing?

[orelHAnyvision]

you're right problem is only when I send invalid STS(accessKeyId, secretAccessKey, sessionToken) if I send those and they are valid the response looks great once I remove one of them/one of them is invalid I get the CORS error

That doesn't really make sense. Just to confirm: are you seeing two requests? The first one being a pre-flight OPTIONS request and the second one being the request you're trying to make? And is it only the second request that's failing?

No just one
I configures aws api gateway with cors with * in all options
now seems like its working and returning status in the response
problem its happening for valid sts :(

[mhart]

You're not sending service: 'execute-api' for STS are you? (edit, or by "valid sts" do you just mean "valid credentials"?)

[orelHAnyvision]

I already have the STS in my app
I send them along to access IAM auth api gateway

I checking the headers and I see some of them missing like
X-Amz-Security-Token

[orelHAnyvision]

@mhart oh I think i found the issue
I added allHeaders options and set to true and then some of the headers were missing
I fixed it
thanks!

[mhart]

So I'm confused – what was the issue that started this whole thing?

[orelHAnyvision]

1. I didn't have any CORS configuration on AWS API gateway which I think caused everything
2. I added allHeaders option for no reason
3. I'm usually working with axios so I thought an error should be thrown in case of an error

BTW
is there any future plan to do it with axios? so we could add interceptors?

[mhart]

Last I looked at axios it was a huge library – I wrote this so that it was just a small extension to the web standard fetch API