VertinGo Tech — Coulisses, tutoriels & outils dev

Tutoriel intégration de Google Analytics!(Le PDF =>

)

Configuration pour la connexion à Google Analytics:

Create a service account on the Google Cloud Console by going to the following link:
Google Cloud Console

Select your corresponding project in the Google Cloud Console:

Create a service account by clicking on the plus button above:

Name your service account:

Download your key in JSON format and place it in a folder named KeyFile in your project:

Once the service account is created, you can click the Generate New JSON Key button to create and download the key and add it to your project. The service account you created in the previous step has an email address that you can add to any of the Google Analytics views you'd like to request data from. It's generally best to only grant the service account read-only access. More illustrations below!

First create a property and copy/paste the follow code in the header section of your site:

Then create a view and memorize the id of your view you will have to paste it in the HTML code which render statistics graphics:

To finish grant user rights to read and analyse in your view by adding a user with the email contained in your JSON key file:

Below how to recover your token in two differents ways:
First install the following dependency with Anaconda CLI!

pip install --upgrade oauth2client

Execute the following file with the command: python service-account.py

service-account.py

from oauth2client.service_account import ServiceAccountCredentials

The scope for the OAuth2 request.
SCOPE = 'https://www.googleapis.com/auth/analytics.readonly'

The location of the key file with the key data.
KEY_FILEPATH = 'path/to/json-key.json'

Defines a method to get an access token from the ServiceAccount object.
def get_access_token():
return ServiceAccountCredentials.from_json_keyfile_name(
KEY_FILEPATH, SCOPE).get_access_token().access_token

token = get_access_token()

print (token)

Above it is one way to recover your Token but below the way i recommend in my program is to used the getService() fonction which recover the latest token each time we reactualise the page:
(Don't forget as well to specify the path to your keyfile.json recover on Google Cloud Console)

private function getService()
    {
        $key_file_location = $this->getParameter('kernel.root_dir').'/../src/AppBundle/Keyfile/topsite-admin-symfony-1219cee3cde9.json';

        if (file_exists($key_file_location)) 
        {
            $serviceAccount = new ServiceAccountCredentials(Google_Service_Analytics::ANALYTICS_READONLY, $key_file_location);
            $serviceAccount->fetchAuthToken();

            return $serviceAccount->getLastReceivedToken();
        }

                return null;
    }

Place the following code between body tag in your HTML page:

                                            
<script>
(function(w,d,s,g,js,fs){
g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(f){this.q.push(f);}};
js=d.createElement(s);fs=d.getElementsByTagName(s)[0];
js.src='https://apis.google.com/js/platform.js';
fs.parentNode.insertBefore(js,fs);js.onload=function(){g.load('analytics');};
}(window,document,'script'));
</script>

The balise below will render the graphics statistics about your website like illustrating just below:

                                            
<div id="chart-1-container"></div>
<div id="chart-2-container"></div>

Place the following code between body tag in your HTML page:

                                            
<script>
gapi.analytics.ready(function() {
   
/**
* Authorize the user with an access token obtained server side.
*/
gapi.analytics.auth.authorize({
'serverAuth': {
'access_token': '{{ ACCESS_TOKEN_FROM_SERVICE_ACCOUNT }}'
}
});

/**
* Creates a new DataChart instance showing sessions over the past 0 days.
* It will be rendered inside an element with the id 'chart-1-container'.
*/
var dataChart1 = new gapi.analytics.googleCharts.DataChart({
query: {
        'ids': 'ga:100367422', // <-- Replace with the ids value for your view.
        'start-date': '0daysAgo',
        'end-date': 'yesterday',
        'metrics': 'ga:sessions,ga:users',
        'dimensions': 'ga:date'
        },
        chart: {
        'container': 'chart-1-container',
        'type': 'LINE',
        'options': {
        'width': '100%'
        }
    }
    });
    dataChart1.execute();

/**
* Creates a new DataChart instance showing top 5 most popular demos/tools
* amongst returning users only.
* It will be rendered inside an element with the id 'chart-3-container'.
*/
var dataChart2 = new gapi.analytics.googleCharts.DataChart({
query: {
        'ids': 'ga:100367422', // <-- Replace with the ids value for your view.
        'start-date': '0daysAgo',
        'end-date': 'yesterday',
        'metrics': 'ga:pageviews',
        'dimensions': 'ga:pagePathLevel1',
        'sort': '-ga:pageviews',
        'filters': 'ga:pagePathLevel1!=/',
        'max-results': 7
        },
        chart: {
        'container': 'chart-2-container',
        'type': 'PIE',
        'options': {
        'width': '100%',
        'pieHole': 4/9,
            }
        }
    });
    dataChart2.execute();
    });
</script>

L'actualité Vertin Go Website!

Le tuto en Pdf(

)