Google OAuth 2.0 redirect_uri with several parameters

Question

How to add a parameters to the Google OAuth 2.0 redirect_uri?

Just like this:

redirect_uri=http://www.example.com/redirect.html?a=b

The b of a=b is random.

Anyone can help ?

Answer 1

1. You cannot add anything to the redirect uri, redirect uri is constant as set in the app settings of Oauth. eg :http://www.example.com/redirect.html

2. To pass several parameters to your redirect uri, have them stored in state parameter before calling Oauth url, the url after authorization will send the same parameters to your redirect uri as state=THE_STATE_PARAMETERS

So for your case,do this:

/1. create a json string of your parameters ->

{ "a" : "b" , "c" : 1 }

/2. do a base64UrlEncode , to make it URL safe ->

stateString = base64UrlEncode('{ "a" : "b" , "c" : 1 }');

This is a PHP example of base64UrlEncoding & decoding (http://en.wikipedia.org/wiki/Base64#URL_applications) :

function base64UrlEncode($inputStr)
{
    return strtr(base64_encode($inputStr), '+/=', '-_,');
}

function base64UrlDecode($inputStr)
{
    return base64_decode(strtr($inputStr, '-_,', '+/='));
}

So now state would be something like: stateString -> asawerwerwfgsg,

Pass this state in OAuth authorization URL:

https://accounts.google.com/o/oauth2/auth?
  client_id=21302922996.apps.googleusercontent.com&
  redirect_uri=https://www.example.com/back&
  scope=https://www.google.com/m8/feeds/&
  response_type=token&
  state=asdafwswdwefwsdg,

For server side flow it will come along with token : http://www.example.com/redirect.html?token=sdfwerwqerqwer&state=asdafwswdwefwsdg,

For client side flow it will come in the hash along with access token: http://www.example.com/redirect.html#access_token=portyefghsdfgdfgsdgd&state=asdafwswdwefwsdg,

Retrieve the state, base64UrlDecode it, json_decode it, and you have your data.

See more about google OAuth 2 here:

http://code.google.com/apis/accounts/docs/OAuth2.html

Answer 2

Since the accepted answer does expose the actual data and misuses the state parameter instead of sticking to a nonce to protect against CSRF, I'll try to show a proper method. Rather than passing (read exposing) data it should be kept local. Hydrate it before the request and re-hydrate it after a validated request. "Validated" here means that the state-nonce of request and response match.

You need some kind of temporary client side storage. E.g. for SPA or general websites keep it in state or use the browser's localStorage, a session (or a signed cookie). For mobile apps they should use memory or any other local storage.

Before sending the request generate a nonce (see below) that will be used as state parameter for the request. Store the nonce together with the custom state (e.g. a json) in local storage.

For example, the nonce could be ih4f984hf and the custom state {"role": "customer"}. Then you could store data for re-hydration for that request like this:

"ih4f984hf": {
  "role": "customer"
}

Then use only the nonce as value for the state parameter of the request. (If you absolutely want to combine the nonce and data into the state value be sure to encrypt it and be aware that the length of the value is limited!)

When receiving a response you get the value of the state parameter back. Look it up and if it matches the value in the local storage you may process the data using the stored state. If the nonces do not match the request is potentially from an attacker and should not be processed.

Generating the nonce

Remember that the nature of a nonce is that it is used once only and must be unpredictable! Unpredictable here means ideally random, but practically pseudo-random is ok if the entropry is high enough - in web apps you might want to check Web API Crypto which is supported pretty well.

For further readings this might be helpful:

• http://www.thread-safe.com/2014/05/the-correct-use-of-state-parameter-in.html
• https://datatracker.ietf.org/doc/html/draft-bradley-oauth-jwt-encoded-state-00
• https://auth0.com/docs/protocols/state-parameters#set-and-compare-state-parameter-values

Answer 3

If you are in .NET you could save the parameters in the Session

HttpContext.Current.Session[{varname}]

and redirect to the authorization page without parameters

Response.Redirect(your_uri_approved_with_no_querystring_parameters);

Answer 4

In Javascript (Node), you could set the state property to an object of key value pairs.

           const oAuth2Client = await new google.auth.OAuth2(
                clientId: <clientId>,
                clientSecret: <clientSecret>,
                redirectUrl: <redirectUrl>,
            );

            return await oAuth2Client.generateAuthUrl({
                access_type: "offline",
                scope: <scopes>,
                state: JSON.stringify({ a: "y", b: "z" }),
            });

On google authorization complete, it returns of the state, code etc from ulr,

const params = JSON.parse(state); // { a: "y", b: "z" }

Answer 5

You can redirect parameter with url as below,

When you get response from google than you can pass parameter with url,

See below php code for same,

if (isset($_GET['code'])) {
   $client->authenticate();
   $_SESSION['token'] = $client->getAccessToken();
   $redirect = 'http://' . $_SERVER['HTTP_HOST'] . $_SERVER['PHP_SELF'];
   header('Location: ' . filter_var($redirect, FILTER_SANITIZE_URL) . '?r=page/view');

}

In above example r=page/view is parameter on which i want the response with parameter