I want to return a 401 status on an action when a certain error occurs

Sven · 2024-11-01T18:58:32.216Z

Hi kapa, i want to return a response of 401 when a certain action fails. In my case my action fetches some information from an external API but when this fails with a 401 status i want to also return a 401 status to the client. ```ts const response = await axios.post(tokenUrl, {}, { headers }); if (response.status === 401) { throw new HttpError(401, 'Bs'); } ``` Right now i do the following above but it throws the error but does still return a 200 to the client.

K

kapa.ai•11/1/24, 6:58 PM

Hi @Sven. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

K

kapa.ai•11/1/24, 6:58 PM

----------------------
To return a 401 status code from an action when a certain error occurs, you're on the right track by using the

HttpError

HttpError

HttpError

HttpError class. However, there might be an issue with how the error is being handled or propagated in your action.

Based on the Wasp documentation, throwing an

HttpError

HttpError

HttpError

HttpError in an action should indeed result in the specified status code being sent to the client. Here's how you can properly implement this:

import { HttpError } from 'wasp/server'

export const yourAction = async (args, context) => {
  try {
    const response = await axios.post(tokenUrl, {}, { headers });
    // Process successful response
  } catch (error) {
    if (error.response && error.response.status === 401) {
      throw new HttpError(401, 'Bad Bol Credentials');
    }
    // Handle other errors
    throw new HttpError(500, 'An unexpected error occurred');
  }
}

import { HttpError } from 'wasp/server'

export const yourAction = async (args, context) => {
  try {
    const response = await axios.post(tokenUrl, {}, { headers });
    // Process successful response
  } catch (error) {
    if (error.response && error.response.status === 401) {
      throw new HttpError(401, 'Bad Bol Credentials');
    }
    // Handle other errors
    throw new HttpError(500, 'An unexpected error occurred');
  }
}

import { HttpError } from 'wasp/server'

export const yourAction = async (args, context) => {
  try {
    const response = await axios.post(tokenUrl, {}, { headers });
    // Process successful response
  } catch (error) {
    if (error.response && error.response.status === 401) {
      throw new HttpError(401, 'Bad Bol Credentials');
    }
    // Handle other errors
    throw new HttpError(500, 'An unexpected error occurred');
  }
}

import { HttpError } from 'wasp/server'

export const yourAction = async (args, context) => {
  try {
    const response = await axios.post(tokenUrl, {}, { headers });
    // Process successful response
  } catch (error) {
    if (error.response && error.response.status === 401) {
      throw new HttpError(401, 'Bad Bol Credentials');
    }
    // Handle other errors
    throw new HttpError(500, 'An unexpected error occurred');
  }
}

