Cómo eliminar un SMS en Javascript

La forma más sencilla de eliminar SMS desde JavaScript es utilizar la API HTTP/Rest de SMS integrada de Ozeki SMS Gateway. Cuando uses esta API, eliminarás mensajes SMS enviando una solicitud HTTP POST al gateway de SMS. La solicitud HTTP POST devolverá una respuesta HTTP 200 OK a tu solicitud, junto con el/los ID(s) del/los mensaje(s) que han sido eliminados.

cómo eliminar un sms en javascript
Figura 1 - Cómo eliminar un SMS en Javascript

Código JavaScript para eliminar SMS a móvil

El ejemplo de código JavaScript para SMS a continuación demuestra cómo puedes eliminar mensajes SMS utilizando la API REST HTTP de Ozeki SMS Gateway con la biblioteca JavaScript Ozeki.Libs.Rest. Esta biblioteca se te proporciona gratuitamente y puedes usarla y modificarla en cualquiera de tus proyectos.

DeleteSms.php 
<?php
    header("Access-Control-Allow-Origin: *");
    header('Access-Control-Allow-Credentials: true');
    header('Access-Control-Max-Age: 86400');
    header("Access-Control-Allow-Headers: Authorization, Accept, Content-Type");
    header("Access-Control-Allow-Methods: GET, POST, OPTIONS"); 
?>

<!DOCTYPE html>
<html lang="en">
    <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>Eliminar SMS con Ozeki SMS Gateway</title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
        <link rel="stylesheet" href="DeleteSms.css">
    </head>
    <body>

        <div class="form-container">
            <b>ID:</b>
            <input class="form-control" type="text" id="ID" placeholder="fcfaf789-1bb9-bad2-9486-f68be5e1d065">
            <b>Carpeta:</b>
            <select class="form-select" id="folder">
                <option value="inbox">Bandeja de entrada</option>
                <option value="outbox">Bandeja de salida</option>
                <option value="sent">Enviados</option>
                <option value="notsent">No enviados</option>
                <option value="deleted">Eliminados</option>
            </select>
            <button class="btn btn-primary" id="btnDelete">
                <b>ELIMINAR</b>
            </button>
        </div>

        <div class="card log-container">
            <ul class="log" id="container">
                <li class="list-group-item"><b>Registros:</b></li>
            </ul> 
        </div>

        <script type="module">
            import { Configuration, Message, MessageApi, Folder } from "./Ozeki.Libs.Rest.js";

            var btnDelete = document.getElementById("btnDelete");
                        
            var configuration = new Configuration();
            configuration.Username = 'http_user';
            configuration.Password = 'qwe123';
            configuration.ApiUrl = 'http://127.0.0.1:9509/api';

            var api = new MessageApi(configuration);

            btnDelete.addEventListener("click", async function() {
                if (document.getElementById("ID").value != '') {
                    var msg = new Message();
                    msg.ID = document.getElementById("ID").value;
                    
                    var folder;

                    var folderName = document.getElementById('folder').value;

                    if (folderName == 'inbox') {
                        folder = Folder.Inbox;
                    } else if (folderName == 'outbox') {
                        folder = Folder.Outbox;
                    } else if (folderName == 'sent') {
                        folder = Folder.Sent;
                    } else if (folderName == 'notsent') {
                        folder = Folder.NotSent;
                    } else {
                        folder = Folder.Deleted;
                    }

                    let result = await api.Delete(folder, msg);

                    document.getElementById('ID').value = '';
                    document.getElementById('folder').value = 'inbox';

                    document.getElementById('container').innerHTML += `<li class="list-group-item">${result}</li>`;
                }
            });
        </script>
    </body>
</html>

Cómo usar el ejemplo de SMS en JavaScript:

Este ejemplo de SMS en JavaScript puede usarse en cualquier aplicación web. Para usarlo, debes agregar el archivo Ozeki.Libs.Rest.js a tu proyecto. Después de agregarlo, debes incluir la directiva import {MessageApi, Configuration} from './Ozeki.Libs.Rest.js'; en la sección de encabezado de tu código fuente JavaScript. Esto te permitirá usar las clases proporcionadas por la biblioteca Ozeki.Libs.Rest. Puedes usar la clase Message para crear el SMS. Puedes usar la clase MessageApi para enviar el SMS al gateway de SMS. El gateway de SMS reenviará tu mensaje a la red móvil ya sea a través de una conexión inalámbrica o a través de Internet.

