guess-js / guess

🔮 Libraries & tools for enabling Machine Learning driven user-experiences on the web
https://guess-js.github.io/
MIT License
7.06k stars 202 forks source link

Can't perform authentication with guess-ga #328

Open slavoroi opened 4 years ago

slavoroi commented 4 years ago

1) I created a project in google console. 2) I created a private key with no restrictions 3) I opened a google analytics account 4) I added analytics.js and used angulartics2 for Angular (and the routes recordings worked) 5) Running :

  plugins: [
    new GuessPlugin({
      debug: true,
      GA: viewId,
      runtime: {
        delegate: false
      },
      routeProvider() {
        return parseRoutes('.');
      }
    })
  ]
};

Can't seem to pass this code in main.js:

 client = google_oauth2_node_1.auth({
                  clientId: clientId,
                  clientSecret: clientSecret,
                  scope: scope
              }).then(function (token) {

Opens a new chrome tab and clicking on my user get's me:

Sign in with Google temporarily disabled for this app This app has not been verified yet by Google in order to use Google Sign In.

Also when trying:

fetch({
  key,
  viewId,
  period: {
    startDate: new Date('2016-1-1'),
    endDate: new Date('2020-3-3')
  }
}).then(g => {
  writeFileSync('data.json', JSON.stringify(g, null, 2));
}).catch((err) => {
  console.log(err);
  throw err;
});

throws Login Required. I tried to give guess js read only permissions by email (mgechev@...) in google analytics but it didn't work.

versions: "guess-parser": "0.4.15", "guess-webpack": "0.4.15", "guess-ga": "0.4.14" Angular 8.2.14

kasperstorgaard commented 4 years ago

Dont know about the plugin, but for the second case (using fetch), the documentation is out of date.

What you really need is to generate a JWT auth client like so:

import {fetch} from 'guess-ga';
import {JWT} from 'google-auth-library'

import credentials from './credentials.json';

const auth = new JWT(
  credentials.client_email,
  null,
  credentials.private_key,
  ['https://www.googleapis.com/auth/analytics.readonly']
);

fetch({
  auth,
  viewId,
  period: {
    startDate: new Date('2019-10-01'),
    endDate: new Date('2020-2-01')
  }
})

https://github.com/googleapis/google-auth-library-nodejs#json-web-tokens

edit: changed the scope to analytics.readonly

slavoroi commented 4 years ago

Yeah! you'r right, except the relevant scope is: 'https://www.googleapis.com/auth/analytics.readonly' and not 'https://www.googleapis.com/auth/cloud-platform'. Thanks! The fetch works and the Docs should be updated.

The DOCS should also mention opening a new service account in google and giving it a view permission for google analytics api (and exporting it to a json) and connecting this email to google analytics api. The relevant key is not the API key but the key from the JSON which is created from the service account. And using guess plugin with guess ga still doens't work.

kasperstorgaard commented 4 years ago

ah cool, I was getting an issue with that scope too

mgechev commented 4 years ago

@kasperstorgaard thanks for pointing this out! Would you have a moment to fix the documentation?

kasperstorgaard commented 4 years ago

@mgechev I'll take a stab at it

slavoroi commented 4 years ago

Any update on the issue of using :

module.exports = {
  plugins: [
    new GuessPlugin({
      debug: true,
      GA: viewId,
      runtime: {
        delegate: false
      },
      routeProvider() {
        return parseRoutes('.');
      }
    })
  ]
};

Screenshot from 2020-02-11 12-21-58

mgechev commented 4 years ago

@slavoroi you can check the guide by @kasperstorgaard https://github.com/guess-js/guess/tree/master/packages/guess-ga#ga.

kasperstorgaard commented 4 years ago

@slavoroi update, so it turns out the jwt option was not meant for an auth client, just the credentials. (it then creates the JWT client on the inside)

const {GuessPlugin} = require('guess-webpack');
const {parseRoutes} = require('guess-parser');
const credentials = require('./credentials.json');
const viewId = '123456789';

module.exports = {
  plugins: [
    new GuessPlugin({
      debug: true,
      jwt: credentials,
      GA: viewId,
      routeProvider() {
        return parseRoutes('.');
      },
      // not sure what this does, I could make it work without it
      runtime: {
        delegate: false
      }
    })
  ]
};
slavoroi commented 4 years ago

Yap! it works :) Works amazing. Please update your guess-webpack docs and types.

mgechev commented 4 years ago

@slavoroi would you open a PR to update what's missing?

slavoroi commented 4 years ago

yap :+1: