Ajax framework
var $ = jQuery.noConflict() $(function(){ $('#btn').on('click',function(){ var data = { action: "myajax", // 這是綁定 wp hook 的關鍵字,千千萬萬不能漏掉 security: ajax_params.nonce, // toekn 驗證 name: $("input[name='username']").val() // 要傳給後端的參數 }; $.ajax({ url: ajax_params.ajaxurl, // ajax_params 參數在 wp_localize_script 定義 data: data, type: 'POST', dataType: "json", success: function (data) { console.log(data.log); // data 為接收回傳的參數 } }) }) })
<?php function ajax_scripts() { wp_register_script('my_ajax', plugin_dir_url( __DIR__) . '/js/poll.js', array('jquery'),null,true ); wp_localize_script('my_ajax', 'ajax_params', array( 'ajaxurl' => site_url(). '/wp-admin/admin-ajax.php', // WordPress AJAX URL 'nonce' => wp_create_nonce('ajax-nonce'), // TOKEN 驗證,裡面的值要跟下面的 handler 一樣 'other' => 'something' )); wp_enqueue_script('my_ajax'); } function myajax_ajax_handler(){ // TOKEN 驗證 if (!wp_verify_nonce($_POST['security'], 'ajax-nonce')) { // 第二個參數要跟上面的 wp_create_nonce 的一樣 wp_send_json_error(array('code' => 500, 'data' => '', 'msg' => '錯誤的請求')); } echo json_encode( array( 'result'=>'Ajax Success', // 把 php 參數編譯為 json 檔讓傳給 js ) ); die; } add_action('wp_enqueue_scripts', ajax_scripts); add_action('wp_ajax_myajax', myajax_ajax_handler); add_action('wp_ajax_nopriv_myajax', myajax_ajax_handler);
Tags:
- ajax
- /