Descargar DeleteSms.js

El código fuente explicado en este artículo puede descargarse, usarse y modificarse gratuitamente.
Descargar: DeleteSms.js.zip (5.52Kb)

¿Qué contiene el archivo DeleteSms.js.zip?

El archivo DeleteSms.js.zip contiene la biblioteca Ozeki.Libs.Rest, que te proporciona todas las herramientas necesarias para enviar y recibir mensajes SMS. También encontrarás el proyecto DeleteSms en el zip, que contiene el código de ejemplo para mostrarte cómo enviar un SMS. Este código de ejemplo se muestra a continuación.

directorio de delete sms js
Figura 2 - Qué hay dentro de DeleteSms.js.zip

Cómo eliminar SMS desde JavaScript (Pasos sencillos)

Para eliminar SMS desde JavaScript:

  1. Instala un usuario de API HTTP
  2. Habilita "Registrar eventos de comunicación" en la pestaña Avanzado
  3. Configura WampServer
  4. Descarga y extrae el archivo DeleteSms.js.zip
  5. Coloca el contenido del archivo zip en la carpeta \www\ del wampserver: C:\wamp64\www
  6. Inicia la aplicación Ozeki SMS Gateway
  7. Abre el sitio web escribiendo http://localhost/DeleteSms.php en tu navegador
  8. Después de abrir el sitio web, puedes enviar un SMS haciendo clic en el botón DownloadIncoming
  9. Revisa los registros para ver si el SMS se envió

Instalar Ozeki SMS Gateway y crear un usuario de API HTTP

Para poder enviar SMS desde JavaScript, primero necesitas instalar Ozeki SMS Gateway. El gateway de SMS puede instalarse en la misma computadora donde desarrollas tu código JavaScript en Visual Studio. Después de la instalación, el siguiente paso es conectar Ozeki SMS Gateway a la red móvil. Puedes enviar un SMS de prueba desde la GUI de Ozeki para verificar que tu conexión a la red móvil funcione. El paso final para preparar tu entorno es crear un usuario de API HTTP para SMS. Crea un usuario con el nombre de usuario "http_user" y la contraseña "qwe123" para que el ejemplo funcione sin modificaciones.

Después de configurar el entorno, puedes ejecutar tu código JavaScript.

URL de la API HTTP para eliminar SMS desde JavaScript

Para enviar SMS desde JavaScript, tu código JavaScript tendrá que realizar una solicitud HTTP al gateway de SMS. La URL de la API se muestra a continuación. Ten en cuenta que la dirección IP (127.0.0.1) debe ser reemplazada por la dirección IP de tu gateway de SMS. Si Ozeki SMS Gateway está instalado en la misma computadora donde se ejecuta la aplicación de SMS en JavaScript, puede ser 127.0.0.1. Si está instalado en una computadora diferente, debe ser la dirección IP de esa computadora. 

http://127.0.0.1:9509/api?action=rest

Autenticación HTTP para eliminar SMS desde JavaScript

Para autenticar el cliente de SMS en JavaScript, necesitas enviar el nombre de usuario y la contraseña en una cadena codificada en base64 al servidor en una solicitud HTTP. El formato utilizado es: base64(nombre de usuario+":"+contraseña). En JavaScript puedes usar el siguiente código para hacer esta codificación: 

// Puedes encontrar el codificador Base64 en el archivo Ozeki.Libs.Rest.js 
var usernamePassword = username + ":" + password;
return `Basic ${Base64.encode(usernamePassword)}`;

Por ejemplo, si codificas el nombre de usuario 'http_user' y la contraseña 'qwe123', obtendrás la siguiente cadena codificada en base64: aHR0cF91c2VyOnF3ZTEyMw==. Para enviar

Encabezado de solicitud HTTP para eliminar SMS desde JavaScript

Para enviar los mensajes SMS, necesitas incluir las siguientes líneas como encabezados en la solicitud HTTP. Ten en cuenta que incluimos un tipo de contenido y un encabezado de Autorización. 

Content-Type: application/json
Authorization: Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==

Solicitud HTTP para enviar SMS desde JavaScript

