データベースを使わないいいねボタンを作ってみた【Ajax+JSON】
JavaScript
個人的にMySQLなどのデータベースを使わない簡易的ないいねボタンがほしいと思い、PHPで作ってみました。 せっかくなのでMITライセンスで配布したいと思います。
概要
いいね数はボタンが押されるたびにjsonファイルに記録されていくため、データベースを必要としません。 いいね数はURLに対して増加していきます。そのため、同一のページにある複数のコンテンツに対していいねをつけることはできません。
デモはダウンロードデータの中に同梱してあります。
デモページの概要のページでUndefindを返しているいいねボタンがあるかもしれませんが、それは仕様です。（一度も開いていないページのいいねはUndefindになる）
また、IPやクッキーでの制限をおこなっていないため、一人が何回でも押せるようになっています。
不便だと感じたら自由に改変して利用してくださって構いません。
ファイルの使い方
ファイルの使い方を解説します。
サーバにアップ
解凍したgoodbtnフォルダをサーバにアップロードします。 今回の説明では https://example.com/ にアップロードし、「 https://example.com/goodbtn 」という状態になったとします。
ソースをコピペ
以下の記述をページのDOCTYPE宣言よりも上にコピペします。
<?php
$dir = "/goodbtn"; //フォルダのパス
require_once $_SERVER['DOCUMENT_ROOT'] . $dir .'/GoodBtn.php';
$goodBtn = new GoodBtn($dir);
?>
以下の記述を必要に応じてhead内にコピペします。 jQueryのみが必要ならjQueryのみ、FontAwesomeのみ必要ならFontAwesomeのみコピペしてください。 どちらも不要ならコピペする必要はありません。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
以下の記述をページのheadタグの中にコピペします。
<?php $goodBtn->head(); ?>
ボタンを使う準備はこれで終わりです。
ボタンの使い方
ボタンの使い方を解説します。
ボタンを設置する
ボタンを設置したい箇所にこれをコピペします。
<?php $goodBtn->viewBtn(); ?>
他のページのボタンを設置
引数に他のページのパスを入れると指定されたページのボタンを設置することができます。
ただし、一度も開かれていないページや、存在しないページのいいねボタンを設置するといいね数にundefindが入ります。
<p>
ページ2のボタン
<?php $goodBtn->viewBtn("/goodbtn/demo/page2.php"); ?>
</p>
<p>
ページ3のボタン
<?php $goodBtn->viewBtn("/goodbtn/demo/page3.php"); ?>
</p>
現在開いているページのいいね数を取得する
getCount関数を使用することでいいね数を取得できます。 引数を空にすると今開いているページのいいね数が取得できます。
このページのいいね数は<?php echo $goodBtn->getCount(); ?>です。
他のページのいいね数を取得する
getCount関数の引数をURLにすればそのページのいいね数が取得できます。このとき、指定するURLはhttpやドメイン名を取り除いた絶対パスである必要があります。
ページ2のいいね数は<?php echo $goodBtn->getCount("/goodbtn/page2.php"); ?>です。
存在しないページのURLを指定したり、一度も開かれていないページを指定した場合はundefinedを返します。
やってしまいがちなエラーになる例
//http～から始めている
ページ3のいいね数は<?php echo $goodBtn->getCount("https://example.com/goodbtn/page3.php"); ?>です。
//ドメイン名から始めている
ページ3のいいね数は<?php echo $goodBtn->getCount("example.com/goodbtn/page3.php"); ?>です。
//頭にスラッシュをつけ忘れている
ページ3のいいね数は<?php echo $goodBtn->getCount("goodbtn/page3.php"); ?>です。
いいね数に関する応用
応用の解説をします。
最もいいね数が多いページのURLを取得する
getRank関数を使うことでいいね数が多いページのURLを取得することができます。 引数を空にすると最もいいね数が多いページのURLを返します。
最もいいね数が多いページのURLは<?php echo $goodBtn->getRank(); ?>です。
いいね数が多いページを順位で取得する
getRank関数を使うことでいいね数が多いページのURLを取得することができます。 引数に数値を入れるとその順位に対応したURLを返します
一度も開かれていないページ、存在しないページ、存在しない順位（5ページしか記録されていないのに10を指定をするなど）をしてしまうとundefindを返します。
<ul>
いいね数が多いページランキング
<li>1位:<?php echo $goodBtn->getRank(1) ?></li>
<li>2位:<?php echo $goodBtn->getRank(2) ?></li>
<li>3位:<?php echo $goodBtn->getRank(3) ?></li>
</ul>
URLが返されるため、そのままリンクに使うことも可能です。 ただし、undefinedが返されたときリンクの中に入ってしまって気づきにくいので注意してください。
<p><a href="<?php echo $goodBtn->getRank(3); ?>">3番目にいいね数が多いページ</a></p>
実用的にランキングを表示するならこんな感じにするとよいかと思います。
<ul>
<?php $url = $goodBtn->getRank(1); $count = $goodBtn->getCount($url);?>
<li>1位:<a href="<?php echo $url;?>">作品名○○</a> <?php echo $count ?>件のいいね</li>
<?php $url = $goodBtn->getRank(2); $count = $goodBtn->getCount($url);?>
<li>2位:<a href="<?php echo $url;?>">作品名○○</a> <?php echo $count ?>件のいいね</li>
<?php $url = $goodBtn->getRank(3); $count = $goodBtn->getCount($url);?>
<li>3位:<a href="<?php echo $url;?>">作品名○○</a> <?php echo $count ?>件のいいね</li>
</ul>
同じページのボタンを複数設置するのは非推奨
同じページのボタンを複数設置することはできますが、常に同じ数値を表示させることはできません。注意してください。 ボタンが押されたとき、ページが再読込されたときにのみ同期します。
広告
