使用Nginx反向代理解决 Google Analytics 访问问题

#极限操作 2023-01-13 11:19:00 | 全文 744 字,阅读约需 2 分钟 | 加载中... 次浏览

👋 相关阅读


目前可以选择的免费网站统计越来越少,有很多人选择自建统计,但是自建统计需要维护,所以尝试使用了 Google Analytics 作为网站统计工具。

图片alt

因为众所周知的原因,Google Analytics 在中国大陆访问不是很顺畅,并且很多国产浏览器都自带广告拦截插件,导致谷歌统计后台统计的数据与实际差距很大。

那么有没有什么更好的方案呢?有的,那就是使用中间件进行反代(前提是服务器本身在能够流畅访问谷歌统计的国家或地区)。

解析

首先为了成功反向代理,需要向配置块中添加 DNS 解析,用于请求谷歌的接口,一般情况下用 127.0.0.1 就可以使用,但是为了防止部分机房的 DNS 请求篡改可以使用自定义 DNS 进行解析。

## CloudFlare Public DNS (IPv4 & IPv6)
#resolver 1.1.1.1 1.0.0.1 [2606:4700:4700::1111] [2606:4700:4700::1001];
## Google Public DNS (IPv4 & IPv6)
resolver 8.8.8.8 8.8.4.4 [2001:4860:4860::8888] [2001:4860:4860::8844];

根据情况选择一个开启即可。

处理

然后添加反向代理的主逻辑,添加两个 location 将请求进行转发,并且使用 sub_filter 模块进行内容重写。

    location /gtm.js {
        sub_filter 'www.googletagmanager.com' $server_name;
        sub_filter_types *;
        sub_filter_once off;
    
        proxy_set_header Accept-Encoding '';
        proxy_pass https://www.googletagmanager.com;
        proxy_redirect off;
    
        ## cache on server
        proxy_cache_key $host$uri$is_args$args;
        proxy_cache_valid 200 304 60m;
    
        ## cache in client browser
        expires 1h;
    }
    
    location /gtag/js {
        sub_filter 'www.googletagmanager.com' $server_name;
        sub_filter 'analytics.google.com'  $server_name;
        sub_filter 'www.google-analytics.com'  $server_name;
        sub_filter 'google-analytics.com'  'wangtwothree.com';
        sub_filter 'www'  'ga';
        
        sub_filter_types *;
        sub_filter_once off;
    
        proxy_set_header Accept-Encoding '';
        proxy_pass https://www.googletagmanager.com;
    
        proxy_redirect off;
        proxy_cache_key $host$uri$is_args$args;
        proxy_cache_valid 200 304 60m;
    
        expires 1h;
    }
    
    location /ga {
    	proxy_set_header X-real-ip $remote_addr;
    	rewrite ^/ga/(.*)$ '/$1?$args&uip=$remote_addr';
    	proxy_pass https://www.google-analytics.com;
    	proxy_set_header User-Agent $http_user_agent;
    	break;
    }
    
    location ^~ /analytics.js {
        sub_filter 'www.googletagmanager.com' '$server_name';
        sub_filter 'analytics.google.com'  $server_name;
        sub_filter 'www.google-analytics.com'  '$server_name/ga';
        sub_filter_types *;
        sub_filter_once off;
    	proxy_set_header X-real-ip $remote_addr;
    	proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    	proxy_set_header Referer https://www.google-analytics.com;
    	proxy_set_header Host www.google-analytics.com;
    	proxy_pass https://www.google-analytics.com;
    	proxy_set_header Accept-Encoding "";
    }

    location /g/collect {
        resolver 8.8.8.8;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

        proxy_pass https://analytics.google.com$uri$is_args$args&uip=$remote_addr;
        proxy_redirect off;
        proxy_cache_key $host$uri$is_args$args;
        proxy_cache_valid 200 304 60m;
        proxy_cache off;

        proxy_hide_header "Expires";
        proxy_hide_header "Pragma";
        add_header X-Content-Type-Options "nosniff";
    }

然后在配置文件中加入以上部分,然后在前端引用地址时,将地址换为你的域名后面接谷歌统计引入脚本地址,比如:https://wangtwothree.com/gtag/js?id=G-CVJJJJJJJJ 。

然后就可以在后台看到统计脚本的访问日志了。

比如 Google Analytics 管理后台生成的嵌入代码如下:

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-xxxxxxxxx-x"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'UA-xxxxxxxxx-x');
</script>

则你添加的代码就应该是这样的:

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://wangtwothree.com/gtag/js?id=UA-xxxxxxxxx-x"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'UA-xxxxxxxxx-x');
</script>

VIA

使用 NGiNX 异步处理 Google Analytics 加速访问 - VVavE https://www.vvave.net/archives/nginx-forward-google-analytics-optimized-loading-speed.html

使用Nginx反向代理解决 Google Analytics 访问问题 - 知乎 https://zhuanlan.zhihu.com/p/460606188

Edit | Last updated on 2024-02-29 10:57:58




×