[PHP] WordPress admin-ajax @ 工程的日子每天都很師

(圖片來源)

只要簡單2步驟，你也能快速學會如何使用 admin-ajax，相信大家撰寫網站時常使用到 ajax 來進行非同步的請求，在 WordPress 也不例外，而關於這一點 WordPress 已經替大家做出解決方法了，那就是 admin-ajax！

無論前台、後台中的任何一個頁面，都統一要將參數資料丟到 /wp-admin/admin-ajax.php 這個目標網址。當你把資料丟過去之後，你就可以在 /wp-content/themes/使用的主題/functions.php ，接收請求與參數，來進行資料的處理，使用 admin-ajax 主要有兩個部分要添加程式碼：

1. 前台頁面的 javascript (請求)
2. functions.php (接收、處理、回傳)

1. 請求頁面的 javascript (請求)

因為 ajax 的 url 必須是 admin-ajax.php，所以我利用 admin_url() function 來產生網址（admin_url() 使用方式），ajax 的 data 至少會有一個，那就是 action: "action name"，這裡的 action name 必須跟 functions.php 中的一樣，否則無法正常運作。

<script type="text/javascript">
    var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>";
    
    $.ajax({
        url: ajaxurl,
        type: "POST",
        data: {
            action: "my_test_action",
            data: 456
        },
        success: function(data){
            console.log(data);
        },
        error: function(data) {
            console.log('error');
        }
    });
</script>

2. functions.php (接收、處理、回傳)

接資料的部分依照 ajax 的種類，若 type 等於 post，則使用 $_POST 來接資料，資料處理的部分依照自己的需求做更動，回傳結果必須為 Json，可以使用 wordpress 提供的 wp_send_json function 或是 return json_encode() 兩種方式，最後記得加上兩行 add_action()，並且將 “my_test_action" 替換成自己的名稱！

function my_test_action()
{
    // 接收資料
    $postData = $_POST['data'];
　　
　　// 資料處理
 
    // 回傳結果
    wp_send_json($postData); // or return json_encode(), 若直接 return 會回傳0
    wp_die(); // or die()
}
add_action( 'wp_ajax_my_test_action', 'my_test_action' );
add_action( 'wp_ajax_nopriv_my_test_action', 'my_test_action' );

參考:

WordPress Ajax URL for function in functions.php
AJAX call returns 0
How to Load Ajax in WordPress