Ajaxの使い方

2025/02/10 非同期通信

functions.phpでレスポンスを生成する

function get_location() {
    $location = array(
        'latitude' => '42.00',
        'longitude' => '122.00'
    );

    if ($location) {
        wp_send_json_success($location);
    } else {
        wp_send_json_error('位置情報が見つかりません');
    }
}

add_action('wp_ajax_{任意のアクション名}', 'get_location');  ※2
add_action('wp_ajax_nopriv_{任意のアクション名}', 'get_location');　※3

※2 … WordPressにログイン済みのユーザーへのアクション

※3 … WordPressにログインしていないユーザーへのアクション

これによって、https://sample.com/wp-admin/admin-ajax.php にアクセスすると、

{“latitude”:”42.00″,”longitude”:”122.00″}　というレスポンスが得られるようになりました。

page.phpでレスポンスをfetchする

function fetchLocation() {

    fetch(`<?php echo admin_url('admin-ajax.php'); ?>?action={任意のアクション名}&driver_id=1`)
        .then(response => response.json())
        .then(data => {
           -- 取得したJSONデータの処理 --
        })
        .catch(error => console.error('位置情報の取得が失敗しました: ', error));
}

page.phpでsetIntervalする

setInterval(fetchLocation, 5000);

BACK