Wordpress admin-ajax gives 404 error in frontend but not in admin

Question

MAJOR EDIT: rephrased the title and re-wrote a chunk of the question as I've realized the error actually happens site-wide on the frontend

This one has been a major head-scratcher for the last day.

I'm trying to resolve an error on a website, where a section is failing to populate with posts. It is pulling post details using WP's native ajax and failing with a 404 error, although the shown address for admin_ajax.php is correct.
Ajax is working correctly on the admin side (able to edit and post without problems), but fails with 404 error on the frontend (both for authenticated and un-authenticated users).

All XMLHttpRequest calls are built exactly according to the WP documentation via script localization, wp_ajax and wp_ajax_nopriv action hooking, and all request strings are built with the nonce security key and all the needed things.

No error outputs other than my own javascript alert dialog and the 404 error (nothing in WP error log or server error log).
File permissions are the same (644). It has worked for the last months and suddenly randomly stopped. I've tried replacing all core WP files to correct any possible tampering and disable all plugins one by one but nothing corrected the error.

• Main website: https://www.ars-id.org/
• Section example that produces the error: https://www.ars-id.org/evento/

Functions hook for ajax call

add_action('wp_ajax_geteventlist','ajax_event_list');
add_action('wp_ajax_nopriv_geteventlist','ajax_event_list' );

function ajax_event_list() {
    check_ajax_referer( 'my-ajax-secret', 'security' );
    echo "<div>HERE WE ARE</div>";
    wp_die();
}

Script is localized using

wp_enqueue_script('my-events', get_template_directory_uri().'/js/events.js', array(), null, true );

wp_localize_script( 'my-events', 'my_ajax', array('url' => admin_url('admin-ajax.php'),'security' => wp_create_nonce( 'my-ajax-secret')));

Javascript call

function getEventList(offset) {
    var request = new XMLHttpRequest();

    request.open('POST', my_ajax.url, true);
    request.timeout = requestTimeout;
    request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;');
request.onload = function () {
        if (this.status >= 200 && this.status < 400) {
            // populate document body
        } else {
            // If fail
            alert("An error ocurred while fetching event list. Please try again");
        }
};
    var reqString = '&action=geteventlist&security='+my_ajax.security+'&e_offset='+offset;
    request.send(reqString);
}

Answer 1

A quick look at the Network tab of browser devtools shows that your 404-generating request is to https://www.ars-id.org/wp-admin/admin-ajax.php , and that the payload is a form-post with these parameters.

action=geteventlist
security=43cafe1234     (redacted)
e_offset=0

That means you need a WordPress action named wp_ajax_nopriv_geteventlist to process the request for a not-logged-in user, and a separate action named wp_ajax_geteventlist for logged-in users. You didn't show us that code, so it's hard to guess why you get 404. (Missing actions generate 400.)

When you visit your top-level page (not the evento page) the browser does not send any request to admin-ajax, hence it doesn't fail.