Jak naplánovat SMS v JavaScriptu

Nejjednodušší způsob, jak odeslat naplánovanou SMS z JavaScriptu, je použít vestavěné HTTP/Rest SMS API Ozeki SMS Gateway. Když použijete toto API, budete odesílat SMS zprávy odesláním HTTP Post požadavku na SMS bránu. HTTP Post požadavek bude obsahovat zprávu ve formátu JSON. SMS brána odešle tuto SMS příjemci a vrátí HTTP 200 OK odpověď na váš požadavek.

jak naplánovat sms v javascriptu
Obrázek 1 - Jak naplánovat SMS v JavaScriptu

JavaScript kód pro odeslání naplánované SMS na mobil

Ukázka kódu JavaScriptu pro SMS níže ukazuje, jak můžete odesílat naplánované SMS zprávy pomocí HTTP REST SMS API Ozeki SMS Gateway s využitím knihovny JavaScript Ozeki.Libs.Rest. Tato knihovna je poskytována zdarma a můžete ji používat a upravovat v jakémkoli z vašich projektů.

SendScheduledSms.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>Odeslání naplánované SMS s 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="SendScheduledSms.css">
    </head>
    <body>

        <div class="form-group form-container">
            <b>ToAddress:</b>
            <input class="form-control" type="text" id="ToAddress" placeholder="+36201111111">
            <b>Text:</b>
            <input class="form-control" type="text" id="Text" placeholder="Ahoj světe!">
            <b>TimeToSend:</b>
            <input class="form-control" type="text" id="TimeToSend" placeholder="2021-07-30 10:00:00">
            <button class="btn btn-primary" id="btnSend">
                <b>ODESLAT</b>
            </button>
        </div>

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

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

            var btnSend = document.getElementById("btnSend");
                        
            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);

            btnSend.addEventListener("click", async function() {
                if (document.getElementById("ToAddress").value != '' && document.getElementById("Text").value != '' && document.getElementById('TimeToSend').value)
                {
                    var msg = new Message();

                    var datetime = (document.getElementById('TimeToSend').value).split(' ');
                    var date = datetime[0].split('-');
                    var time = datetime[1].split(':');

                    msg.ToAddress = document.getElementById("ToAddress").value;
                    msg.Text = document.getElementById("Text").value;
                    msg.TimeToSend = new Date(Date.UTC(date[0], (parseInt(date[1].replace('0', ''))-1),
                     date[2], time[0], time[1], time[2]));

                    let result = await api.Send(msg);

                    document.getElementById("ToAddress").value = '';
                    document.getElementById("Text").value = '';
                    document.getElementById('TimeToSend').value = '';

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

Jak používat příklad JavaScriptu pro SMS:

Tento příklad JavaScriptu pro SMS lze použít v jakékoli webové aplikaci. Pro použití je nutné přidat Ozeki.Libs.Rest.js do vašeho projektu. Poté, co je přidán do vašeho projektu, musíte vložit direktivu import {MessageApi, Message, Configuration} from './Ozeki.Libs.Rest.js'; do hlavičkové části vašeho zdrojového kódu JavaScriptu. To vám umožní používat třídy poskytované knihovnou Ozeki.Libs.Rest. Třídu Message můžete použít k vytvoření SMS. Třídu MessageApi můžete použít k odeslání SMS na SMS bránu. SMS brána přepošle vaši zprávu do mobilní sítě buď prostřednictvím bezdrátového připojení nebo přes internet.

Stáhnout SendScheduledSms.js

Zdrojový kód vysvětlený v tomto článku lze stáhnout, použít a upravit zdarma.
Stáhnout: SendScheduledSms.js.zip (5.59Kb)

Co je v souboru SendScheduledSms.js.zip?

Soubor SendScheduledSms.js.zip obsahuje knihovnu Ozeki.Libs.Rest, která vám poskytuje všechny nástroje potřebné pro odesílání a přijímání SMS zpráv. Najdete zde také projekt SendScheduledSms, který obsahuje ukázkový kód, který vám ukáže, jak odeslat SMS. Tento ukázkový kód je uveden níže.

adresář pro odesílání naplánovaných sms v js
Obrázek 2 - Co je uvnitř SendScheduledSms.js.zip

Jak odeslat SMS z JavaScriptu (Jednoduchý návod)

Pro odeslání SMS z JavaScriptu:

  1. Nainstalujte HTTP API uživatele
  2. Povolte Logování komunikačních událostí na záložce Pokročilé
  3. Nastavte WampServer
  4. Stáhněte a rozbalte soubor SendScheduledSms.js.zip
  5. Vložte obsah zip souboru do složky \www\ wampserveru: C:\wamp64\www
  6. Spusťte aplikaci Ozeki SMS Gateway
  7. Otevřete webovou stránku zadáním http://localhost/SendScheduledSms.php do prohlížeče
  8. Po otevření webové stránky můžete odeslat SMS kliknutím na tlačítko Odeslat
  9. Zkontrolujte logy, zda byla SMS odeslána

Instalace Ozeki SMS Gateway a vytvoření HTTP API uživatele

Pro odesílání SMS z JavaScriptu je nejprve nutné nainstalovat Ozeki SMS Gateway. SMS bránu lze nainstalovat na stejný počítač, kde vyvíjíte svůj JavaScriptový kód ve Visual studiu. Po instalaci je dalším krokem připojení Ozeki SMS Gateway k mobilní síti. Můžete odeslat testovací SMS z Ozeki GUI pro ověření, že vaše připojení k mobilní síti funguje. Posledním krokem přípravy prostředí je vytvoření HTTP SMS API uživatelského účtu. Vytvořte uživatele s uživatelským jménem "http_user" a heslem "qwe123", aby příklad fungoval bez úprav.

Po nastavení prostředí můžete spustit svůj JavaScriptový kód.

HTTP API URL pro odesílání SMS z JavaScriptu

Pro odesílání SMS z JavaScriptu musí váš JavaScript odeslat HTTP požadavek na SMS bránu. API URL je uvedeno níže. Poznámka: IP adresa (127.0.0.1) by měla být nahrazena IP adresou vaší SMS brány. Pokud je Ozeki SMS Gateway nainstalován na stejném počítači, kde běží JavaScriptová SMS aplikace, může to být 127.0.0.1. Pokud je nainstalován na jiném počítači, měla by to být IP adresa tohoto počítače. 

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

HTTP autentizace pro odesílání SMS z JavaScriptu

Pro autentizaci JavaScriptového SMS klienta je nutné odeslat uživatelské jméno a heslo v base64 kódovaném řetězci na server v HTTP požadavku. Použitý formát je: base64(username+":"+password). V JavaScriptu můžete pro toto kódování použít následující kód: 

// Base64 enkodér najdete v souboru Ozeki.Libs.Rest.js 
var usernamePassword = username + ":" + password;
return `Basic ${Base64.encode(usernamePassword)}`;

Například, pokud zakódujete uživatelské jméno 'http_user' a heslo 'qwe123', získáte následující base64 kódovaný řetězec: aHR0cF91c2VyOnF3ZTEyMw==. Pro odeslání

HTTP hlavička požadavku pro odesílání SMS z JavaScriptu

Pro odeslání SMS zpráv je nutné do HTTP požadavku zahrnout následující řádky jako hlavičky. Poznámka: zahrnujeme hlavičku Content-Type a Authorization. 

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

HTTP požadavek pro odesílání SMS z JavaScriptu

Pro odeslání SMS váš JavaScriptový požadavek odešle HTTP požadavek podobný tomu níže. Poznámka: tento požadavek obsahuje část HTTP hlavičky a část HTTP těla. HTTP tělo je JSON kódovaný datový řetězec. Obsahuje číslo příjemce, text zprávy a čas, kdy chceme zprávu odeslat. 

POST /api?action=sendmsg HTTP/1.1
Connection: close
Content-Length: 418
Content-Type: text/plain;charset=UTF-8
Accept: */*
Authorization: Basic aHR0cF91c2VyOnF3ZTEyMw==
Host: 127.0.0.1:9509
User-Agent: node-XMLHttpRequest

{
	"messages": [ 
		{
			"message_id": "d4420450-3db1-1452-91eb-1145b2126495",
			"to_address": "+36201111111",
			"text": "Hello world!",
			"create_date": "2021-07-30T13:04:49",
			"vaild_date": "2021-08-06T13:04:49",
			"time_to_send": "2021-07-30T14:00:00",
			"submit_report_requested": true,
			"delivery_report_requested": true,
			"view_report_requested": true
		}
	]
}

HTTP odpověď přijatá JavaScriptovým SMS příkladem

Jakmile SMS brána obdrží tento požadavek, vygeneruje HTTP odpověď. HTTP odpověď bude obsahovat stavový kód, který indikuje, zda byl požadavek na odeslání SMS úspěšný nebo ne. Také vrátí JSON kódovanou strukturu s užitečnými detaily o odeslání zprávy. 

HTTP/1.1 200 OK
User-Agent: OZEKI 10.3.123 (www.myozeki.com)
Content-Type: application/json; charset=utf8
Last-Modified: Fri, 30 Jul 2021 12:58:47 GMT
Server: 10/10.3.123
Transfer-Encoding: chunked

{
	"http_code": 200,
	"response_code": "SUCCESS",
	"response_msg": "Messages queued for delivery.",
	"data": {
	  "total_count": 1,
	  "success_count": 1,
	  "failed_count": 0,
	  "messages": [
	    {
	      "message_id": "d4420450-3db1-1452-91eb-1145b2126495",
	      "from_station": "%",
	      "to_address": "+36201111111",
	      "to_station": "%",
	      "text": "Hello world!",
	      "create_date": "2021-07-30 13:04:49",
	      "valid_until": "2021-08-06 13:04:49",
	      "time_to_send": "2021-07-30 14:00:00",
	      "submit_report_requested": true,
	      "delivery_report_requested": true,
	      "view_report_requested": false,
	      "tags": [
	        {
	          "name": "Type",
	          "value": "SMS:TEXT"
	        }
	      ],
	      "status": "SUCCESS"
	    }
	  ]
	}
}
Jak odeslat naplánovanou SMS z JavaScriptu pomocí JavaScript SMS API (Video návod)

Toto video vám ukáže, jak stáhnout soubor SendScheduledSms.js.zip z této stránky. Pokud se podíváte na video, všimnete si, že obsah souboru SendScheduledSms.js zip je umístěn do složky \www\ WampServeru. Uvidíte také, že WampServer spustíme dvojitým kliknutím na jeho ikonu a poté do webového prohlížeče napíšeme http://localhost:8080/SendScheduledSms.js.

Video 2 - Jak stáhnout a spustit ukázkový projekt (Video návod)

JavaScript SMS příklad: SendScheduledSms.js

Níže uvedený ukázkový kód je součástí PHP souboru SendScheduledSms.php. Kromě toho uvidíte další dva soubory s názvem SendScheduledSms.css a Ozeki.Libs.Rest.js.

  • Soubor Ozeki.Libs.Rest.js obsahuje všechny potřebné nástroje pro odesílání, mazání, označování a přijímání SMS zpráv.
  • SendScheduledSms.php obsahuje javascriptový kód a některé hlavičky, které nám umožní odesílat HTTP požadavky bez chyb CORS.
  • SendScheduledSms.css obsahuje stylopisy pro webovou stránku.

jak odeslat naplánovanou sms pomocí javascriptu
Obrázek 3 - SendScheduledSms.php

Jak zkontrolovat, že SMS byla přijata HTTP uživatelem (Video návod)

Po odeslání SMS je dobré zkontrolovat vaši SMS bránu, abyste viděli, co přijala. Protokol můžete zkontrolovat otevřením podrobností HTTP uživatele v konzoli pro správu Ozeki SMS Gateway. Následující video vám ukáže, na co se zaměřit. Video začne otevřeným kódem a skončí podrobnostmi o odeslané zprávě. Naučíte se, jak projekt spustit, jak projekt vypadá během běhu a jak vypadá soubor protokolu po jeho dokončení. Video je dlouhé pouze 42 sekund a je snadno srozumitelné. Nebudete mít problém jej sledovat.

Video 3 - Jak odeslat SMS pomocí výše uvedeného JavaScriptového kódu (Video návod)

Shrnutí

Tento článek vysvětlil, jak vytvořit řešení pro plánování SMS v JavaScriptu s pomocí HTTP uživatele Ozeki SMS Gateway. Pokud jste vše pečlivě přečetli, plánování SMS by mělo být velmi snadné. Plánování SMS je výhodné, protože sdílíte informace se zákazníky v době, kdy mají čas věnovat vaší zprávě pozornost. Díky tomu bude hromadný SMS marketing efektivnější a oslovíte více lidí.

Další informace najdete na webu Ozeki a pokračujte ve čtení. Podívejte se na jak přijímat SMS v JavaScriptu, což vám může pomoci organizovat úložiště zpráv.

Stáhněte si Ozeki SMS Gateway nyní a uvidíte změnu!

More information