Para enviar el SMS, tu aplicación JavaScript enviará una solicitud HTTP similar a la que se muestra a continuación. Ten en cuenta que esta solicitud contiene una parte de encabezado HTTP y una parte de cuerpo. La parte del cuerpo contiene la carpeta que contiene nuestro(s) mensaje(s) y el/los ID(s) del/los mensaje(s) en una cadena JSON. 

POST /api?action=deletemsg HTTP/1.1
Connection: Keep-Alive
Content-Length: 73
Content-Type: application/json
Authorization: Basic aHR0cF91c2VyOnF3ZTEyMw==
Host: 127.0.0.1:9509
  
{
    "folder":  "inbox",
    "message_ids": [
        "3a922414-458f-4866-a8ee-f053d1132a6b"
    ]
}

Respuesta HTTP recibida por el ejemplo de SMS en JavaScript

Una vez que el gateway de SMS reciba esta solicitud, generará una respuesta HTTP. La respuesta HTTP contendrá un código de estado para indicar si la solicitud de envío de SMS fue exitosa o no. También devolverá una estructura codificada en JSON para proporcionarte detalles útiles sobre el envío del mensaje. 

HTTP/1.1 200 OK
User-Agent: OZEKI 10.3.116 (www.myozeki.com)
Content-Type: application/json; charset=utf8
Last-Modified: Mon, 07 Jun 2021 14:10:25 GMT
Server: 10/10.3.116
Transfer-Encoding: chunked
{
    "http_code": 200,
    "response_code": "SUCCESS",
    "response_msg": "",
    "data": {
        "folder": "inbox",
        "message_ids": [
            "3a922414-458f-4866-a8ee-f053d1132a6b"
        ]
    }
}

Cómo eliminar SMS desde JavaScript usando la API de SMS en JavaScript (Tutorial en video)

Este video te muestra cómo descargar el archivo DeleteSms.js.zip desde esta página. Si ves el video, notarás que el contenido del zip DeleteSms.js se coloca en la carpeta \www\ de WampServer. También verás que ejecutamos WampServer haciendo clic en su ícono dos veces, y después de esto escribimos http://localhost:8080/DeleteSms.php en el navegador web.

Ejemplo de SMS en JavaScript: DeleteSms.js

El código de ejemplo a continuación es parte del archivo PHP DeleteSms.php. Además de eso, verás otros dos archivos llamados DeleteSms.css y Ozeki.Libs.Rest.js.

  • El archivo Ozeki.Libs.Rest.js contiene todas las herramientas necesarias para enviar, eliminar, marcar y recibir mensajes SMS.
  • El DeleteSms.php contiene el código JavaScript, y algunos encabezados que nos permitirán enviar solicitudes HTTP sin errores CORS.
  • El DeleteSms.css contiene la hoja de estilos para la página web.

cómo eliminar sms usando javascript
Figura 3 - DeleteSms.php

Cómo verificar que el SMS ha sido aceptado por el usuario HTTP (Tutorial en video)

Después de enviar el SMS, es una buena idea verificar tu gateway de SMS, para ver qué ha recibido. Puedes revisar el registro abriendo los detalles del usuario HTTP desde la consola de administración de Ozeki SMS Gateway. El siguiente video te muestra qué buscar. El video comenzará con el código abierto y terminará con los detalles del mensaje enviado. Aprenderás cómo lanzar el proyecto, cómo se ve el proyecto durante su ejecución y cómo se ve el archivo de registro después. El video dura solo 42 segundos y es fácil de entender. No tendrás problemas para seguirlo.

Video 2 - Cómo eliminar SMS con el código JavaScript anterior (Tutorial en video)

Reflexiones finales

El artículo anterior muestra los pasos para eliminar mensajes SMS en un programa JavaScript usando el usuario HTTP de Ozeki SMS Gateway. Mantener tu almacenamiento de mensajes equilibrado y limpio es importante si tienes que manejar muchos mensajes SMS diariamente y quieres mantenerte profesional. Gestionar Ozeki SMS Gateway es sencillo con códigos JavaScript, y ofrece varias capacidades de informes para proporcionar más información sobre la conexión SMS.

Continúa tus estudios, aprende más sobre temas como la API de SMS en JavaScript en el sitio web de Ozeki. Es beneficioso leer el tutorial sobre Cómo descargar la última biblioteca de API de SMS en JavaScript desde Github.

¡La siguiente tarea es descargar Ozeki SMS Gateway y comenzar a trabajar!

More information