Wordpress AJAX request on admin-ajax.php gives error 400

Question

I'm trying to create a Wordpress plugin that will receive a simple AJAX request and, for the moment, just post its body. My code is:

File /wp-content/plugins/prova/prova.php:

<?php

/**
 * Plugin Name:       My Basics Plugin
 * Plugin URI:        https://example.com/plugins/the-basics/
 * Description:       Handle the basics with this plugin.
 */

function risposta_mia_azione() {
  $param = $_POST["param"];
  echo $param;
  wp_die();
}

/**
 * Register the "book" custom post type
 */
function pluginprefix_setup_post_type() {
} 
add_action( 'init', 'pluginprefix_setup_post_type' );

/**
* Activate the plugin.
*/
function pluginprefix_activate() { 
}
register_activation_hook( __FILE__, 'pluginprefix_activate' );

/**
 * Deactivation hook.
 */
function pluginprefix_deactivate() {
}
register_deactivation_hook( __FILE__, 'pluginprefix_deactivate' );

/**
 * Uninstallation hook.
 */
function pluginprefix_uninstall() {

}
register_uninstall_hook( __FILE__, 'pluginprefix_uninstall' );


add_action("wp_ajax_nopriv_mia_azione", "risposta_mia_azione");

?>

And the root of my Wordpress installation is http://123.compute.amazonaws.com/wordpress/. Now, if I open the dev tools console inside a page of that installation and paste the following jQuery ajax call I will get a POST http://132.compute.amazonaws.com/wordpress/wp-admin/admin-ajax.php 400 (Bad Request):

(function( $ ) {
$.ajax({
    url : 'http://123.compute.amazonaws.com/wordpress/wp-admin/admin-ajax.php',
    data : {"action" : "mia_azione", "param" : "ciao"},
    method : 'POST',
    success : function( response ){ console.log(response) },
    error : function(error){ console.log(error) }
  })
})(jQuery)

I haven't touched Wordpress in years and I'm quite unfamiliar with the under-the-hood of Wordpress, from what I read in similar questions this is usually the case when the request in incorrectly formed, but I can't really see my error. For instance, a call like:

ajaxresponse = await fetch("http://ec2-3-129-17-101.us-east-2.compute.amazonaws.com/wordpress/wp-admin/admin-ajax.php", {
    method: 'POST', mode: 'no-cors',
    headers: {
      'Content-Type': 'application/json'
      // 'Content-Type': 'application/x-www-form-urlencoded',
    },
    body: JSON.stringify({action: "mia_azione", param: "ciao"}) 
  });

will give me a response like:

body: ReadableStream
bodyUsed: true
headers: Headers {}
ok: false
redirected: false
status: 400
statusText: "Bad Request"
type: "basic"
url: "http://123.compute.amazonaws.com/wordpress/w

May anyone help me?

EDIT: as pointed out by the response, I was using the wrong functionality - what I needed was this: https://developer.wordpress.org/rest-api/extending-the-rest-api/adding-custom-endpoints/

Maybe this post can help you: https://stackoverflow.com/questions/43557755/how-to-call-ajax-in-wordpress — Bernhard Beatus, Apr 13 '21 at 18:41
@cabrerahector you're right, I didn't post the full code, I'll correct it. By the way yes, I did activate it — Fed C, Apr 13 '21 at 19:11
@BernhardBeatus thank you! I tried copypasting the ajax calls in the console editing only the action and the url but the result is always the same. The url appears to be correct though — Fed C, Apr 13 '21 at 19:16
When I said "dumb question" I meant mine, not yours :P Didn't mean to offend. — cabrerahector, Apr 13 '21 at 19:21
Please share more details, like the full and exact error message — Nico Haase, Apr 14 '21 at 11:40
@NicoHaase thanks, I just updated the question with my last call and error message. — Fed C, Apr 14 '21 at 13:42

score 1 · Accepted Answer · answered Apr 14 '21 at 11:38

1

Maybe you need something like this:

function my_enqueue() {
      wp_enqueue_script( 'ajax-script', get_template_directory_uri() . '/js/my-ajax-script.js', array('jquery') );
      wp_localize_script( 'ajax-script', 'my_ajax_object', array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
 }
 add_action( 'wp_enqueue_scripts', 'my_enqueue' );

answered Apr 14 '21 at 11:38

Bernhard Beatus

1,191
1
5
6

That was the issue indeed: using the AJAX functionality requires the javascript part to be managed by the same Wordpress installation - a call from the console would be missing all data added my real need was to use the REST API functionality on the likes of the 'rest_api_init' hook. For more information: https://developer.wordpress.org/rest-api/extending-the-rest-api/adding-custom-endpoints/ – Fed C Apr 14 '21 at 15:01

Wordpress AJAX request on admin-ajax.php gives error 400

1 Answers1