javascriptリダイレクトについて改めて考えてみた。

概要

この記事は以下の記事を読んで2018年5月に実装し直したものである。
やはり、お前らのJavaScriptでのリダイレクト実装は間違っている

おおきなポイントとしては

記事公開以降googleアナリティクスコードがanalytics.jsからgtag.jsに変わったこと
リダイレクト後の"referrer="http://~~~""が気になるので消したい

ということ。

この問題、何も言わないでおいたら多分誰も気づかずに放置されるだけな気がするけど
気の回るエンジニアがどうします？と聞くとだいたいやってくれって言われるのつらい。
アナリティクス管理画面のアクセス解析をしたい。ちゃんと活かしてる人いたらごめんなさい。

analytics.jsからgtag.jsへ

困ったことにいつの間にかgtag.jsという見慣れないものに変わったので
参照記事の
ga('set', 'referrer', decodeURIComponent(kv[1]));
というコードでは成り立たなくなっていたので、調べたところここの部分は
gtag('config', 'UA-xxxxxxxx-x', {'page_referrer':kv[1]});
というコードに置き換えられるらしい。

リダイレクトのurlお掃除したい。

referrer="https://facebook.com"みたいなのがurlにあるとアクセス解析してる感満載なので取れないかどうか試してみた。
window.location.search=''とかはページのリロードはしるのでだめだった。
histroyオブジェクトの書き換えならできた!!
window.history.replaceState()
replaceState使えばブラウザ履歴にも残らずです。
urlもきれいになった後にga送られるっぽいのでアナリティクスにノイズが入る問題も
クリアになったかも！

抜粋するとこんな感じ。
リダイレクト元のスクリプトはよしなに。

.js

//url文字列取得
var url = window.location.href;
//kv[0]: referrer, kv[1]: http://~~ として
//exp: リファラの保存に使った文字列の正規表現。?もしくは&から始まる任意の文字列
var exp = new RegExp("(\\?|&)"+kv[0]+"="+kv[1]);
//urlからリファラの部分抜く
url = url.replace(exp, '');
//一応replaceSatateあるかチェックしてから更新
if(typeof(window.history.replaceState) === 'function') {
  window.history.replaceState(null, null, url);
}
//最後にga送信
gtag('config', 'UA-xxxxxxxx-x', {'page_referrer':kv[1]});

検証してみた

例えば英語ページから日本語ページへリダイレクトするケース。
facebookの投稿の公開設定を自分のみにしてアクセス。

ちゃんと日本語ページになってるか確認。

検証用のアナリティクス画面を確認。

問題なさそうです。