Как отправить текст со входа, используя twilio и svelte?

Я вижу много документов для этого, но ничего javascript. Здесь играет роль мой недостаток знаний, так что простите меня. Я хочу отправить простой текст на номер телефона, который вводится в поле ввода. У меня настроена бессерверная функция, но я не знаю, как передать ей номер телефона, кроме того, я пытался написать ей почтовый запрос, но я должен быть далеко. Возможно ли то, что я делаю?

let phoneNumber;

const handleSendText = () => {
    fetch("https://svelte-service-xxxx.twil.io/sms", {
      method: "post",
      body: "This is a test",
      headers: {
        "Content-Type": "application/json",
      },
      to: JSON.stringify(phoneNumber),
      from: "+xxxxxxxxxxx",
    })
      .then((response) => {
        if (!response.ok) {
          throw new Error("failed");
        }
      })
      .catch((err) => {
        console.info(err);
      });
  };

 <input type = "text" placeholder = "phone number" />
 <button on:click = {handleSendText}>Send</button>
Как сделать HTTP-запрос в Javascript?
Как сделать HTTP-запрос в Javascript?
В JavaScript вы можете сделать HTTP-запрос, используя объект XMLHttpRequest или более новый API fetch. Вот пример для обоих методов:
Создание ресурсов API Laravel: Советы по производительности и масштабируемости
Создание ресурсов API Laravel: Советы по производительности и масштабируемости
Создание API-ресурса Laravel может быть непростой задачей. Она требует глубокого понимания возможностей Laravel и лучших практик, чтобы обеспечить...
Как создать простое погодное приложение на Python с API OpenWeatherMap
Как создать простое погодное приложение на Python с API OpenWeatherMap
Этот учебник проведет вас через процесс создания простого погодного приложения с помощью Python и OpenWeatherMap API.
Пакеты Java
Пакеты Java
Пакет java - это группа классов, интерфейсов и подпакетов схожего типа. Думайте об этом как о папке в каталоге файлов. Мы используем пакеты, чтобы...
Как использовать API парсинга квитанций с помощью JavaScript за 5 минут?
Как использовать API парсинга квитанций с помощью JavaScript за 5 минут?
В этом руководстве вы узнаете, как использовать API парсинга квитанций за 5 минут с помощью JavaScript. Eden AI предоставляет простой и удобный для...
0
0
30
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вам потребуется привяжите значение <input> к переменной в вашем скрипте.

<script>
let phoneNumber = "";

const handleSendText = () => { // we'll come back to this };
</script>

<input type = "text" placeholder = "phone number" bind:value = {phoneNumber} />
<button on:click = {handleSendText}>Send</button>

Это делает так, что когда вы меняете значение на входе, оно обновляет переменную phoneNumber.

Теперь в вашей функции handleSendText вам нужно отправить все параметры в body запроса. Обратите внимание, что в следующем коде body содержит все параметры, которые вы хотите отправить, в одном строковом объекте JSON.

const handleSendText = () => {
  fetch("https://svelte-service-9106.twil.io/sms", {
    method: "POST",
    body: JSON.stringify({
      to: phoneNumber,
      from: "+18035298025"
    }),
    headers: {
      "Content-Type": "application/json",
    }
  })
  .then((response) => {
    if (!response.ok) {
      throw new Error("failed");
    } else {
      console.info("Success!");
    }
  })
  .catch((err) => {
    console.info(err);
  });
};

Затем в вашей функции Twilio вы сможете получить доступ к параметрам, которые вы отправляете в объекте event. В этом случае у вас будут event.to и event.from.

Другие вопросы по теме