Google oauth starter #5
Conversation
…ied due to permission issues.
… a format i'm used to. learned the previous one from a tutorial and got to understand it.
…taU/capstone into google-oauth-starter
| if(!authorizationHeader || !authorizationHeader.startsWith('Bearer ')){ | ||
| return res.status(401).json({error: "Unauthorized"}) | ||
| } |
There was a problem hiding this comment.
What is 'Bearer '? Why do we need this check here?
There was a problem hiding this comment.
a bearer is needed in the authorization header to hold the token for the user credentials. the block of code is not needed. I was mainly using it to check the functionality of the url on insomnia. say i go to insomnia and i key in anything not Authorization as the key and anything not "Bearer " as the value, it just returns an error.
| const nav = useNavigate() | ||
| function isSignedOut(){ | ||
| signOut(auth).then(() => { | ||
| console.log("Signed out Successfully") |
| return( | ||
| <div> | ||
| <header> | ||
| <img src="img/logo.png" alt="" /> |
| <header> | ||
| <img src="img/logo.png" alt="" /> | ||
| <nav> | ||
| <p>Welcome {email ? email : ''}</p> |
There was a problem hiding this comment.
If the email is empty, that means some error as occured right? Displaying an empty string '' might be confusing, can we throw an error if that is the case?
Feel free to do it as a follow up if this is hard to implement right now
There was a problem hiding this comment.
yeah i don't think i can throw an error in a ternary. maybe there's some other way i can go about it.
| const googleUser = googleUserCred.user | ||
| const token = await googleUser.getIdToken(true) | ||
| const response = await fetch( | ||
| "http://127.0.0.1:5001/feedplanner/us-central1/validateUserJWTToken", |
There was a problem hiding this comment.
Can we const this string somewhere in the project instead of hard coding here?
Maybe we can have a dedicated file for Urls in the project
There was a problem hiding this comment.
i stored it as the base url in the env and imported it.
| console.log(user) | ||
| const token = await user.getIdToken(true) | ||
| const response = await fetch( | ||
| "http://127.0.0.1:5001/feedplanner/us-central1/validateUserJWTToken", |
| //getting the access token | ||
| const token = await user.getIdToken(true) | ||
| const response = await fetch( | ||
| "http://127.0.0.1:5001/feedplanner/us-central1/validateUserJWTToken", |
Why do we usee the email and password field twice? Shouldn't sign up and login be seperate pages? |
|
this is not close to the final design but i want to have both on the same page but toggled so when one is clicked the other doesn't show |
| export function ErrorPage(){ | ||
| return( | ||
| <div> | ||
| <h1>404 NOT FOUNDDDDD</h1> |
This pull request is displaying the different authentications I have implemented using firebase. I changed the formats for my auth functions for sign up, sign in with and google to one i'm similar and also fetched from the functions http (http://127.0.0.1:5001/feedplanner/us-central1/validateUserJWTToken). This verifies using the Authorization - Bearer HTTP authorization that the token belongs to a particular. Also, the user's details display in my firestore database after verification takes place. Next goals include creating collections for my pantry and mealplanner in the db, completing my MVP and making the UI look great
MILESTONE:
Milestone 1 was getting the welcome page, auth page and home page situated so this is a step in the right direction.
RESOURCES:
I learned to verify JWTs from a part of this tutorial: https://youtu.be/_fv4e8LgMqg?si=WsXJRUcSQJDrRn-y
TEST PLAN:
Screen.Recording.2025-06-27.at.11.19.08.AM.mov
it doesnt allow files bigger than 10mb to paste