embed GA chart to 3rd party website

749 views
Skip to first unread message

Geoff Dutch

unread,
Jul 25, 2015, 9:10:22 AM7/25/15
to Google Analytics Reporting API
I've been digging around today, looking to implement what i had thought was something quite common and simple : An embedded Google Analytics chart into an html page for public consumption.

I created an web app and service account OAuth client IDs and Public API access key, and found the code of 'Embed API Demo', but my current knowledge to pull the lot together is evidently lacking. Any tips/guidance/direction to achieve target would be greatly appreciated!

chris@shufflepoint

unread,
Jul 25, 2015, 11:35:59 PM7/25/15
to Google Analytics Reporting API, 77o...@gmail.com
Best to show what you tried, and what errors/issues you faced.

Geoff Dutch

unread,
Jul 27, 2015, 10:18:58 AM7/27/15
to Google Analytics Reporting API, 77o...@gmail.com
I have the Embed API Demo and my 'Client ID for web application' for the Analytics API (with JavaScript origins including the domain hosting the Demo file). When i browse to my demo page, i can choose account, properties and views, and the graph reloads, all as expected.  When i open that page in incognito browser, I am presented an "Access Google Analytics' button, and upon clicking a dialogue box opens inviting me to 'Sign in with your Google Account'.

(1) I would like to run the demo page 'anonymously' without using the already logged in Google account, or prompting to sign in, just to open the graph without any authentication. (2) I would like, also, to pre-filter the graph to a specific view and remove the option(s) to change account, property or view, which I seem to achieved with the example shown here 

So, I created a 'Service account' for for the Analytics API, added that email address as Read & Analyse access for the view, and used the service account Client ID in the Embed API Demo, but, receive 'Error: invalid_client'.

As you may tell, first dabble with this Google APIs, and i`m not really sure what i`m working with!

Chris Harrington

unread,
Jul 27, 2015, 10:33:04 AM7/27/15
to google-analytics...@googlegroups.com

--
You received this message because you are subscribed to a topic in the Google Groups "Google Analytics Reporting API" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-analytics-data-export-api/OKtDPW_ouYE/unsubscribe.
To unsubscribe from this group and all its topics, send an email to google-analytics-data-...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Matt

unread,
Jul 27, 2015, 12:42:28 PM7/27/15
to Google Analytics Reporting API, back...@gmail.com, back...@gmail.com
You should look at this open source demo:
It shows how you can use server-side authorization to display your Google Analytics data to users without granting them access to your Google Analytics account. 

The issue you are facing is that you are trying to share data from your account publicly. Thus you need to authorize an application, or in this case a service account, to have access to the data, and then with that access the data can be displayed publicly. The basic dashboard you linked to demonstrates how to build an application to display data for which the user already has access.

-Matt


Geoff Dutch

unread,
Jul 28, 2015, 5:40:53 AM7/28/15
to Google Analytics Reporting API, 77o...@gmail.com
Thank you for guidance so far! I`m closer, i`m sure, however, can't see the prize just yet !

Using Matt link I am stuck on part 3 'Use the JSON key data to request an access token' and having reviewed chris@shufflepoint link I beleive that I need to require_one of the google-api-php-client, so i can use 'OAuth 2.0 for Server to Server Applications'. I pulled the github files to my server, included code as follows :

<?php
require_once
'google-api-php-client-master/src/Google/autoload.php';

$client_email
= '{insert service account email}';
$private_key
= file_get_contents('{uploaded location fo p12}');
$scopes
= array('https://www.googleapis.com/auth/analytics');

$credentials
= new Google_Auth_AssertionCredentials(
    $client_email
,
    $scopes
,
    $private_key
);

$client
= new Google_Client();
$client
->setAssertionCredentials($credentials);
if ($client->getAuth()->isAccessTokenExpired()) {
  $client
->getAuth()->refreshTokenWithAssertion();
}
?>

I beleive what I need to do is put the access token into a variable, so i can use it in the dashboard code, and presumably that is then 'done', so, code get that token ?

Matthew Cohoon

unread,
Jul 28, 2015, 11:29:47 AM7/28/15
to Google Analytics Reporting API, 77o...@gmail.com
Make sure to store your p12 key file privately and securely. Do not check it in to a public repository or store it on a public server.

The link i sent you has a server side process that gets an access token. And then uses that access token to make the API requests.

When you add an access token to the source code of your page, your site's visitors could use that access token to run any query the service account could run. If your account contains sensitive information, considering adding the service account only to a specific view. You may also want to add a view filter to limit what data the service account can access.

With that said you should be able to add to your php code a call to: getAccessToken()

And with then assign that access token to variable in your client side code.
Good luck.

--

Geoff Dutch

unread,
Jul 29, 2015, 5:38:26 AM7/29/15
to Google Analytics Reporting API, mco...@google.com
1) Can you elaborate on storage of p12key, at the moment it is in a dev subfolder within website public_html, the same folder from which i`m running these Embed test code ?

2) The access token will be accessible by viewing the javascript ? And so, the token comes from a service account which has limited data ?

3) access token variable, i've used following and i do indeed get the 

$mytokenarray = json_decode($client->getAccessToken(), true);
$mytokenarray_token
= $mytokenarray['access_token'];
echo $mytokenarray_token
;

Matthew Cohoon

unread,
Jul 29, 2015, 10:17:02 AM7/29/15
to Geoff Dutch, Google Analytics Reporting API
Think of the p12 file as your account password. You need to "keep it secret, keep it safe" -Gandalf

You seem to be correctly using PHP to generate an access token from the p12 file, which looks good.

Then you can use that access token with the embed API:
  /**
   * Authorize the user with an access token obtained server side.
   */
  gapi.analytics.auth.authorize({
    'serverAuth': {
      'access_token': '{{ ACCESS_TOKEN_FROM_SERVICE_ACCOUNT }}'
    }
  });
-Matt
Reply all
Reply to author
Forward
0 new messages