我需要将facebook像素代码放在Vuejs单页应用上。我也使用NUXT进行SSR。
答案 0 :(得分:1)
您可以在静态存储库中创建一个文件:pixel.js,其内容由facebook提供:
!function(f,b,e,v,n,t,s){
if(f.fbq)return
n=f.fbq=function(){n.callMethod?n.callMethod.apply(n,arguments):n.queue.push(arguments)}
if(!f._fbq)f._fbq=n
n.push=n
n.loaded=!0
n.version='2.0'
n.queue=[]
t=b.createElement(e)
t.async=!0
t.src=v
s=b.getElementsByTagName(e)[0]
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js')
fbq('init', 'XXYOUR CODEXX')
fbq('track', 'PageView')
(我没有完全基于javascrip使用带有Nuxt的noscript标签)
然后在nuxt.conf.js文件中添加以下行:
script:[
{src:'pixel.js', type: 'text/javascript'}
]
答案 1 :(得分:1)
您也可以导入为插件。
./ plugins / facebook-events.js。
/* eslint-disable */
export default ({ app, store }) => {
/*
** Only run on client-side and only in production mode
*/
// if (process.env.NODE_ENV !== "production") return
/*
** Initialize Facebook Pixel Script
*/
if (process.browser) {
!(function(f, b, e, v, n, t, s) {
if (f.fbq) return;
n = f.fbq = function() {
n.callMethod ? n.callMethod.apply(n, arguments) : n.queue.push(arguments)
};
if (!f._fbq) f._fbq = n;
n.push = n;
n.loaded = !0;
n.version = "2.0";
n.queue = [];
t = b.createElement(e);
t.async = !0;
t.src = v;
s = b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t, s);
})(
window,
document,
'script',
'https://connect.facebook.net/en_US/fbevents.js'
);
fbq('init', 'XXXXXXXXX-XXXXX')
app.router.afterEach((to, from) => {
/*
** Fire a page view on each route change
*/
console.log("fire pageview", store.state)
fbq("track", "PageView")
})
}
}
并在插件会话中将其导入到您的nuxt.config.js中。
plugins: [
{ src: '~/plugins/facebook-events.js' }
]
答案 2 :(得分:0)
尝试删除<noscript>
标签。
请参见此处进行调试:https://stackoverflow.com/a/49202327/1483977 这里是一个错误:https://github.com/vuejs/vue/issues/9724
答案 3 :(得分:-1)
我可以像这样用作ssr:false。
plugins : [
// ssr: false to only include it on client-side
{ src : '~/plugins/vue-notifications', ssr : false },
{ src : '~/plugins/vue-slider-component', ssr : false },
{ src : '~/plugins/network', ssr : false },
{ src : '~/plugins/web3js', ssr : false },
// {src: '~/plugins/irisws', ssr: false},
// { src : '~/plugins/iomqtt', ssr : false }
],