Преобразование вызова ajax в вызов API fetch и извлечение информации в функцию php

Question

Я пытаюсь преобразовать вызов .ajax в вызов выборки. Ajax работает, но при извлечении данных из моего php-файла wordPress выборка выдает ошибку 500.

Я довольно новичок в получении API, и поэтому я пытаюсь его изучить. Я посмотрел на MDN, WordPress сайт на пользовательских хуков и остальные API, искал в Интернете и искал переполнение стека. Все, о чем они говорят, - это Аякс. Я не знаю, правильно ли я использую поисковую фразу, но я пытался понять это часами и разочаровался.

//working ajax in js file
createLike() {
    $.ajax({
        url: `${universityData.root_url}/wp-json/university/v1/manageLike`,
        type: 'POST',
        data: {'professorId' : 789},
        success: response => {
            console.log(response);
        },
        error: response => {
            console.log(response);
        }
    });

//my conversion to fetch
createLike() {
            const data = {
                'professorId' : 789,
            };
            fetch(`${universityData.root_url}/wp-json/university/v1/manageLike`, {
                headers: {
                    'X-WP-Nonce' : universityData.nonce,
                    'Content-Type' : 'application/json'
                },
                credentials: 'same-origin',
                method: 'POST', 
                body: JSON.stringify(data),
            }).then(function(response){
                return response.json();
            }).then(response => {
                console.log(response);
            }).catch(err => console.log(`error : ${err}`))
        },

//php file
function createLike($data) {
    $professor = sanatize_text_field($data['professorId']);
    wp_insert_post(array(
        'post_type' => 'like',
        'post_status' => 'publish',
        'post_title' => '3rd PHP Create Post Test',
        'meta_input' => array(
            'liked_professor_id' => $professor
        )
    ));
}

function universityLikeRoutes() {
register_rest_route('university/v1', 'manageLike', array(
    'methods' => 'POST',
    'callback' => 'createLike',
));

}

add_action('rest_api_init', 'universityLikeRoutes');

моя ошибка

{code: "internal_server_error", message: "The site is experiencing technical difficulties.", data: {…}, additional_errors: Array(0)}
additional_errors: []
code: "internal_server_error"
data: {status: 500}
message: "The site is experiencing technical difficulties."
__proto__: Object

Answer 1

Ключ к пониманию того, что $.ajax() делает иначе, чем fetch, и, следовательно, как вы должны обрабатывать данные по-другому в WordPress.

$.ajax принимает все, что вы передаете опции data, и по умолчанию преобразуется в тип application/x-www-form-urlencoded MIME. $_POST в PHP автоматически декодирует имена переменных индексированной формы , которые объект WP_REST_Request делает доступными вам в вашем обратном вызове в качестве аргумента $data.

fetch отличается по нескольким причинам, вы можете прочитать об этом в нескольких статьях онлайн, таких как this . Одна вещь, которую вы делаете по-другому, - это передача сериализованной строки JSON, и вы сообщаете своей конечной точке, что тип данных application/json. API wp-json по умолчанию не анализирует эти данные за вас. Но вы все равно можете получить к нему доступ.

Вместо использования $data в качестве аргумента обратного вызова измените его на WP_REST_Request объект. Затем вы можете вызвать метод get_json_params и получить доступ к любому телу, которое вы передали в API таким образом.

Например, измените ваш PHP обратный вызов на следующее:

function createLike( WP_REST_Request $request ) {
    $data = $request->get_json_params();
    $professor = sanitize_text_field( $data['professorId'] );
    wp_insert_post( array(
        'post_type' => 'like',
        'post_status' => 'publish',
        'post_title' => '3rd PHP Create Post Test',
        'meta_input' => array(
            'liked_professor_id' => $professor
        )
    ) );
}