Moved from axios to Fetch API, Added user object to the AuthState

This commit is contained in:
Filip Rojek 2024-05-08 16:31:21 +02:00
parent 89075eb6ae
commit 8e25ca5dd7
3 changed files with 64 additions and 27 deletions

View File

@ -18,7 +18,6 @@ router.get('/', docsController.docs_get);
router.post("/auth/signup",validate(AuthVal.signup) , authController.signup_post);
router.post("/auth/signin",validate(AuthVal.signin) , authController.signin_post);
router.options("/auth/signin",validate(AuthVal.signin) , authController.signin_post);
router.post("/auth/logout", requireAuth, authController.logout_post);
router.get("/auth/status", requireAuth, authController.status_get);

View File

@ -3,11 +3,13 @@ import { Text, View } from "react-native";
import { useAuth } from "../context/AuthContext";
export default function Index() {
const { onLogout } = useAuth();
const user = "debil"
const { onLogout, authState } = useAuth();
const user = authState.user;
return (
<View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
<Text>Welcome {user}</Text>
<Text>Welcome {user.username}</Text>
<Text
onPress={() => {
// The `app/(app)/_layout.tsx` will redirect to the sign-in screen.

View File

@ -1,5 +1,4 @@
import { createContext, useContext, useEffect, useState } from "react";
import axios from "axios";
import storageUtil from "./storage";
const TOKEN_KEY = "my-jwt";
@ -26,12 +25,17 @@ export function AuthProvider({ children }) {
const token = await storageUtil.getItem(TOKEN_KEY);
console.log(`stored: ${token}`);
if (token) {
axios.defaults.headers.common["Authorization"] = `Bearer ${token}`;
const resUser = await fetch(`${API_URL}/auth/status`, {
credentials: "include",
});
const userData = await resUser.json();
if (token && resUser.status == 200) {
setAuthState({
token: token,
authenticated: true,
user: userData.data,
});
return;
@ -39,6 +43,7 @@ export function AuthProvider({ children }) {
setAuthState({
authenticated: false,
token: null,
user: null,
});
}
loadToken();
@ -46,49 +51,80 @@ export function AuthProvider({ children }) {
async function register(username, email, password) {
try {
const res = await axios.post(`${API_URL}/auth/signup`, {
const res = await fetch(`${API_URL}/auth/signup`, {
method: 'POST',
credentials: 'include',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
username,
email,
password,
});
return res
password
})
})
return res;
} catch (err) {
return { error: true, msg: err.response.data};
return { error: true, msg: err.response.data };
}
}
async function login(email, password) {
try {
const res = await axios.post(`${API_URL}/auth/signin`, {
const resLogin = await fetch(`${API_URL}/auth/signin`, {
method: "POST",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
email,
password,
}),
});
const loginData = await resLogin.json();
const resUser = await fetch(`${API_URL}/auth/status`, {
credentials: "include",
});
if (resUser.status != 200) {
throw Error("user does not have user data");
}
const userData = await resUser.json();
setAuthState({
token: res.data.data.jwt,
token: loginData.data.jwt,
authenticated: true,
user: userData.data,
});
//axios.defaults.headers.common[
// "Authorization"
//] = `Bearer ${res.data.data.jwt}`;
await storageUtil.setItem(TOKEN_KEY, res.data.data.jwt);
return res
await storageUtil.setItem(TOKEN_KEY, loginData.data.jwt);
} catch (err) {
console.error("Failed to log in", err)
return { error: true, msg: err.res };
}
}
async function logout() {
await storageUtil.delItem(TOKEN_KEY);
let res = await fetch(`${API_URL}/auth/logout`, {
method: "POST",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({}),
});
res = await res.json();
axios.defaults.headers.common["Authorization"] = "";
await storageUtil.delItem(TOKEN_KEY);
setAuthState({
token: null,
authenticated: false,
user: null,
});
}