Vue.js Vue分析不起作用(注意:我需要根据主机名更改id)

Vue.js Vue分析不起作用(注意:我需要根据主机名更改id),vue.js,google-analytics,vuejs2,vue-router,Vue.js,Google Analytics,Vuejs2,Vue Router,我正在尝试使用vue分析,但没有收到任何数据(在localhost中尝试时除外) 我们的情况是独一无二的,因为每个客户都有不同的领域。因此,Google Analytics id应该根据主机名而改变 我已将id设置为根据window.location.hostname进行更改,但它似乎仍然不起作用 你能告诉我哪里出了问题吗 谢谢 斯隆 p、 下面是美国代码 import Vue from 'vue'; import VueSession from 'vue-session'; import st

我正在尝试使用vue分析,但没有收到任何数据(在localhost中尝试时除外)

我们的情况是独一无二的,因为每个客户都有不同的领域。因此,Google Analytics id应该根据主机名而改变

我已将id设置为根据window.location.hostname进行更改,但它似乎仍然不起作用

你能告诉我哪里出了问题吗

谢谢

斯隆

p、 下面是美国代码

import Vue from 'vue';
import VueSession from 'vue-session';
import stitcher from './components/stitcher.vue';
import * as auth from '@companyname/auth';
import * as dashboard from '@companyname/dashboard';
// import * as lgc from '@companyname/final-lgc';
import * as tasking from '@companyname/tasking';
import * as help from '@companyname/help';
import Router from 'vue-router';
import notFound from './components/notFound.vue';
import terms from './components/Terms.vue';
import privacy from './components/Privacy.vue';
import permissionDenied from './components/permissionDenied.vue';
import Vuetify from 'vuetify';
import * as GoogleMaps from 'vue2-google-maps';
import {get} from 'lodash';
import {ready} from '@companyname/interservice';
import VueAnalytics from 'vue-analytics'

import VueQuillEditor from 'vue-quill-editor';
import 'vuetify/dist/vuetify.min.css';
import 'quill/dist/quill.core.css';
import 'quill/dist/quill.bubble.css';
import 'quill/dist/quill.snow.css';
import abilityPlugin from './config/ability-plugin';
import abilities from './config/abilities';

window.vueGoogleMapsInit();
Vue.use(GoogleMaps, {
  load: {
    key: 'asdfasdfasdfasdfasdf',
    libraries: 'places'
  }
});

Vue.use(Router);
Vue.use(VueSession);
Vue.use(VueQuillEditor);
Vue.use(Vuetify);
Vue.use(abilityPlugin, abilities);

const router = new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'dashboard',
      component: dashboard.app,
      meta: { requiresAuth: true },
      children: dashboard.routes()
    },
    {
      path: '/auth',
      component: auth.app,
      children: auth.routerConfig(),
      meta: {featureName: 'auth'}
    },
    /*
    {
      path: '/lgc',
      name: 'lgc',
      component: lgc.app,
      meta: {requiresAuth: true, featureFlag: {feature: 'lgc', description: 'LGC'}}
    },
    */
    {
      path: '/tasking',
      component: tasking.app,
      meta: {requiresAuth: true, featureName: 'tasking'},
      children: tasking.routes()
    },
    {
      path: '/assignment/task/:taskId',
      redirect: to => '/tasking' + to.path,
      props: true
    },
    {
      path: '/answers/task/:taskId',
      redirect: to => '/tasking' + to.path
    },
    {
      path: '/help',
      name: 'help',
      component: help.app,
      children: help.routes()
    },
    {
      path: '/terms',
      name: 'terms',
      component: terms
    },
    {
      path: '/privacy',
      name: 'privacy',
      component: privacy
    },
    {
      path: '/permissiondenied',
      name: 'permissiondenied',
      component: permissionDenied
    },
    {
      path: '*',
      component: notFound
    }
  ]
});

router.beforeEach(async (to, from, next) => {
  if (to.matched.some(record => record.meta.requiresAuth)) {
    let redirectPath;
    const loggedIn = await ready;
    const user = loggedIn.user || null;
    const featureFlag = get(to, 'meta.featureFlag.feature');
    if (!loggedIn) {
      if (localStorage.loggedOut && localStorage.loggedOut === 'true') {
        redirectPath = '/';
      } else {
        redirectPath = to.fullPath;
      }
      localStorage.loggedOut = 'done';
      next({
        path: '/auth',
        query: { redirect: redirectPath }
      });
    } else if (featureFlag) {
      const allowed = get(user, `featureFlags.${featureFlag}`);
      const description = get(to, 'meta.featureFlag.description');
      const fullPath = to.fullPath;
      if (allowed) {
        next();
      } else {
        next({
          path: '/permissiondenied',
          query: { description, fullPath }
        });
      }
    } else {
      next();
    }
  } else {
    next(); // make sure to always call next()!
  }
});

function getClientId(environment) {
  let uaId;
  switch (environment) {
    case 'customer1.companysite.com':
      uaId = 'UA‌-123456789-1';
      break;
    case 'customer2.companysite.com':
      uaId = 'UA‌-123456789-2';
      break;
    case 'customer3.companysite.com':
      uaId = 'UA‌-123456789-3';
      break;
    case 'customer4.companysite.com':
      uaId = 'UA‌-123456789-4';
      break;
    case 'customer5.companysite.com':
      uaId = 'UA‌-123456789-5';
      break;
    case 'customer6.companysite.com':
      uaId = 'UA‌-123456789-6';
      break;
    case 'customer7.companysite.com':
      uaId = 'UA‌-123456789-7';
      break;
    case 'customer8.companysite.com':
      uaId = 'UA‌-123456789-8';
      break;
    case 'localhost':
      uaId = 'UA-123456789-9';
      break;
    default:
      uaId = 'no_id';
      break;
  }
  console.log('id', uaId);
  return uaId;
}

let clientID = getClientId(window.location.hostname);

if (clientID !== 'no_id') {
  Vue.use(VueAnalytics, {
    id: clientID,
    router
  });
}

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  render: h => h(stitcher)
});

您是否有
console.log
在不同的位置记录
clientID
的值以确保其正确性?谢谢您的建议。实际上,我添加了调试器,并且能够看到id的格式不正确。现在可以了。谢谢