0

I'm curious if anyone else has encountered this issue.

I am building an application that will authenticate users using Google 0Auth 2.0 + OpenID. I've built a simple site just with HTML and CSS to hold the UI and I'm using live server in Vscode to view it.

In The Google developer console for oauth, you must set Authorised JavaScript origins for client-side applications. I assumed I would just set this to http://localhost:5500 for the port that live server uses but I always get the following error:

Authorization Error Error 400: invalid_request Permission denied to generate login hint for target domain.

I have got around the issue by just getting a domain and hosting for a test site and setting this as the "Authorised JavaScript origin". However is seems really clunky and I have to FTP all my files to my hosting provider every time I want to change my code.

I could also host everything on a Node.js server from my local machine but this would just cause the same issue as before.

My question isn't so much how to stop getting this error but what is the proper way of developing with OAuth 2.0 and is there any way to speed up the process/create a local environment that doesn't get the same errors.

Thanks for your help.

DBucks
  • 13
  • 2
  • for local environment ... point your domain to your public home IP (i.e. not the 192.168.x, or 10.x etc "private" IP's that are common in home situations, you have a public IP address in this scenario) ... use a dynamic DNS service if your public home IP is not static - also, hope your internet provider doesn't use CGNAT - then none of this will help - unless you go IPv6 – Bravo Aug 17 '21 at 04:12
  • also, see if "google developer" as something like a development option where you can avoid all this complication – Bravo Aug 17 '21 at 04:23

1 Answers1

0

There is an answer to this Google question here that may help you.

The way I have always set up an OAuth environment is to try to avoid localhost and use more real world URLs on a Developer PC. I also like to split them like this which helps me to visualize the architecture:

Base URL Represents
http://www.example.com - Your web UIs
http://api.ecample.com Your APIs
http://login.example.com The Authorization Server

This approach can also give you more confidence that your code will work well in beowsers, in areas such as these:

  • CORS
  • Cookies
  • Content Security Policy

By default you just need to edit your hosts file and add an entry like this. It can work very well for demos to business people also.

127.0.0.1 localhost www.example.com api.example.com login.example.com
:1        localhost

ADVANCED SCENARIOS

At Curity we provide some quite advanced developer setups and this approach scales well, as in the below articles. The second of these also provides a script you can use to run locally over SSL, in case this is ever useful:

Gary Archer
  • 22,534
  • 2
  • 12
  • 24