如何在 Angular 5 (s-s-r with Universal) 中使用 Google Analytics 功能?
Posted
技术标签:
【中文标题】如何在 Angular 5 (s-s-r with Universal) 中使用 Google Analytics 功能?【英文标题】:How to use Google Analytics function in Angular 5 (s-s-r with Universal)? 【发布时间】:2018-06-24 12:00:58 【问题描述】:我正在尝试在我的 Angular 5 网站上实现谷歌分析功能。
但是这次讨论的指示:
Angular 4+ using Google Analytics
没有意义,因为在我的情况下,整个代码都在服务器端执行,而 ga 函数无法正常工作(因为它使用 DOM 元素)。
您能告诉我,在 s-s-r Angular 网站中使用 Google 分析的最佳做法是什么?
提前谢谢你!
【问题讨论】:
【参考方案1】:我找到了解决方案!只需制作两个版本的站点并使用 nginx 将机器人路由到 s-s-r 版本。 Nginx 配置:
server
listen 80;
server_name site.ru www.site.ru;
root /var/www/site.ru/dist/browser;
index index.html;
location /
try_files $uri @prerender;
location @prerender
#proxy_set_header X-Prerender-Token YOUR_TOKEN;
set $prerender 0;
if ($http_user_agent ~* ("Googlebot\/2.1|YandexBot|googlebot|yahoo|bingbot|baiduspider|yandex|yeti|yodaobot|gigabot|ia_archiver|facebookexternalhit|twitterbot|developers\.google\.com|spider|crawl|slurp|bot"))
set $prerender 1;
if ($args ~ "_escaped_fragment_")
set $prerender 1;
#if ($http_user_agent ~ "Prerender")
# set $prerender 0;
#
#if ($uri ~ "\.(js|css|xml|less|png|jpg|jpeg|gif|pdf|doc|txt|ico|rss|zip|mp3|rar|exe|wmv|doc|avi|ppt|mpg|mpeg|tif|wav|mov|psd|ai|xls|mp4|m4a|swf|dat|dmg|iso|flv|m4v|torrent|ttf|woff)")
# set $prerender 0;
#
#resolve using Google's DNS server to force DNS resolution and prevent caching of IPs
resolver 8.8.8.8;
if ($prerender = 1)
proxy_pass http://XX.XXX.XXX.XXX:4002;
if ($prerender = 0)
rewrite .* /index.html break;
【讨论】:
以上是关于如何在 Angular 5 (s-s-r with Universal) 中使用 Google Analytics 功能?的主要内容,如果未能解决你的问题,请参考以下文章
在 Firebase 上部署 Angular 8 Universal (s-s-r) 应用程序
Angular5服务器端渲染,外部Api数据服务在s-s-r中不起作用
next-with-apollo,s-s-r 不起作用,请求在客户端完成