google authentication popup issue.

okay first off what i want: the integrated google authentication to work. what i have done: 1. created a project with the google auth option. 2. created a client link on console.cloud.google. 3. put the link in login.tsx. on start i get 3 console errors(also before editing any code): 1. undefined. 2. Failed to load resource: the server responded with a status of 403 (). 3. [GSI_LOGGER]: The given origin is not allowed for the given client ID. i also tried going on your refine.dev.docs.examples for this exact problem to see the auth work in sandbox mode, i got the same errors there. i get a blank popup where i can't write anything. i made another project where i also installed everything the same way, same result. i restarted my computer just in case but it changed nothing. as i'm pretty new with limited knowledge i don't really know what's causing the issue. just where i get the errors, i can provide relevant pictures and information if requested. i'm pretty sure who ever reads this have more knowledge on what's more important to specifically look into than i'am. thank you.
extended-salmon
extended-salmonβ€’456d ago
Hey, I am refine support bot :wave:. I am here to help you with your question. I searched for the answer to your question in the refine documentation and could not find an answer. Please wait for someone from the refine core team or the community to try to help you. πŸ‘Š
metropolitan-bronze
metropolitan-bronzeβ€’455d ago
Hello @w4rz0r , from google cloud, can you add localhost to the allowed origins?
genetic-orange
genetic-orangeβ€’455d ago
if i'am to understand you correctly: on google cloud when creating OAuth client id i put 2 URI's in both authorized javascript origins and authorized redirect URI's. localhost:3000 localhost
metropolitan-bronze
metropolitan-bronzeβ€’455d ago
genetic-orange
genetic-orangeβ€’454d ago
ah okay, is this something that is required for me to do? getting access tokens and redirecting to google auth? when creating my project i chose "with google authentication" option both times. i thought all that i needed to provide was a client id for it to work, maybe i was mistaken. all i wanted was just for it to work so that i could try and edit some code and learn what's what.
metropolitan-bronze
metropolitan-bronzeβ€’454d ago
Hello @w4rz0r , as you said, you just need to pass client id for it to work on the refine side. Adding localhost to the allowed origins should happen on the Google cloud side.
genetic-orange
genetic-orangeβ€’453d ago
okay so when i tried to create my project, i went into google cloud as you said, and created a client ID.
No description
genetic-orange
genetic-orangeβ€’453d ago
i then went and added that client ID to a .env file in my project and named the variable REACT_APP_GOOGLE_CLIENT_ID. then tried to put that into the login.tsx file. have i done something incorrectly? as it's not working. i must have done something wrong.
No description
metropolitan-bronze
metropolitan-bronzeβ€’453d ago
Hey @w4rz0r you have https://localhost, it should be without s, just http://localhost
genetic-orange
genetic-orangeβ€’453d ago
wait... you're totally right. that's such a rookie mistake by my part. everything works now, thank you so so much. you fixed everything for me.
More Posts
Refine _ Compiled with problems:Hi, While compiling a refine code, I have the next error: TS2786: 'ReactApexChart' cannot be used Inferencer date inferring is too sensitiveHi πŸ™‚ Another issue I've encountered. I have a number field, that the Inferencer recognizes as a DatuseParams, useResource giving different results in different context.I tried to get the resourceName, actions, params by using one of this hook inside `react-router-v6` Inferencer disregards null-value fieldsHi there πŸ‘‹ So I'm making actual progress using the library with the modifications I've used to the Hi pinksheep 3388 can you give us `npmHi @sheepndreams, can you give us `npm run refine whoami` output for debug ?Inferencer - how to use a diferent identifer idHi, I want to use the Inferencer (MUI) to generate the views for my data. However, my data use theUse fieldTransformerHey😩 guys can some someone send me an example of how I can use fieldTransformer const handleTransfAuth Azure B2C with Next.jsI am trying to implement authentication with azure B2C with next, however in the doc there are some Preview Image on edit page loadHi ! how do in ensure that when I go to my edit page, it shows image on my Upload component ? When Change root background .Hello all first time on using refine and I love it . I’ m actually looking at changing the backgroShare variabel with different components.I have a component with a usestate hook - const [co2TotalSaving, setCo2TotalSaving] = useState(0),Change update patch urlHello !! i try to implement the updating password feature. I wrote the updatePasseword in the auth pcan I make a music player web application using refine in the hackathonCan I make any project in the hackathon using refine or do I need to make any of specified projects Show label changeIs there a way to change label on SHOW component ? I know there is a title option, but I specificallTutorial - Data provider - Axios versionHello, I am testing Refine and just going through the tutorial 3.xx.xx. I'm at the part 3.3 where weRemove Refine logo from the pagethe flower logo on the bottom right of the page, how do I remove that?Refine/Next/Mantine/Supabase - access to register/forgot password page not allowedWhile not logged in, the register/forgot password pages are not accessible. I get the unauthenticateredirect to update page on button clickHi everybody πŸ‘‹ I try to redirect to the update password page on button click but i can find how torefine-firebase: How to use it for auth & data storedCan you give me example to use the package refine-firebase to handle auth & CRUD on firestore. @rturonFinishHandler Error (Promise) useFormHi, I'm a newbie to refine currently stuck on a problem. on submitting data to make an API request f