ダリの雑記：WEBプログラム版

この記事は1年以上前の記事のため、内容が古い可能性があります。

この記事は、『レーティング機能と「いいね！」を連動させる【Facebook】：STEP1』の続きの記事です。

STEP2からjqueryを使用しますので、あらかじめこちらのサイトからダウンロードを行ってください

2. 「いいね！」「だめだね！」ボタンが押されたとき、そのデータをcsv形式で保存するプログラムを作成。

ボタンが押された際、csv形式でデータを保存するプログラムを作成します。
保存するデータは

• ボタンを押したユーザのFacebookID
• ページのURL
• 「いいね！」「だめだね！」のどちらのボタンを押したか

です。

■2-1. POSTされてきたデータをCSVファイルに出力するプログラム

下記のサンプルコード（rating_save.php）は、Ajax Requestにより呼び出され、POSTされたデータをCSV形式で出力するというプログラムです。

サンプルコード（rating_save.php）

<?php
$fb_user_id = $_POST["fb_user_id"];		//FacebookID
$fb_my_url = $_POST["fb_my_url"];		//ボタンが押されたページのURL
$select_vote = $_POST["select_vote"];	//押されたボタン。「いいね！」なら「1」、「だめだね！」なら「0」が渡されます。

//データ初期化
$csv_data = "";
$output_data = "";
$like_vote = 0;
$count_vote = 0;

if(($select_vote== "1" || $select_vote == "0") && !empty($fb_user_id) && !empty($fb_my_url)){
	
	lock("rating");	//書き込みが重複しないようにロックする
	
	//出力データの生成
	$output_data = $fb_user_id.",".$fb_my_url.",".$select_vote."\r\n";
	if(file_exists("csv/rating.csv")){
		$fp = fopen("csv/rating.csv", "r");
		while ($data = fgets($fp)) {
			$csv_data .= $data;
		}
		$output_data = $csv_data.$output_data;
	}
	
	//CSVデータの出力
	@mkdir("csv");
	$fp = fopen("csv/rating.csv", "w");
	fwrite($fp, $output_data);
	fclose($fp);
	
	//これまでのレーティングデータを取得する
	$fp = fopen("csv/rating.csv", "r");
	while ($data = fgets($fp)) {
		$data = rtrim($data);
		$data_split = explode(",", $data);
		if($data_split[1] == $fb_my_url){
			$count_vote++;
			if($data_split[2] == "1"){
				$like_vote++;
			}
		}
	}
	fclose($fp);
	unlock("rating");	//ロック解除
	
	//レーティングデータを返す
	echo $like_vote."/".$count_vote;
}


##
## ロック関数
##

//	ロック処理
function lock($dir_name) {
	$lock_dir = "lock/";
	@mkdir($lock_dir);
	while (1) {
		timeover_delete_dir(600, $lock_dir.$dir_name);
		if (@mkdir ($lock_dir.$dir_name, 0777)) {
			break;
		} else {
			sleep (1);
		}
	}
}

//	ロック解除処理
function unlock($dir_name){
	$lock_dir = "lock/";
	@rmdir ($lock_dir.$dir_name);
}

//	削除されるはずのディレクトリが残っていたときの対処（エラー回避）
function timeover_delete_dir($delete_time, $dir_name){
	if(is_dir($dir_name)){
		$now_time = time();
		$dir_time = date('U', filemtime($dir_name));
		$difference_time =  $now_time - $dir_time;
		if($difference_time > $delete_time){
			@rmdir ($dir_name);
		}
	}
}

?>

02～04行目：POSTされてきたデータを変数にいれます。
データはそれぞれ

• fb_user_id：FacebookID
• fb_my_url：ボタンが押されたページのURL
• select_vote：押されたボタン。「いいね！」なら「1」、「だめだね！」なら「0」

となっています。

12～49行目：データをCSV形式で保存します。また、すでに保存されているデータを調べ、ボタンの押された回数と「いいね！」が押された回数を取得し、出力します。

51～85行目：データの保存が重複しないよう、ロックをかける関数とロック解除の関数です。

■2-2. Ajax Requestを用いて上記のプログラム（rating_save.php）を呼び出す

STEP1の「1-2. PHPにてFacebookユーザの基本データ取得」で作成したプログラムにいろいろと追加します。

サンプルコード（step2.php）

<?php
session_start();

$fb_app_id = "App IDをここに入力";
$fb_app_secret = "App Secretをここに入力";

//現在開いているページのURL
$fb_my_url = 'http://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];	
$fb_my_url_split = explode("?", $fb_my_url);
$fb_my_url = $fb_my_url_split[0];

$fb_code = $_GET["code"];
$fb_user_id = $_SESSION["fb_user_id"];

