勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

HTMLにてaタグクリック時にping属性のデータをPHPで受け取る方法

  PHP HTML

HTMLのaタグにping属性というものを設定できるらしく、設定したリンクをクリックした際、当該属性に指定したURLへpingが送信されるとのこと。「遷移前のページURL」「遷移後のページURL」「GETパラメータ」辺りをPHPで受け取り、ログに出力してみたい。以下にソースコードをメモ。

 

ソースコード

遷移前のページ(before.php)

<a href="./after.php" ping="./log.php?price=100">link</a>

pingを受け取るページ(log.php)

<?php
error_log(
    print_r($_SERVER['HTTP_PING_TO'], true) . "\n" . print_r($_SERVER['HTTP_PING_FROM'], true) . "\n" . print_r($_GET['price'], true) . "\n-----", 
    3, 
    './test.log'
);

解説等

以下で受け取れる。

  • $_SERVER['HTTP_PING_TO'] → 遷移後のページ
  • $_SERVER['HTTP_PING_FROM'] → 遷移前のページ
  • $_GET['price'] → GETパラメータ

ユーザーエージェントやアクセスIPアドレス等を取得したい場合は$_SERVERから対応するものを指定すると良い。

注意点

ping属性が現時点ではfierfoxに対応していない点に注意。詳細はリファレンスのブラウザの互換性部分を参照すること。

 

リファレンス

https://developer.mozilla.org/ja/docs/Web/HTML/Element/a#ping

 

所感

簡単な計測システムなんかを作りたい場合は使えるかも。firefox未対応なのは痛いところだけどスマホ向けサイトだとあんまり影響は無さそう。

 - PHP HTML

  関連記事

ブラウザがWebP対応の場合はそのまま表示し、非対応の場合はjpg/png画像を表示させる方法

ページ表示時にブラウザがWebP画像に対応している場合はそのまま表示し、非対応の ...

FileReader APIを用いて画像をアップロードせずにサムネイル表示

以前にFile APIを用いてファイル名やサイズ、形式(拡張子)を取得するメモを ...

formのinput="file"でディレクトリを選択させ、ディレクトリ内のファイルを全てアップロードする方法

フォームで複数のファイルをアップロードしたい場合、input="file"を複数 ...

ajaxを使わずに非同期っぽくsubmitする

ajaxを使わずに見た目はページ遷移せず、 画像を含めたformをsubmitし ...

HTML5のカレンダーピッカーについて(input type="date")

とあるシステムのフォーム部分を改修する案件があった為、内容を確認していると日付入 ...