Trying to understand the use for "Javascript Origins" when creating a Web Client ID

[Ben Finkel]

When you create a Google API credential for a web app, you indicate allowed Javascript Origins which is just a list of URIs. I'm trying to understand what the purpose of these is.

Does this restriction mean any code using my Client ID to access Public Google APIs must originate from those sources?  That doesn't seem helpful for two reasons:

1)  The first thing I do is add "http://localhost:8080" so I can run code from my development environment but of course every computer self identifies as "localhost" so I've effectively negated any security from it.

1. 2)  The Client ID is public knowledge (It's in my JS files which are delivered to client devices) and spoofing the origin would be trivial for a malicious actor.

2. Is it just meant as a small hurdle for malicious code to get around and nothing more?

Thanks in advance!

[Adam (Cloud Platform Support)]

The browser is in charge of setting the 'Origin' header and this would never be set to 'localhost' unless your browser is talking to the local machine. But you are right about the spoofing part in that malicious code outside the browser could technically set the origin to anything it wants. The purpose of the JavaScript origin is to allow access control via CORS which is the method of safely allowing cross-origin requests as related to the same-origin policy, but it is ultimately up to the browser to enforce this. There's a good answer about how 'CORS is not security' on Stack Overflow.

JavaScript does present the problem that the Client ID can be accessed in code but does make it more difficult for an attacker to use when combined with the allowed JavaScript origins above. There's another good question on Stack Overflow which discusses this here. 

So yes, outside of the browser the security model is not infallible in the case of OAuth with pure JavaScript.

[Ben Finkel]

Hey Adam, thanks for the reply!

So I understand CORS (at least at a high level) and I did read those posts from SO.  

I suppose my question is where these URLs enter the process.  When I make a call to a Google API (say, calendarList.list) I have to pass in the client ID I've created, and Google API will return those URIs to my browser as allowed origins?  I do use localhost quite a bit during development as well, since I often run my dev server right from my local machine.

Thanks again,

-Ben

[Adam (Cloud Platform Support)]

This is all standard CORS stuff and there isn't anything Google-specific going on with respect to the Allowed JavaScript Origins. The browser will set the 'Origin' header to the serving domain, usually in the preflight request. The server may respond with an 'Access-Control-Allow-Origin' header but only if the cross-origin request was accepted (otherwise it would be trivial to retrieve the list of allowed origins from the server).