if(empty($fb_code) && empty($fb_user_id)) {
	$fb_get_userdata = "0";
}elseif(!empty($fb_user_id)){
	$fb_get_userdata = "1";
}elseif(!empty($fb_code)){
				
	// Facebook側からトークンを取得
	$fb_token_url = "https://graph.facebook.com/oauth/access_token?"
		."client_id=".$fb_app_id
		."&redirect_uri=".urlencode($fb_my_url)
		."&client_secret=".$fb_app_secret
		."&code=".$fb_code;
	$fb_access_token = file_get_contents($fb_token_url);
					
	// トークンを使用して、graph APIから名前を取得
	$fb_graph_url = "https://graph.facebook.com/me?".$fb_access_token;
	$fb_user = json_decode(file_get_contents($fb_graph_url));
				
	if(empty($fb_user)){
		$fb_get_userdata = "0";
	}else{
		$fb_get_userdata = "1";
		$fb_user_id = $fb_user->id;
		$_SESSION["fb_user_id"] = $fb_user_id;
	}	
}


//これまでのレーティングデータを取得する
$fb_count_vote = 0;
$fb_like_vote = 0;
if(file_exists("csv/rating.csv")){
	$fp = fopen("csv/rating.csv", "r");
	while ($data = fgets($fp)) {
		$data = rtrim($data);
		$data_split = explode(",", $data);
		if($data_split[1] == $fb_my_url){
			$fb_count_vote++;
			if($data_split[2] == "1"){
				$fb_like_vote++;
			}
		}
	}
	fclose($fp);
}

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>レーティング機能と「いいね！」を連動させる【Facebook】</title>
	
	<script type="text/javascript" src="js/jquery.min.js"></script>
	
	<script type="text/javascript">
		function ratingSave(select_vote){
			var php_url = "rating_save.php";
			var fb_my_url = "<?php echo $fb_my_url; ?>";
			var fb_user_id = "<?php echo $fb_user_id; ?>";
					
			if(select_vote == "1"){
				$('#rating_button').html("「いいね！」に投票されました。");
			}else if(select_vote == "0"){
				$('#rating_button').html("「だめだね！」に投票されました。");
			}
					
			$.post(
				php_url, 
				{"select_vote":select_vote, "fb_my_url":fb_my_url, "fb_user_id":fb_user_id}, 
				function(message, status) {
					if ('error' != status){
						message_split = message.split("/");
						$('#like_vote_id').html(message_split[0]);
						$('#count_vote_id').html(message_split[1]);
					}
				   },
				"html"
			);
		}
	</script>
	
</head>

<body>
	
	<?php
	//ユーザ基本データが取得できた場合。
	if($fb_get_userdata == "1"):
	?>
	
	<div id="rating_button">
		<p>以下のリンクをどちらかクリックしてください。（まだFacebookには反映されません。）</p>
		<p><a href="javascript:void(0);" onclick="ratingSave('1')">いいね！</a> | 
		<a href="javascript:void(0);" onclick="ratingSave('0')">だめだね！</a></p>
	</div>
	
	<?php
	//取得できなかった場合。
	else:
		//アプリ許可用のURL
		$fb_dialog_url = "http://www.facebook.com/dialog/oauth?"
		."client_id=".$fb_app_id
		."&redirect_uri=".urlencode($fb_my_url);
	?>
	
	<p>レーティングに参加するにはFacebookのアカウントが必要です。<br />
	またFacebook用アプリの「（アプリ名）」を許可する必要があります。</p>
	<p style="margin:5px 0px;"><a href="http://www.facebook.com/index.php" target="_blank">Facebookアカウントを取得する</a> | <a href="<?php echo $fb_dialog_url; ?>">アプリを許可する</a></p>
	
	<?php endif; ?>
	
	<p><span id="count_vote_id"><?php echo $fb_count_vote; ?></span>人中、<span id="like_vote_id"><?php echo $fb_like_vote; ?></span>人がいいね！と言っています。</p>
	
</body>
</html>

■追加部分

42～58行目：すでに投票されているレーティング情報を取得する。

68行目：jqueryの読み込み（jqueryのダウンロードはこちら）

70～95行目：ボタンが押された時の処理。rating_save.phpへデータを渡し実行させる。

106～110行目：ボタンを仮設置（まだFacebookとの連携はされていない）

127行目：レーティング情報の表示。

※まだこの段階では、Facebookとの連携はされていませんし、一度「いいね！」「だめだね！」のいずれかを押していても画面をリロードすれば再投票できてしまいます。

サンプルコードの実行例

STEP1へ｜STEP2へ｜STEP3へ｜STEP4へ