This approach should correctly propagate the 401 status to the client when the external API returns a 401 status Wasp Docs: Actions Error Handling (https://wasp-lang.dev/docs/data-model/operations/actions#error-handling).

A few key points to note:

Make sure you're importing
```
HttpError
```
HttpError
```
HttpError
```
HttpError
from 'wasp/server'.
Wrap the axios call in a try-catch block to properly handle the error.
Check for the error response status in the catch block.
Throw the
```
HttpError
```
HttpError
```
HttpError
```
HttpError
with the desired status code and message.

If you're still seeing a 200 status returned to the client after implementing this, there might be an issue with how the action is defined in your

main.wasp

main.wasp

file or how it's being called from the client. Double-check that the action is properly defined and that you're handling the error correctly on the client side.

K

kapa.ai•11/1/24, 6:58 PM

Remember, for security reasons, Wasp by default sends all exceptions as 500 status codes to avoid leaking sensitive information. By explicitly using

HttpError

HttpError

HttpError

HttpError, you're telling Wasp that it's safe to send this specific error status and message to the client Wasp Docs: Queries Error Handling (https://wasp-lang.dev/docs/data-model/operations/queries#error-handling).

If you continue to face issues, you might want to review your entire action implementation and how it's being called to ensure there are no other factors interfering with the error propagation.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------

K

kapa.ai•11/1/24, 6:58 PM

Sorry @Sven, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:

Perhaps try again in 15mins?

S

SvenOP•11/1/24, 7:01 PM

Wait but the function that does:

throw new HttpError(401, 'Bad Credentials');

Is not the function/action exported, but it is called by the function that is exported. Could this be the issue?

@kapa.ai

K

kapa.ai•11/1/24, 7:01 PM

Let me check the knowledge base for you again. One moment! :books:

K

kapa.ai•11/1/24, 7:01 PM

----------------------
You've made an excellent observation. Yes, this could indeed be the issue. The

HttpError

HttpError

HttpError

HttpError needs to be thrown from the main exported action function for Wasp to properly handle it and return the correct status code to the client.

Let's adjust the structure to ensure the

HttpError

HttpError

HttpError

HttpError is thrown from the exported action:

import { HttpError } from 'wasp/server'

const fetchExternalData = async (tokenUrl, headers) => {
  try {
    const response = await axios.post(tokenUrl, {}, { headers });
    return response.data;
  } catch (error) {
    if (error.response && error.response.status === 401) {
      throw new Error('Bad Credentials');
    }
    throw error;
  }
}

export const yourExportedAction = async (args, context) => {
  try {
    const data = await fetchExternalData(args.tokenUrl, args.headers);
    // Process data
    return data;
  } catch (error) {
    if (error.message === 'Bad Credentials') {
      throw new HttpError(401, 'Bad Credentials');
    }
    // Handle other errors
    throw new HttpError(500, 'An unexpected error occurred');
  }
}

import { HttpError } from 'wasp/server'

const fetchExternalData = async (tokenUrl, headers) => {
  try {
    const response = await axios.post(tokenUrl, {}, { headers });
    return response.data;
  } catch (error) {
    if (error.response && error.response.status === 401) {
      throw new Error('Bad Credentials');
    }
    throw error;
  }
}

export const yourExportedAction = async (args, context) => {
  try {
    const data = await fetchExternalData(args.tokenUrl, args.headers);
    // Process data
    return data;
  } catch (error) {
    if (error.message === 'Bad Credentials') {
      throw new HttpError(401, 'Bad Credentials');
    }
    // Handle other errors
    throw new HttpError(500, 'An unexpected error occurred');
  }
}

import { HttpError } from 'wasp/server'

const fetchExternalData = async (tokenUrl, headers) => {
  try {
    const response = await axios.post(tokenUrl, {}, { headers });
    return response.data;
  } catch (error) {
    if (error.response && error.response.status === 401) {
      throw new Error('Bad Credentials');
    }
    throw error;
  }
}

export const yourExportedAction = async (args, context) => {
  try {
    const data = await fetchExternalData(args.tokenUrl, args.headers);
    // Process data
    return data;
  } catch (error) {
    if (error.message === 'Bad Credentials') {
      throw new HttpError(401, 'Bad Credentials');
    }
    // Handle other errors
    throw new HttpError(500, 'An unexpected error occurred');
  }
}

import { HttpError } from 'wasp/server'

const fetchExternalData = async (tokenUrl, headers) => {
  try {
    const response = await axios.post(tokenUrl, {}, { headers });
    return response.data;
  } catch (error) {
    if (error.response && error.response.status === 401) {
      throw new Error('Bad Credentials');
    }
    throw error;
  }
}

export const yourExportedAction = async (args, context) => {
  try {
    const data = await fetchExternalData(args.tokenUrl, args.headers);
    // Process data
    return data;
  } catch (error) {
    if (error.message === 'Bad Credentials') {
      throw new HttpError(401, 'Bad Credentials');
    }
    // Handle other errors
    throw new HttpError(500, 'An unexpected error occurred');
  }
}

In this structure, the

HttpError

HttpError

HttpError

HttpError is thrown from the exported action function (

yourExportedAction

yourExportedAction

yourExportedAction

yourExportedAction), which should correctly propagate the 401 status to the client Wasp Docs: Actions Error Handling (https://wasp-lang.dev/docs/data-model/operations/actions#error-handling).

This approach allows you to:

Keep your external API call logic separate.
Handle specific errors from the external API.
Throw the appropriate
```
HttpError
```
HttpError
```
HttpError
```
HttpError
from the main exported action.

K

kapa.ai•11/1/24, 7:01 PM

By structuring your code this way, Wasp should properly handle the

HttpError

HttpError

HttpError

HttpError and return the correct status code to the client. If you're still experiencing issues after making this change, it might be worth reviewing how the action is defined in your

main.wasp

main.wasp

file and how it's being called from the client side.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------

K

kapa.ai•11/1/24, 7:01 PM

Sorry @Sven, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:

Perhaps try again in 15mins?

F

Filip•11/11/24, 1:19 PM

@Sven Still need help with this one?

S

SvenOP•11/11/24, 1:21 PM

Nope

F

Filip•11/11/24, 2:23 PM

Great to hear

I want to return a 401 status on an action when a certain error occurs

Similar Threads

Similar Threads

Similar Threads