jQuery – Ajaxを使ったPHP、MySQLの非同期通信

mobkin2018年2月14日0

jQueryでAjaxを使って、サーバと非同期通信を行うサンプルをメモしておきます
今回は非同期データのやりとりにjsonを使います

js（クライアント）のサンプル

javascript側（クライアント側）のサンプルです

クライアント側（js）function client(){
    $.ajax({
        url: './server.php',   //サーバ側のphp
        type: 'GET',           //GETかPOSTか
        data: {                //呼び出し先のパラメータ
            parameter1: 'GETパラメータの値',
            parameter2: 'GETパラメータの値',
            parameter3: 'GETパラメータの値'
        },
       dataType: 'json'        //サーバ側からの返却形式、XMLとかも可能
    })
    .done(function(data) {
        //成功した場合に行う処理
    })
    .fail(function(data) {
        //失敗した場合に行う処理
    })
    .always(function(data) {
        //常に行う処理
    });
};

上記のjsを適当にhtmlに設置します

php（サーバ側）のサンプル

Ajaxからリクエスト受けるサーバ側のサンプルです

サーバ側（php）<?php
//Ajax以外からのアクセスを遮断
$request = isset($_SERVER['HTTP_X_REQUESTED_WITH'])
     ? strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) : '';
if($request !== 'xmlhttprequest') exit;
 
//DB接続
$db_server = "MySQLサーバのアドレス";
$db_user = "MySQLのユーザ";
$db_pass = "MySQLのパスワード";
$db_name = "DBサーバの名前";
 
$DB_LINK = mysql_connect($db_server, $db_user, $db_pass);
$DB_SELECT = mysql_select_db($db_name, $DB_LINK);
 
//SELECT
$sql = "SELECT * FROM `test_table`";
$result = mysql_query($sql);
if (!$result) {
    print $sql;
    die('クエリーが失敗しました。' . mysql_error());
}
$select_result = array();
while ($row = mysql_fetch_assoc($result)) {
    $select_result[] = $row;
}
unset($sql);
 
//結果をjson形式で返す
header('Content-Type: application/json');
echo json_encode($select_result);

サーバ側はcontent-typeにjsonを指定して、js側に返す感じですね！

コメントを残すコメントをキャンセル