The localhost works. Yet I got a response with html block of code when using ngrok as my VITE_REACT_APP_BASE_URL. I tried to use the http and https of the ngrok link and yet I got still the same response.
I got that response when getting the route of user/current. I use zustand as my state management.
// response of the `/user/current` route.
Object { data: '<!DOCTYPE html>\n<html class="h-full" lang="en-US" dir="ltr">\n <head>\n <link rel="preload" href="https://cdn.ngrok.com/static/fonts/euclid-square/EuclidSquare-Regular-WebS.woff" as="font" type="font/woff" crossorigin="anonymous" />\n <link rel="preload" href="https://cdn.ngrok.com/static/fonts/euclid-square/EuclidSquare-RegularItalic-WebS.woff" as="font" type="font/woff" crossorigin="anonymous" />\n <link rel="preload" href="https://cdn.ngrok.com/static/fonts/euclid-square/EuclidSquare-Medium-WebS.woff" as="font" type="font/woff" crossorigin="anonymous" />\n <link rel="preload" href="https://cdn.ngrok.com/static/fonts/euclid-square/EuclidSquare-Semibold-WebS.woff" as="font" type="font/woff" crossorigin="anonymous" />\n <link rel="preload" href="https://cdn.ngrok.com/static/fonts/euclid-square/EuclidSquare-MediumItalic-WebS.woff" as="font" type="font/woff" crossorigin="anonymous" />\n <link rel="preload" href="https://cdn.ngrok.com/static/fonts/ibm-plex-mono/IBMPlexMono-Text.woff" as="font" type="font/woff" crossorigin="anonymous" />\n <link rel="preload" href="https://cdn.ngrok.com/static/fonts/ibm-plex-mono/IBMPlexMono-TextItalic.woff" as="font" type="font/woff" crossorigin="anonymous" />\n <link rel="preload" href="https://cdn.ngrok.com/static/fonts/ibm-plex-mono/IBMPlexMono-SemiBold.woff" as="font" type="font/woff" crossorigin="anonymous" />\n <link rel="preload" href="https://cdn.ngrok.com/static/fonts/ibm-plex-mono/IBMPlexMono-SemiBoldItalic.woff" as="font" type="font/woff" crossorigin="anonymous" />\n <meta charset="utf-8">\n <meta name="author" content="ngrok">\n <meta name="description" content="ngrok is the fastest way to put anything on the internet with a single command.">\n <meta name="robots" content="noindex, nofollow">\n <meta name="viewport" content="width=device-width, initial-scale=1">\n <link id="style" rel="stylesheet" href="https://cdn.ngrok.com/static/css/error.css">\n <noscript>You are about to visit d4f1-103-62-153-180.ngrok-free.app, served by 103.62.153.180. This website is served for free through ngrok.com. You should only visit this website if you trust whoever sent the link to you. (ERR_NGROK_6024)</noscript>\n <script id="script" src="https://cdn.ngrok.com/static/js/error.js"
// Axios config
import axios from "axios";
const AxiosInstance = axios.create({
// baseURL: "http://127.0.0.1:8000/api",
baseURL: import.meta.env.VITE_REACT_APP_BASE_URL + "/api",
headers: {
"Content-type": "application/json",
Accept: "application/json",
},
});
AxiosInstance.interceptors.request.use((config) => {
const token = localStorage.getItem("token");
if (token) {
config.headers.Authorization = `Bearer ${token}`;
}
return config;
});
export default AxiosInstance;
getUser: async () => {
set({ loading: true });
try {
const response = await AxiosInstance.get("/user/current");
console.log("test ", response);
if (response.data && response.data.data) {
const { data } = response.data;
const userStatus = data.is_activated;
set({
currentUser: userStatus ? data : null,
userStatus,
userFirstName: data.first_name,
userEmail: data.email,
userRole: data.role,
loading: false,
});
} else {
console.log("Unexpected response structure");
set({ loading: false });
}
return response.data;
} catch (error) {
console.log(error);
// toast.error("An error occurred while fetching user data");
// const errors = error.response.data.message.error;
// console.log(errors);
// for (const field in errors) {
// errors[field].forEach((errorMessage) => {
// toast.error(`${errorMessage}`);
// });
// }
set({ loading: false });
}
},
