Gridsome plugin-google-analytics tracking never show up on GA plateform - vue.js

I have an issue with plugin-google-analytics
https://github.com/gridsome/gridsome/blob/master/packages/plugin-google-analytics/README.md
when i put my Google Analytics tracking Id in gridsome.config.js it do nothing on Google Analytics plateform. Same after two days.
i upload all my files on server but never show up..
What i missed?
module.exports = {
siteName: 'massivemedias',
plugins: [
{
use: '#gridsome/plugin-google-analytics',
options: {
id: 'G-NNQ12FXXX' //my tracking id
}
}
]
}

That plugin you mentioned works with the Universal version of Google Analytics (which is what has the ids in the format UA-XXXXXXXXX-X), like the example in your link:
module.exports = {
plugins: [
{
use: '#gridsome/plugin-google-analytics',
options: {
id: 'UA-XXXXXXXXX-X' // <-- Universal Analytics tracking ID
}
}
]
}
The code you entered in the example, G-NNQ12FXXX, refers to the new Google Analytics 4 which, being a different system from the previous one and does not work (yet) with that plugin.
So I suggest you to create a Universal Analytics type Property and use its ID (UA-XXXXX-X) with the plugin you indicated. You can find it by clicking on Show advanced options (when you create a new property):

Related

How to configure gtm to track OrderPlacedEvent in SAP-Spartacus?

I am using Spartacus 4.2 and i am tracking a bunch of events via GTM.
I have configured gtm to track some custom and standard events but when i try to add the OrderPlacedEvent i get the following error:
Type 'TmsConfig' has no properties in common with type 'Config'
The import for OrderPlacedEvent looks like this:
import { OrderPlacedEvent } from '#spartacus/checkout/root';
GTM-Configuration:
provideConfig({
tagManager: {
gtm: {
dynamicConfiguration: true,
// TODO: Add events for tracking here
events: [
NavigationEvent,
OrderPlacedEvent,
//... (custom Events)
],
debug: true,
},
},
} as TmsConfig),
Does anybody know what im doing wrong?
I've faced a similar problem. The reason was that some feature module was referenced before the #spartacus/core and it messed up the Config type augmentation.
You need to check if some feature module doesn't get imported before #spartacus/core. For instance in app.module.ts.

Why do `/_nuxt/static/... ` page paths appear on Google Analytics? (Nuxt.js + GA4 + vue-gtag)

I'm using Google Analytics (GA4) with a Nuxt.js static site hosted on Netlify. The GA tracking is done with vue-gtag.
It has been working fine for a couple months, but the other day, I noticed an unusually high influx of New User and Session traffic specifically to some of my page paths prefixed with /_nuxt/static/XXXXXXXXXX/... (X denotes some digits). They have "(not set)" Locations, zero Screen Views and zero Average Engagement Times, unlike other legitimate page paths and traffic stats I'm seeing, so I am assuming that they are bots of some sort... but I have no idea where from. Why would particular pages in the static folder get hit like that? And how could they be exposed in the first place?
I'm quite new to all this so I tried researching more about Nuxt static sites, the static folder, and static site generators like Netlify... but I'm not finding anything specifically about these hits showing up on Google Analytics.
I'd appreciate if anyone would be kind enough to explain all this to me!
EDIT - re: kissu's comment on how I've enabled vue-gtag:
I made a Nuxt plugin I've called googleAnalytics.js with the following code:
import Vue from "vue";
import VueGtag from "vue-gtag";
export default ({ app }) => {
// get browser's hostname to check for localhost
let host = window.location.hostname;
// only run the Google Analytics code thru vue-gtag if hostname is not localhost
if (host != "localhost") {
Vue.use(
VueGtag,
{
config: { id: "G-XXXXXXXXXX" },
appName: "SomeName",
pageTrackerScreenviewEnabled: true
},
// pass application router to vue-gtag so that it associates tracking information with the specific page in view
// code from: https://www.carlcassar.com/articles/add-google-analytics-to-a-nuxt-js-app/
app.router
);
}
};
And then in my nuxt.config.js I set it to client-only:
plugins: [
{
src: "./plugins/googleAnalytics.js",
mode: "client"
},
That's all I've done with respect to the GA tracking. Are there are any other config options I should be using?
I'm on Nuxt v2.15.3 and vue-gtag v1.14.0.

URL prefix to process.env

I am developing a new platform website, which should allow to easily make new websites using a headless CMS (Strapi).
For the front part, I am using vuejs with nuxtjs, and for the api, using Strapi: the data is stored in a database.
-> Each company has its own database.
-> The front part is the same for all companies
Only the database need to be changed to switch from one company to another.
For now, I only need to change .env file (in the api project) with DATABASE_NAME=companyA to DATABASE_NAME=companyB to swicth from a website to another one.
Here is database.json file:
"database":"${process.env.DATABASE_NAME||'companyA'}"
But I would like to get this url prefix in the frontend url (example:)
http://127.0.0.1/companya/....
http://127.0.0.1/companyb/....
To be able to send it to the api url prefix as well maybe) and know which database I should use.
Could you please tell me if you have an idea on how this could work? I could share my code but i think it's more of a theoric question I have now...
With VueRouter
you can set a path like:
const routes = [
{ path: '/companya', name: 'companya', component: MyPage },
{ path: '/companyb', name: 'companyb', component: MyPage },
];
then in MyPage.vue you can look at the current route:
created () {
switch (this.$route.name) {
case 'companyA':
// switch connection
break;
case 'companyB':
// switch connection
break;
}
},

