夜の歌

プログラミング、音楽、本について緩く書いていきます。

DBに登録しているユーザーの名前を、３名分表示するコード(７月４日)

DBに登録しているユーザーの名前を、３名分表示するコード。JQueryとPHPを使って実装。PHPはユーザーデータのJSONを返すだけのAPIとなっている。

index.html

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title></title>
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    </head>
    <body>
        <ul>
            <li>
                <a href="" id="intro1"></a>
            </li>
            <li>
                <a href="" id="intro2"></a>
            </li>
            <li>
                <a href="" id="intro3"></a>
            </li>
        </ul>
        <script>
            //３人の他ユーザーを表示する際のデータを取得
            jQuery.get('user.php', function(data) {
                var user_data = data['data'];      
                jQuery('#intro1').html(user_data[0]['name']);
                jQuery('#intro2').html(user_data[1]['name']);
                jQuery('#intro3').html(user_data[2]['name']);
            });
        </script>
    </body>
</html>

user.php

<?php
$svn = 'localhost';
$dbname = '';
$pass = '';
$user = '';

$link = mysqli_connect($svn, $user, $pass, $dbname) or die("エラー");

$sql = 'select * from user';

$query = mysqli_query($link, $sql) or die('test');


$data = array();
$data_all = array();

while ($row = mysqli_fetch_array($query)) {
    //id,nameカラムを配列に入れる
    $data['id'] = $row['id'];
    $data['name'] = $row['name'];
    $data_all[]=$data;
}
$var = array('res'=>'succes',
              'data'=>$data_all);

header("Content-Type: application/json; charset=utf-8");
echo json_encode($var);
?>

うーん、APIから取得したJSONをそのまま使っているのは大丈夫なのだろうか。明日調べてみよう。