1

¿Es posible controlar un bot de Telegram con javascript? Intento realizar un XMLHttpRequest() desde Chrome, para obtener un archivo .json desde la API de Telegram. Supongo que no puede ser por el método GET, pues la url contiene datos sensibles (Token), pero el objetivo es obtener, no enviar, un JSON. No logro obtener nada en la respuesta, o el código está muy mal, necesito que funcione desde el lado cliente, para enviar un mensaje de prueba al bot:

<div id="objeto"></div>
<div id="error"></div>

<script>
var objeto = document.getElementById('objeto');
var error = document.getElementById('error');

//Visualizar resultados
function display(obj, sp) {
 for (n in obj) {
  if (typeof obj[n] == 'object') {
   display(obj[n], n + ".");
  }else{
   objeto.innerHTML+= "<span>" + sp + n + ": " + obj[n] + "</span><br />";
  }
 }
}

//Preparación de la solicitud
var req = new XMLHttpRequest();
req.overrideMimeType("application/json");
req.onreadystatechange = function () {

    if (req.readyState === 4)
    if  (req.status == "200") {

        req.responseType = 'json';
        var obj = JSON.parse(req.responseText);
        display(obj,""); //Llamada mostrar resultados

    } else {
            error.innerText = "Error, estado de solicitud:  " + req.status + ".";
        }
};

req.open('POST', 'https://api.telegram.org/botTOKEN/getUpdates', true);
req.send(null); //null, o es necesario enviar getUpdates?
</script>

Los elementos que se obtendrían en este caso son: JSON

{
    "ok": true,
    "result": [
    {
        "update_id": 000000000,
        "message": {
            "message_id": 2,
            "from": {
                "id": 000000000,
                "is_bot": false,
                "first_name": " ",
                "last_name": " ",
                "username": " ",
                "language_code": "es"
            },
            "chat": {
                "id": 000000000,
                "first_name": " ",
                "last_name": " ",
                "username": " ",
                "type": " "
            },
            "date": 0000000000,
            "text": "Hola"
        }
    }]
}

Entonces la cuestión sería:

A. Como organizar el código javascript correctamente para que obtenga datos de esa API?, y

B. Es correcta esa forma de separar los componentes obtenidos? Obviamente se necesita un servidor pero quiero realizar pruebas del lado cliente, específicamente en Chrome para android. Que me recomiendas?

2 respuestas 2

1

El request getUpdates de Telegram es GET, y puede ser llamado con JavaScript desde el cliente, este es un ejemplo con fetch que es mas corto que XMLHttpRequest.

fetch('https://api.telegram.org/botTOKEN/getUpdates')
  .then(response => response.json())
  .then(data => display(data,""));

Respecto de como mostrarlo, no veo que nada mal en tu función display().

4
  • Realmente deceo lograrlo, gracias @Emeeus. Probaré tu código, hermano. Lo digo no porque dude de usted, sino porque he buscado y buscado, y nada. Incluso en MDN, que encontré uno y con mucha ilusión lo probé hoy desde la madrugada, y todo el día realizando pruebas. Terminé pensando que algo anda mal con mi móvil, porque como es posible que no funcione algo que se comparte en esa web? No es lógico para mí! Te dejaré otro comentario para que veas el "bosquejo" que quedó del código, 😅 jaja. Claro, no es el original ya, todo un rompecabezas dejé. Mira...
    – Triplex
    Commented el 3 dic. 2021 a las 22:45
  • var requestURL = './getUpdates.json'; //var requestURL = 'api.telegram.org/botTOKEN/getUpdates'; var req = new XMLHttpRequest(); req.open('GET', requestURL); req.responseType = 'json' req.send(); req.onreadystatechange = estado; function estado() { var myfile = req.response; //if (req.readyState === 4) if (req.status == 0) { //200 ok //var obj = JSON.parse(myfile); display(obje,""); lert(myfile); //null ~( :-{( //opciones(obje); } else { error.innerText = "Error, estado de solicitud: " + req.status + "."; } }
    – Triplex
    Commented el 3 dic. 2021 a las 23:02
  • Quizá el token no es correcto, ese código con mí token ha funcionado, fíjate que en la última parte utilice la función que has definido, no te olvides de incluirla.
    – Emeeus
    Commented el 3 dic. 2021 a las 23:26
  • Funcionó PERFECTOOOO! Muchísimas gracias @Emeeus. Lo que aún no comprendo es por qué el XMLHttpRequest no me funcionó, pero ya no lo necesito, gracias a tu ayuda y tiempo. Gracias gracias gracias....
    – Triplex
    Commented el 4 dic. 2021 a las 0:16
0

Gracias al apoyo de @Emeeus, éste es el código que logré y es funcional: √

<!DOCTYPE HTML>
<html>
<head>

<meta charset="UTF-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<title>Bosquejo</title>

</head>
<body>

<div id="objeto" style="font-size: 12px"></div>
<div id="error"></div>

<script>
var objeto = document.getElementById('objeto');
var error = document.getElementById('error'); //No implementado aún

function display(obj, sp) {
 for (n in obj) {
  if (typeof obj[n] == 'object') {
   display(obj[n], n + ".");
  }else{

   objeto.innerHTML+= "<span>" + sp + n + ": " + obj[n] + "</span><br />";
  }
 }
}

//var requestURL = './getUpdates.json'; //Para archivos locales

//Por @Emeeus
fetch('https://api.telegram.org/botELTOKENAQUÍ/getUpdates')
.then(response => response.json())
.then(data => display(data,""));
</script>

</body>
</html>

Y ahora, a realizar nuevas funciones y pruebas!

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.