rare-sapphire•12mo ago

Is Simple-rest made for auth ?

is simple rest made just for basic api calls? cause i m trying to implement auth and its forcing me to create axios instance which comes out of the box in simplerest

8 Replies

kapa.ai•12mo ago

Hi @tarang._. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- The @refinedev/simple-rest data provider in refine is designed to work with REST APIs and it does come with built-in support for making HTTP requests. However, when it comes to implementing authentication, you might need to create an instance of axios to handle the addition of authorization headers to your API calls. For example, you can use axios.create() to create a new instance of axios and then use axiosInstance.interceptors.request.use to add the token acquired from the login method to the Authorization header of API calls. This is useful for more complex use cases such as refreshing tokens when they expire. Here's an example of how you can do this:

import axios, { AxiosRequestConfig } from "axios";  

const axiosInstance = axios.create();  

axiosInstance.interceptors.request.use((request: AxiosRequestConfig) => {  
 // Retrieve the token from local storage  
 const token = JSON.parse(localStorage.getItem("auth"));  
 // Check if the header property exists  
 if (request.headers) {  
 // Set the Authorization header if it exists  
 request.headers["Authorization"] = `Bearer ${token}`;  
 } else {  
 // Create the headers property if it does not exist  
 request.headers = {  
 Authorization: `Bearer ${token}`,  
 };  
 }  

 return request;  
});

import axios, { AxiosRequestConfig } from "axios";  

const axiosInstance = axios.create();  

axiosInstance.interceptors.request.use((request: AxiosRequestConfig) => {  
 // Retrieve the token from local storage  
 const token = JSON.parse(localStorage.getItem("auth"));  
 // Check if the header property exists  
 if (request.headers) {  
 // Set the Authorization header if it exists  
 request.headers["Authorization"] = `Bearer ${token}`;  
 } else {  
 // Create the headers property if it does not exist  
 request.headers = {  
 Authorization: `Bearer ${token}`,  
 };  
 }  

 return request;  
});

This code is taken from the refine documentation (https://refine.dev/docs/tutorial/understanding-authprovider/create-authprovider/). So, while @refinedev/simple-rest does provide out-of-the-box functionality for making API calls, you might need to use axios directly when you need more control over the request configuration, such as when implementing authentication. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•12mo ago

<@852840146495340564> kapa.ai is still learning and improving, please let us know how it did by reacting below

fascinating-indigo•12mo ago

Hello @tarang._, Yes, we created simple-rest for basic API calls and it's uses axios.. You can quickly develop your REST data provider for your own application https://refine.dev/docs/tutorial/understanding-dataprovider/create-dataprovider/

rare-sapphire•12mo ago

thanks for quick response , so what i can understand i have to create my own axios instance for auth provider and data provider

fascinating-indigo•12mo ago

no it shouldn't be required unless if you want to use axios.interceptors

rare-sapphire•12mo ago

yeah i actually do need interceptor for jwt validation

fascinating-indigo•12mo ago

Yes, you can create your own axios instance for this. Also, please add this interceptor: https://github.com/refinedev/refine/blob/next/packages/simple-rest/src/utils/axios.ts This will map errors for refine. HttpError interface used in notifications

GitHub

refine/packages/simple-rest/src/utils/axios.ts at next · refinedev/...

Build your React-based CRUD applications, without constraints. 🌟 Star to support our work! - refinedev/refine

rare-sapphire•12mo ago

thanks