Google oAuth Angular service

Question

I wrote a module with 3 services that execute the oauth (and set the api key) for the google api and return the token object if the promise is positive.

Here is the whole working module:

angular.module('gapiOAuth', [])
.controller('gapiOAuthController', ['$scope', function($scope){ 
}])
.factory('gapiCredentialsSrvc', function(){ 
 return {
 gapiClientId: 'xxx',
 gapiScopeUrl: ['https://www.googleapis.com/auth/userinfo.email','https://www.googleapis.com/auth/blogger'],
 gapiKey: 'xxx'
 }
})
.factory('gapiGetTokenSrvc', ['$q','gapiCredentialsSrvc', function($q, gapiCredentialsSrvc){ 
 return function (){
 var q = $q.defer();
 angular.element(document).ready(function(){
 gapi.auth.authorize({client_id: gapiCredentialsSrvc.gapiClientId, scope: gapiCredentialsSrvc.gapiScopeUrl, immediate: true}, function(response){
 if(response && !response.error){
 q.resolve(response); 
 } else {
 q.reject({}); 
 }
 });
 });
 return q.promise;
 };
}])
.factory('gapiLogInSrvc',['$q','gapiCredentialsSrvc', function($q, gapiCredentialsSrvc){ 
 return function(){
 var q = $q.defer();
 angular.element(document).ready(function(){
 gapi.auth.authorize({client_id: gapiCredentialsSrvc.gapiClientId, scope: gapiCredentialsSrvc.gapiScopeUrl, immediate: false}, function(response){
 if(response && !response.error){
 q.resolve(response);
 }else{
 q.reject(response.error);
 }
 });
 });
 return q.promise;
 };
}])
.factory('gapiSetApiKeySrvc',['gapiCredentialsSrvc', function(gapiCredentialsSrvc){ 
 return function(){ 
 angular.element(document).ready(function(){
 gapi.client.setApiKey(gapiCredentialsSrvc.gapiKey);
 return true;
 });
 };
}])

Do you think there will be security issues if I put this code I made onto the client side?

How can I improve it?

Answer 1

Do you think there will be security issues if I put this code I made onto the client side?

Yes. You should not expose your Google API key to other users - it should be hidden away on your server. You should expose an end point on an API server that will run the Google OAuth actions. This is known as the three-legged or server-side OAuth flow.

The security reasons mainly come down to the fact that if someone knows your API key then they can masquerade as you. This is usually solved by a shared secret (or just a private key), but the Google OAuth flow doesn't appear to provide this.

You can see here for Google's own resource on best practises for API keys.

• J. Doe: Isn't sufficient the domain context in which the api key is able to makes api requests?
• Dan: @J.Doe sorry, I'm not sure what you are saying, could you clarify?
• J. Doe: G let you link an internet domain to the apikey so that the gapi is allowed only if called from that specific domain.
• Dan: For OAuth, yes. For other requests? No. Also, that still leaves you vulnerable to CSRF attacks. It's a very insecure approach and all it saves you really is laziness.
• J. Doe: Right. Maybe later I'll make some research about this server side oauth flow. Where do you think I should start, the easiest way?