注）多分、その某サイトの禁止事項に引っかかりそうなので思いっきり伏せ字＆モザイクかけます。
利用規約の禁止事項は次のようになっていますので...
本サービスの不具合や障害を不正な目的で利用し、またはそれを他者へ伝達する行為
〜〜〜
その他＊＊＊＊が不適当と判断する行為
わざとそういう仕様なんだから不具合でも障害でもないだろという気もしますが、「その他〜〜」にはひっかかりそうです。
よくある有料会員への誘導パターンではある
1ページ目は無料公開で2ページ目以降は有料会員限定というのはニュースサイトなども含めてよくあるパターンですよね。
ある某大手サイトの某特集記事にたどり着き、何の気なしに2ページ目をみると、「有料会員限定です！」の大バナーが出てきました。
「あらま」と思いブラウザタブを閉じようとしたところバナーの後ろにあるコンテンツ部分が画面スクロールしました。
「ん？？？」有料会員限定バナーは確かに邪魔ですが、特集記事は全部読めるようです。
「むむむ」と思い、3ページ以降も確認すると同様のブロック方式のためやはり内容は丸見えです。
右クリック＞「要素の詳細を表示」はエンジニアの性
こうなるともう反射的にブラウザでバナー部分を右クリック＞「要素の詳細を表示」で中身を確認してしまいます。
ソースコードを見てみると、もういかにもそれっぽいclassが定義されてました。
もう試さずにはいられません。開発コンソールで下記を実行してみます。
document.querySelector('.*********').style.display = 'none'
どーん！綺麗さっぱり有料会員限定バナーが消えてしまいました。もちろん記事がなんの支障もなく見れちゃいます。
1行のスクリプトでバナー消せました。これってその気になればTampermonkeyなどのユーザースクリプトでも簡単に対応できちゃうということです。
ユーザー認証のコストとページロード時間
しかし、なんでこんな安易なブロック方式にしたんでしょうか？
開発者の側に立場にたつと分からなくもありません。
- ページ操作開始時間を短くしたい。
- 無料会員はブロックしたい。
といいう2つの目標のせめぎ合いだからなんでしょうね。
【1】昔ながらの認証→表示
いわゆるCGIなどでサイトを表示する昔ながらの方式だと、次のようなフローになります。
- 1 : ユーザー認証 → 2 : 認証結果を受けて表示コンテンツを切り替え。
確実にユーザー認証結果に対応できます。ただしこの方式だと、認証が終わるまで画面が表示されず、いわゆる「遅い」サイトとなり、ユーザービリティもSEOスコアも下がってしまいます。
【2】表示しつつ認証
いまどきはJavaScriptでクライアントに機能を持たせられます。なので、この某サイトもこんな感じの処理フローかと思われます。（会員じゃないので未確認です。）
- 1 : 有料バナーを表示しつつコンテンツも合わせて表示（認証不要な分、すぐにコンテンツを表示できる）
- 2 : 並行してユーザーの認証確認も行い、有料会員だったら有料バナーを隠す。
コンテンツ表示した瞬間は有料バナーがありますが、いまどきだと1秒もしないタイミングでバナーが消えるという感じですね。ただこの方式だとHTML構造を調べられると今回のように簡単にバナーを消されちゃいます。
【3】表示しつつ認証だけどこの方式の方がまだマシかな？
ユーザー情報の編集機能とかではなくコンテンツ表示程度だからそんなに厳格な認証は不要ということなんでしょうが、有料会員の気持ちを考えるともう少し厳しめのブロック方式にしたいものです。
私ならこんな感じにするかな〜
- 1 : 有料バナーを表示しつつコンテンツも合わせて表示（認証不要な分、すぐにコンテンツを表示できる）
- 2 : 並行してユーザーの認証確認も行い、有料会員だったら有料バナーを隠す。
- 3 : 並行してユーザーの認証確認も行い、有料会員でなかったらコンテンツを上書きする。
しばらくはコンテンツも見えてますが有料会員でないことを判定した時点でコンテンツ部をなにか別のもので上書きします。
この際、コンテンツ部を"隠す"ではまずいです。今回と同様にカジュアルハックで"表示"に切り替えられちゃいますので。
とはいえ、この方式もソースコードのテキストを読まれたら一緒ですが...
もっと厳しくするにはコンテンツを動的ローディングするなどの処理が必要となり開発やサーバコストも増えるのでトレードオフですね〜
