ambitious-aqua•14mo ago

[GSI_LOGGER]: The given origin is not allowed for the given client ID.

Hi i just created my first project with refine. I use google Auth 2.0 but when i start the app yarn dev I have this error on the console: [GSI_LOGGER]: The given origin is not allowed for the given client ID. I dont understand why cuz i have the right configuration on google javascript origins, and i replaced the client ID in the login.tsx file. any idea ? btw it works well with localhost, but my app always lunch with 127.0.0.1 ip address thank you

10 Replies

kapa.ai•14mo ago

Hi @justhugo. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- The error message you're seeing suggests that the origin (the URL where your app is hosted) is not allowed for the given client ID. This is a common issue when setting up OAuth applications, like Google Auth 2.0. In the Google Auth example (https://refine.dev/docs/examples/auth-provider/google-auth) from the refine documentation, it's mentioned that it's important to add the URLs of both your deployed application and your local development to the list of allowed origins in the OAuth app settings. If you fail to do so, it can cause the app to fail. Given that your app works well with localhost but not with the IP address 127.0.0.1, it's possible that you've added localhost to the list of allowed origins, but not 127.0.0.1. Even though they both point to your local machine, they are treated as different origins by the browser and the OAuth service. To resolve this issue, you should add 127.0.0.1 to the list of allowed origins in your Google OAuth app settings. If you're still having trouble after doing this, it might be helpful to double-check your client ID and make sure it's correctly set in your login.tsx file. If you need more detailed guidance, you might find this video tutorial (https://www.youtube.com/watch?v=HtJKUQXmtok) helpful. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•14mo ago

<@122807566475591680> kapa.ai is still learning and improving, please let us how it did by reacting below

ambitious-aqua•14mo ago

Nope still not working @kapa.ai how can i change my local host app from 127.0.0.1 to localhost

kapa.ai•14mo ago

Let me check the knowledge base for you. One moment! :books: ---------------------- The URL your app uses when you start it (either localhost or 127.0.0.1) is typically determined by the development server's configuration. In the case of a refine app, this is likely handled by the underlying React development server or another tool like Vite or Webpack. Unfortunately, the provided extracts do not contain specific instructions on how to change this setting for a refine app. However, in general, you might be able to change this by modifying a configuration file or setting an environment variable. For example, if your project was created with Create React App, you could add a .env file to the root of your project with the following line:

HOST=localhost

HOST=localhost

This tells the development server to use localhost instead of 127.0.0.1. Note that this might not work if your project was not created with Create React App or if it uses a different development server. If you're still having trouble, I would recommend checking the documentation for the tool you're using to start your app, or reaching out to the refine community for more specific guidance. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•14mo ago

<@122807566475591680> kapa.ai is still learning and improving, please let us how it did by reacting below

ambitious-aqua•14mo ago

@kapa.ai i'm using vite.js how can i change host

kapa.ai•14mo ago

Let me check the knowledge base for you. One moment! :books: ---------------------- If you're using Vite.js, you can change the host by modifying the vite.config.js file in your project root directory. If the file doesn't exist, you can create it. Here's how you can set the host to localhost:

// vite.config.js
export default {
  server: {
    host: 'localhost'
  }
}

// vite.config.js
export default {
  server: {
    host: 'localhost'
  }
}

After saving the file, you can start your development server again with npm run dev or yarn dev, and it should now use localhost instead of 127.0.0.1. Please note that this information is based on general knowledge about Vite.js and not directly extracted from the provided sources. For more detailed information, you can refer to the Vite.js documentation (https://vitejs.dev/config/#server-host). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•14mo ago

<@122807566475591680> kapa.ai is still learning and improving, please let us how it did by reacting below

genetic-orange•13mo ago

it should work 🤔 our examples works when we set like this. i'm sorry but i could not debug more unless I have a google dashboard. i suggest you too double check google documentation

ambitious-aqua•13mo ago

it's okay i will use another method, thank you