R
Refine

ask-any-question

cannot capture error when authenticating

Rrising-crimson8/26/2023
I'm using refine.dev with strapi for login and data access. How can I capture login error ? My authprovider.ts looks like this, and I don't know to attach an handler on a failed response. export const authProvider: AuthBindings = { login: async ({ email, password }) => { const { data, status } = await strapiAuthHelper.login(email, password);
Kkapa.ai8/26/2023
Hi @dannywhiteagile. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- In your authProvider's login method, you can handle the login error by checking the status of the response. If the status is not 200, you can return an object with success set to false and an error object containing a message and name. Here's how you can do it:
export const authProvider: AuthBindings = {
login: async ({ email, password }) => {
const { data, status } = await strapiAuthHelper.login(email, password);
if (status === 200) {
localStorage.setItem(TOKEN_KEY, data.jwt);

// set header axios instance
axiosInstance.defaults.headers.common = {
Authorization: `Bearer ${data.jwt}`,
};

return {
success: true,
redirectTo: "/",
};
}
return {
success: false,
error: {
message: "Login Error",
name: "Invalid email or password",
},
};
},
// ...
};
export const authProvider: AuthBindings = {
login: async ({ email, password }) => {
const { data, status } = await strapiAuthHelper.login(email, password);
if (status === 200) {
localStorage.setItem(TOKEN_KEY, data.jwt);

// set header axios instance
axiosInstance.defaults.headers.common = {
Authorization: `Bearer ${data.jwt}`,
};

return {
success: true,
redirectTo: "/",
};
}
return {
success: false,
error: {
message: "Login Error",
name: "Invalid email or password",
},
};
},
// ...
};
In the above code, if the status is not 200, it means there's an error with the login. In this case, we return an object with success set to false and an error object with a message and name properties. You can customize the message and name to suit your needs. For more information, you can refer to the React Admin Panel Tutorial with Chakra UI and Strapi (https://refine.dev/blog/react-admin-tutorial) on the refine.dev blog. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
Kkapa.ai8/26/2023
<@1129002557419827210> kapa.ai is still learning and improving, please let us know how it did by reacting below
Rrising-crimson8/26/2023
I cannot see the status code. seems that the error in catched somewhere else. where this errors are catched?
Ooptimistic-gold8/26/2023
Hello @dannywhiteagile, you can use try catch
try {
const { data, status, statusText } = await strapiAuthHelper.login(
email,
password,
);


} catch (error) {
// do something with error
}
try {
const { data, status, statusText } = await strapiAuthHelper.login(
email,
password,
);


} catch (error) {
// do something with error
}
Rrising-crimson8/26/2023
you are the best ! it works
Ooptimistic-gold8/26/2023
I'm glad to hear that ๐Ÿ™Œ๐Ÿป
Rrising-crimson8/26/2023
this seems to break the authetication. no longer works for right username/ password :/ export const authProvider: AuthBindings = { login: async ({ email, password }) => { try { const { data, status } = await strapiAuthHelper.login( email, password, ); } catch (error) { // do something with error // return { success: false, error: { message: "Login fallito", name: "Attenzione: username / password invalidi", }, }; // } login no longer works. putting this out of the try catch block works again (but no error handling) const { data, status } = await strapiAuthHelper.login( email, password, );
Ooptimistic-gold8/26/2023
you are not returning anything in the try scope
Ooptimistic-gold8/26/2023
GitHub
refine/examples/data-provider-strapi-v4/src/App.tsx at next ยท refin...
Build your React-based CRUD applications, without constraints. ๐ŸŒŸ Star to support our work! - refinedev/refine
Ooptimistic-gold8/26/2023
you can follow this example
Rrising-crimson8/26/2023
it works now. this is my the code. I post it for anyone needing that export const authProvider: AuthBindings = { login: async ({ email, password }) => { /**/ try { const { data, status } = await strapiAuthHelper.login( email, password, ); if (status === 200) { localStorage.setItem(TOKEN_KEY, data.jwt); // set header axios instance axiosInstance.defaults.headers.common[ "Authorization" ] = Bearer ${data.jwt}; return { success: true, redirectTo: "/", }; } return { success: false, error: { message: "Login fallito", name: "Attenzione: username / password invalidi", }, }; } catch (error) { // do something with error return { success: false, error: { message: "Login fallito", name: "Attenzione: username / password invalidi", }, }; } },

Looking for more? Join the community!

R
Refine

ask-any-question

Join Server
Recommended Posts
Getting StartedHow do I get startedHow to transform a value before it gets sent for a resource updateHi all! As the title states, I would like to know what the best practice is for transforming a valuuseEditable table without traditional save buttonFrom fine foods we can see how to make edits, but how can we achieve samething when we have to patchcustom authProvider - Passing API UrlHi! I currently have a custom authProvider that queries the /auth/login endpoint of my API. Right nhow to remove default valuesrewriting my own login.tsx, i have a code like this <TextField {...register("page titlewhat is the best way in a component to render the page title attribute ?default language for applicationhello, I need to change the default language for the application from English to Italian. I have alruseTable Custom API Endpoint?Hi! I'd like to use some functionalities of useTable (namely, onSearch), but using a custom API endinvalid hook call errorHi, using refine.dev (vite) I'm trying to "preload" data from UseList In order to do that, i'm tryiDoes self-hosted open-source Refine comes with all features?I'm a bit confused about these pages: 1. https://refine.dev/docs/comparison/ 2. https://refine.dev/phello guys can you tell me how to setuphello guys, can you tell me how to setup casl in react refine dev with access control provider ?useAutocomplete Server Side PaginationI have a controller that renders an autocomplete component. I am using the useAutocomplete hook to gMUI Inferencer Can't Detect Object Inside EntitySo I have the MUI Inferencer working well enough to detect some of my entity fields, but for some reWhat's the easiest way to create a product grid with search option ?when a product tile is clicked, it should show product details page etc. my db is supabase.Custom error messageI want to handle error message whenever i call getList from my dataProvidercustom error messageIn my app, Iam using a lot of forms. if there is an error message from an api call in the backgroundusing the react-i18next example I guess a type mismatchHey everyone, I just started integrating translations into our application and noticed that the docuuseSelect() with paramI have a list Address and I want to fetch list address base on user_id. How can I use useSelect to dInferencer considered a field as a relation and decided not to render itHey guys, could you please help me understand what happened: 1. fields [cust_id, id] returned from Problem in meta and headers in useSelect requestI am not able to use my bearer token in meta and header while using useSelect const { selectProps: