Запросы без перезагрузки страницы.

Запросы без перезагрузки страницы. Проблемы связанные с Cross

Если у вас страница и бэк находятся на одном домене, то можно посылать ajax запросы, используя jQuery. Однако, могу ошибаться, но ajax не поддерживает кросс доменные запросы. Поэтому мне пришлось разбираться с fetch.

Примечание: если вам придется отказаться от ajax, но при этом нужно использовать jQuery, то можете использовать slim версию. В ней ajax нет.

Вот статья https://developer.mozilla.org/ru/docs/Web/API/Fetch_API/Using_Fetch

Вот примерный код. Примечание: код взят из статьи, но для получения статуса и тела ответа пришлось его доработать. Это место отмечено комментарием

        let send_url = "https://392b-178-178-229-10.ngrok-free.app/api/bitrix-24/sdf/get-payments";

        // Пример отправки POST запроса:
        async function postData(url = "", data = {}) {
            // Default options are marked with *
            const response = await fetch(url, {
                method: "POST", // *GET, POST, PUT, DELETE, etc.
                headers: {
                    "Content-Type": "application/json",
                    "Accept":"application/json",
                },
                referrerPolicy: "no-referrer", // no-referrer, *client
                body: JSON.stringify(data), // body data type must match "Content-Type" header
            });
            //здесь пришлось доработать
            return  {"status":await response.status,"data": await response.json()}; // parses JSON response into native JavaScript objects
        }

        function getPayments() {
            let send_data = {
                name: $('#name').val(),
                last_name: $('#last_name').val(),
                second_name: $('#second_name').val(),
                contract_number: $('#contract_number').val(),
            };

            try {
                postData(send_url, send_data).then((response) => {
                    console.log(response.status);
                    console.log(response.data);
                    return;
                });
            } catch (error) {
                alert("Что то пошло не так.");
            }

        }