Just a quick blog on something I discovered in the docs for axios.<\/p>\n\n\n\n
If you find yourself making many external API calls in your code via axios, you may find that you are repeating yourself with each API call, e.g. adding an Authorisation header each time you make a request, or for example:<\/p>\n\n\n\n
export async function sendStuffToMyAPI(id: number, data: SendData): Promise<void> {\n const response: any = await axios.post(`${config.myAPIBaseUrl<\/strong>}\/entity\/${id}`, data, {\n headers: {\n Authorization: config.myToken,\n },\n<\/strong> });\n}\n\nexport async function getStuffFromMyAPI(id: number): Promise<AxiosResponse> {\n const response: any = await axios.get(`${config.myAPIBaseUrl<\/strong>}\/entity\/${id}`, {\n headers: {\n Authorization: config.myToken,\n },<\/strong>\n });\n\n return response.data;\n}\n<\/code><\/pre>\n\n\n\nAs seen above, we have to specify the headers and the Authorisation headers each time we make an API call. We can simplify this using axios.create(). To set up axios.create(), you give it some config, e.g. baseURL and headers and it returns an object that you can call the normal axios functions on, e.g. get, put, etc.<\/p>\n\n\n\n
As seen in the example below, it is kind of like having an SDK object that you can make calls to! First set up the axios object:<\/p>\n\n\n\n
const myAPI<\/strong> = axios.create({\n baseURL: config.myAPIBaseUrl<\/strong>,\n headers: { Authorization: config.myToken }<\/strong>,\n});<\/code><\/pre>\n\n\n\nThen you could simply make calls on the new myAPI object:<\/p>\n\n\n\n
export async function sendStuffToMyAPI(id: number, data: SendData): Promise<void> {\n const response: AxiosResponse = await myAPI<\/strong>.post(`\/entity\/${id}`, data);\n}\n\nexport async function getStuffFromMyAPI(id: number): Promise<AxiosResponse> {\n const response: AxiosResponse = await myAPI<\/strong>.get(`\/entity\/${id}`);\n\n return response.data;\n}<\/code><\/pre>\n\n\n\nAs you can see you can make api calls in your code a lot leaner with axios.create()! Note: I haven’t tested the above code so if there are syntax errors or other stuff please let me know!<\/p>\n\n\n\n
See here for more details: https:\/\/github.com\/axios\/axios#creating-an-instance<\/a><\/p>\n\n\n\n<\/p>\n","protected":false},"excerpt":{"rendered":"