how to send Ajax request in wordpress backend

Question

how to send Ajax request in wordpress backend

user8463989

2020年12月18日 15:26

On the fronted the wp_localize_script seems to be working as when I view the source I can see the nonce.

wp_localize_script('scripts', 'myAjax', array(
    'root_url' = get_site_url(),
    'ajaxurl'  = admin_url( 'admin-ajax.php' ),
    'nonce'    = wp_create_nonce('wp_rest')
));

For example, when I try get a list of users when logged into the wordpress backend I get a 401 unauthorised error. When I view the source my nonce is not there, only on the frontend.

$.ajax({
        url: 'https://example.com/wp-json/wp/v2/users/',
        method: 'GET',
        beforeSend: (xhr) = {
        xhr.setRequestHeader('X-WP-Nonce', myAjax.nonce);
        },
    })
    .done(function (data) {
        console.log(data);
    })
    .fail(function (jqXHR, textStatus, errorThrown) {
        console.log(textStatus + ': ' + errorThrown);
        console.warn(jqXHR.responseText);
    })

Topic wp-localize-script nonce authentication rest-api ajax Wordpress

Category Web

Tony Djukic · Accepted Answer · 2020年12月18日 15:26

When you enqueue or localize a script you're doing it specifically for the front end or the admin. If you want to enqueue or localize a script in both, you have to specifically do it for both.

This is used to enqueue/localize for the front end

add_action( 'wp_enqueue_scripts', 'your_function_front' );
your_function_front() {
     wp_localize_script('scripts', 'myAjax', array(
         'root_url' => get_site_url(),
         'ajaxurl'  => admin_url( 'admin-ajax.php' ),
         'nonce'    => wp_create_nonce('wp_rest')
     ));
}

But for the backend you have to also add:

add_action( 'admin_enqueue_scripts', 'your_function_admin' );
your_function_admin() {
     wp_localize_script('scripts', 'myAjax', array(
         'root_url' => get_site_url(),
         'ajaxurl'  => admin_url( 'admin-ajax.php' ),
         'nonce'    => wp_create_nonce('wp_rest')
     ));
}

So if it works in the front end, then you've probably done the first one correctly, and you now just have to do it for the back end. Just remember to name your functions to something that'll make sense in your plugin/theme.

how to send Ajax request in wordpress backend

About