When providing pregenerated links for supporting multiple API specs Swagger UI doesn't load the specs

I have a service written in Go that also uses go templates for frontend. This service is used by our external third parties as a portal for looking up stuff and searching. There is another service that is a rest API for handling orders. The portal service has a page where you can look up API docs.
I had only one API version and I use SwaggerUI for showing API docs. I had to create a new endpoint and make it a part of a new API version. Now I want to show a new API version but also the old one for supporting old clients. Something like this:
So when a user clicks a button on the portal website to see documentation, the request is handled by this function in portal (Note: I already refactored this function to support multiple urls):
func getDocs(c echo.Context) error {
source := c.Get(auth.SourceName).(string)
key := c.Get(auth.KeyName).(string)
jsonURLs := []DocsURL{
{
url: fmt.Sprintf("%s/0.1/docs?source=%s", config.baseURL, key),
name: "0.1"
},
{
url: fmt.Sprintf("%s/1.0/docs?source=%s", config.baseURL, key),
name: "0.1"
},
}
return c.Render(http.StatusOK, "docs/index", map[string]interface{}{
"source": source,
"key": key,
"pageType": "docs",
"jsonURLs": jsonURLs,
})
}
And this is the script from the template where I use SwaggerUI:
window.onload = function() {
const ui = SwaggerUIBundle({
urls: {{ .jsonURLs }},
dom_id: '#swagger-ui',
deepLinking: true,
presets: [
SwaggerUIBundle.presets.apis,
SwaggerUIStandalonePreset
],
plugins: [
SwaggerUIBundle.plugins.DownloadUrl
],
layout: "StandaloneLayout",
supportedSubmitMethods: []
})
window.ui = ui
$('.tryitout').prop('disabled', true);
}
I need to generate links depending on the environment (production, staging, local). Also it makes sense to generate data on the backend and feed it to the template to display. BUT THIS DOENS'T WORK!
However, if I hard-code the links in the SwaggerUIBundle it works and portal shows a correct drop-down menu and allows to switch between versions and loads docs for the corresponding version.
func getDocs(c echo.Context) error {
source := c.Get(auth.SourceName).(string)
key := c.Get(auth.KeyName).(string)
return c.Render(http.StatusOK, "docs/index", map[string]interface{}{
"source": source,
"key": key,
"pageType": "docs",
})
}
In the template:
window.onload = function() {
const ui = SwaggerUIBundle({
urls: [
{
url: "http://localhost:8088/0.1/docs?source=111111",
name: "0.1"
},
{
url: "http://localhost:8088/1.0/docs?source=111111",
name: "1.0"
}
],
dom_id: '#swagger-ui',
deepLinking: true,
presets: [
SwaggerUIBundle.presets.apis,
SwaggerUIStandalonePreset
],
plugins: [
SwaggerUIBundle.plugins.DownloadUrl
],
layout: "StandaloneLayout",
supportedSubmitMethods: []
})
window.ui = ui
$('.tryitout').prop('disabled', true);
}
Why is that? And is there a way to make the first version of code work?
I need the links to be dynamic and preferably generated in the handler. Thank you!
There appear to be two mistakes:
First:
urls: {{ .jsonURLs }},
This will not write jsonURLs in JSON format for you. It will simply write a string representation of jsonURLs. Either you need to write the template to iterate elements of jsonURLs and print them out one by one, or marshal jsonURLs to json yourself:
jsonText,_:=json.Marshal(jsonURLs)
return c.Render(http.StatusOK, "docs/index", map[string]interface{}{
"source": source,
"key": key,
"pageType": "docs",
"jsonURLs": string(jsonText),
})
Second: it looks like you didn't export the member fields of DocsURL struct. Capitalize the field names and add json tags.
type DocsURL struct {
URL string `json:"url"`
Name string `json:"name"`
}

Agile Central Basic App Settings

I'm implementing a simple app based on the UserIterationCapacity using a Rally.app.TimeboxScopedApp.
Now I want to specify a couple of settings as App settings and found the developer tutorial for this: https://help.rallydev.com/apps/2.1/doc/#!/guide/settings
But I just cant get it working. Whenever I try to fetch a setting my code stops without any warnings.
I've implemented the following:
config: {
defaultSettings: {
hoursPerSp: 6,
decimalsOnHoursPerSp: 1
}
},
getSettingsFields: function() {
return [
{
name: 'hoursPerSp',
xtype: 'rallynumberfield'
},
{
name: 'decimalsOnHoursPerSp',
xtype: 'rallynumberfield'
}
];
},
Now I'm trying to use
this.getSettings('hoursPerSp');
but unfortunately it is not working.
Thank you in advance
Problem solved.
I needed to keep track of my scope, i.e., I needed to pass in the this variable to my renders.