郵便番号から住所自動入力 jQuery,PHP,PDO,MySQLで作ってみた

郵便番号入力するだけで、住所の入力の手間が省けるフォームってあります。あれ便利ですよね。ということでjQuery+PHP+PDO+MySQLで作ってみることにしました。

MySQLのデータは前回の「MAMP MySQLに12万もの郵便番号を文字化け無しでぶち込む」を参照して用意します。

あとは以下の「index.html」と「postal.php」をコピペしてデータベース名、ユーザー名、パスワードなどを少し変更するだけで使えると思います。

HTML

jQueryのajaxを使います。ボタンを押したら郵便番号をpostal.phpに送り、住所などが返ってきます。

index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>郵便番号自動出力</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('button').on('click',function(){
        $.ajax({
            type: 'post', // 通信方式 POST or GET (デフォルトはGET)
            url: 'postal.php', // 通信先
            dataType: 'json', // データのタイプ
            data: { // 連想配列で入力値を受け渡す
                "po": $('input').val()
            },
            // 成功した場合
            success: function(data){
                $('#ad1 span').text(data[0].d07);
                $('#ad2 span').text(data[0].d08);
                $('#ad3 span').text(data[0].d09);
            },
            // 通信できなかった場合(オプション)
            error: function(){
                alert('なんかミスってる..');
            }
        });
    });
});
</script>
</head>
<body>
    <input type="text" name="po" />
    <button>ボタン</button>
    <p id="ad1">都道府県:<span></span></p>
    <p id="ad2">市区町村1:<span></span></p>
    <p id="ad3">市区町村2:<span></span></p>
</body>
</html>

PHP

POSTで受け取った郵便番号をJSON形式に変換して返します。データベース接続の選択肢は3つほどあります。MySQL独自のもの、PEARライブラリのMDB2、PDOがありますが、ここではPDOを使います。PDOはPHPの5.1.0以降に標準搭載なので、MDB2のようにインストールする必要がありません。また、MySQL以外のデータベースに移行する場合も容易です。

postal.php

<?php
/*************** ここから入力値チェック ***************/
// 受け取った値が存在したら格納 なかったら終了
$po = isset($_POST['po']) ? $_POST['po'] : exit();
// 受け取ったものがUTF-8以外だったら、あやしいので終了
if(!mb_check_encoding($po,'utf-8')){ exit(); }
// 全角数字だった場合半角数字に変換 それ以外は消す (ここでもUTF-8を確認)
$num1 = array('/0/u','/1/u','/2/u','/3/u','/4/u','/5/u','/6/u','/7/u','/8/u','/9/u','/[^0-90123456789]/u');
$num2 = array('0','1','2','3','4','5','6','7','8','9','');
$po = preg_replace($num1,$num2,$po);
// 受け取った値が半角数字で7文字のUTF-8ではなかったら終了
if(!preg_match("/A[0-9]{7}z/u",$po)){ exit(); }
/*************** 入力値チェック終了 ***************/
/*************** ここからデータベース ***************/
// PDO DSNの設定
$dsn = 'mysql:dbname=ここにデータベース名;host=ここにホスト名'; // データベース名とホスト名
$user = 'ここにユーザー名'; // ユーザー名
$password = 'ここにパスワード'; // パスワード
try{
    // 接続 UTF-8を使用
    $pdo = new PDO($dsn,$user,$password,array(
        PDO::MYSQL_ATTR_INIT_COMMAND => "SET CHARACTER SET 'utf8'"
    ));
    // 表示するための操作
    // プリペアドステートメントでSQLインジェクション防止。
    // データベースのpost_allから受け取った郵便番号に一致する
    // 都道府県と市区町村のデータだけを指定。
    $stmt = $pdo->prepare('select d07, d08, d09 from post_all where d03 = :po');
    // 上の「:po」部分を受け取った郵便番号にINT(整数型)で当てはめる
    $stmt->bindParam(':po',$po,PDO::PARAM_INT);
    $stmt->execute(); // 実行

    $row = array(); // 配列を用意
    // 実行結果からデータを抜き出す。
    $row[] = $stmt->fetch(PDO::FETCH_ASSOC);
    // データがない場合(存在しない郵便番号だったら)
    if($row[0] == null){
        $row[0] = array('d07'=>'存在しない郵便番号です','d08'=>'','d09'=>'');
    }
    // 宣言「このファイルphpではなく、jsonとして扱いなさい!」
    header('Content-Type:application/json');
    // データをjsonに変換して出力
    echo json_encode($row);

}catch(PDOException $e){
    // エラー時の処理
    echo 'Connection failed:'.$e->getMessage();
    exit();
}
// PHPスクリプトが終了すればデータベースへの接続は閉じられますが、記述しておく
$pdo = null;

/* エラーをJSONで返して表示させるとき
// 上記のexit() を errorToJson() に置き換える
function errorToJson(){
    header('Content-Type:application/json');
    $row = array();
    $row[0] = array('d07'=>'郵便番号を入力してください','d08'=>'','d09'=>'');
    echo json_encode($row);
    exit();
}
*/

参考