FoursquareAPIをつかってみた

FourSquareアプリを登録、作ってみた。→こんなの


検索したらPHPのライブラリがあったが、うまくいかなかったので違うやり方(ライブラリを使わない)でやってみた。


(参考にしたページ)

上のページを参考に、
・ユーザの情報を表示する
・近くの場所を表示する
・チェックインした場所のリスト
・ついでにマップ上にも表示
という感じでつくってみた。



まずは、FourSquareにアプリの登録をした。


Developer.foursquare.comの下の方にある「Manage OAuthConsumers」を選択する。


そして「REGISTER A NEW CONSUMER」を選択して、
・アプリの名前
・アプリのURL
・コールバックするURL
の3つを入力して「REGISTER APPLICATION」でアプリを登録する。


するとCLIENT ID、CLIENT SECRETが与えられる。


PHPのコードは以下のようにした。
「apitest.php



<?php
$client_id = "取得したCLIENT ID";
$client_secret = ""取得したCLIENT SECRET";
$callback_url = "入力したコールバックするURL";
//取得したCLIENT ID, CLIENT SECRET,アプリ許可後のリダイレクト先のURL(このファイルを指定してある)

session_start();

$code = $_REQUEST["code"];

//許可ページに飛ぶ前
if(empty($code)) {
//認証ページにリダイレクトする
$auth_url = "https://foursquare.com/oauth2/authenticate?client_id=" . $client_id .
"&response_type=code&redirect_uri=" . $callback_url;
header("Location: " . $auth_url);
}

//許可後
//アクセストークンのリクエスト先
$access_token_url = "https://foursquare.com/oauth2/access_token?client_id=". $client_id .
"&client_secret=" . $client_secret .
"&grant_type=authorization_code&redirect_uri=" . $callback_url .
"&code=" . $code;
//JSON形式でアクセストークン情報を取得し配列に
$access_token_array = json_decode(file_get_contents($access_token_url), true);

//アクセストークンをセッションに保存
$_SESSION['access_token'] = $access_token_array['access_token'];

print<<<EOD
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>myFoursquare</title>
</head>
<body>
<script type="text/javascript" charset="utf-8">
//位置情報を取得する
navigator.geolocation.getCurrentPosition(
function(position){
document.getElementById("latitude").value = position.coords.latitude;
document.getElementById("longitude").value = position.coords.longitude;
}
);
</script>
EOD;

//リクエスト先
$users_url = "https://api.foursquare.com/v2/users/self"."?oauth_token=".$access_token_array['access_token'];
//JSON形式で周辺venue情報を取得し配列に
$users_array = json_decode(file_get_contents($users_url), true);

//アイコン、名前を取得する
echo "<img src=\"".$users_array['response']['user']['photo']."\">";
echo "<font size='5'>".$users_array['response']['user']['firstName']." ".$users_array['response']['user']['lastName']."</font><br/>";

//バッジの数、メイヤーの数?、友達の数の取得
echo " badges:".$users_array['response']['user']['badges']['count']."/35 ";
echo " mayorships:".$users_array['response']['user']['mayorships']['count'];
echo " friends:".$users_array['response']['user']['friends']['count'];

//Tips、ToDoの数の取得
echo " tips:".$users_array['response']['user']['tips']['count'];
echo " todos:".$users_array['response']['user']['todos']['count'];

//最近、最高の、現在の?チェックイン数
echo " scores recent:".$users_array['response']['user']['scores']['recent'];
echo " max:".$users_array['response']['user']['scores']['max'];
echo " checkinsCount:".$users_array['response']['user']['scores']['checkinsCount']."<br/>";

//位置情報の取得と送信フォームの表示
print<<<EOD
<a href="apitest_checkinlist.php"><input type="submit" value="チェックインリスト"></input></a>
<form method="get" action="apitest_nearvenues.php">
<input id="latitude" name="latitude" type="hidden"></input>
<input id="longitude" name="longitude" type="hidden"></input>
<input type="submit" value="近くのスポット"></input>
</form>
<a href="apitest_checkinmap.php"><input type="submit" value="チェックインマップ"></input></a>
</body>
</html>
EOD;

?>

これで、自分のアイコンと名前、バッジ数、メイヤーの数?、友達の数などが表示できる。


それと下に「チェックインリスト」「近くのスポット」「チェックインマップ」の3つのボタンが表示される。

それぞれ別々にページを作成した。


チェックインリスト
(最近のチェックインをリスト表示するだけ)
「apitest_checkinlist.php


<?php
$client_id = "取得したCLIENT ID";
$client_secret = ""取得したCLIENT SECRET";
$callback_url = "入力したコールバックするURL";

session_start();

if(empty($_SESSION['access_token'])) {
header("Location: " . "erroraut.php");
}

$access_token = $_SESSION['access_token'];

//リクエスト先
$search_venues_url = "https://api.foursquare.com/v2/users/self/checkins". "?limit=50&oauth_token=" . $access_token;
//JSON形式で周辺venue情報を取得し配列に
$venues_array = json_decode(file_get_contents($search_venues_url), true);

print<<<EOD
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>CheckinList</title>
</head>
<body>
<ul style="list-style:none">
EOD;

//周辺のvenueのカテゴリアイコンと名前をリスト表示
$num=0;
foreach ($venues_array['response']['checkins']['items'] as $items) {
print "<li>";
//カテゴリの画像がなければ「☒」を表示する
if($items['venue']['categories'][0]['icon'] != null){
print "<img src=\"" . $items['venue']['categories'][0]['icon'] . "\">";
}else{
echo "<font size=6>☒</font>";
}
echo "<font size='5'>".$num.":".$items['venue']['name']."</font>";
//シャウトがあれば表示する
if($items['shout'] != null){
echo "<font size='4'> \"".$items['shout']."\"</font>";
}
//なんとなく座標の表示
echo "<br/>Lat:".$items['venue']['location']['lat']." Lng:".$items['venue']['location']['lng'];
print "</li><hr>";
$num++;
}

print<<<EOD
</ul>
</body>
</html>
EOD;

?>

最近のチェックイン50個をリスト風に表示する。
カテゴリがNullだったらアイコンに「☒」を表示する。また、シャウトがあればそれを表示する。


他にも、
近くのスポットを表示(ブラウザから位置情報を取得して近くのスポット?を探して表示する)したり、最近のチェックインをGoogleマップに表示したりもやってみた。


こんなかんじにとりあえずFourSquareAPIを試してみた。
PHPをろくに触ったことが無かったが何とか調べつつコピペしつつ動かすことができたのでよかった。
まだまだ改善点が山のようにあるのでどんどん直したいと思います。


8月4日、認証していなかったり位置情報くれなかったときのエラー処理を追加してみました。


 今回作成したFourSquareアプリ、エラー出まくると思うのでお手柔らかに…