{"id":1091,"date":"2022-11-08T20:45:19","date_gmt":"2022-11-08T20:45:19","guid":{"rendered":"https:\/\/alvochat.com\/blog\/enviar-uma-api-whatsapp-usando-javascript\/"},"modified":"2022-11-13T06:57:34","modified_gmt":"2022-11-13T06:57:34","slug":"how-to-send-whatsapp-api-using-javascript","status":"publish","type":"post","link":"https:\/\/alvochat.com\/blog\/pt-br\/how-to-send-whatsapp-api-using-javascript\/","title":{"rendered":"Enviar uma API WhatsApp usando JavaScript"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Introdu\u00e7\u00e3o<\/h2>\n\n<p>Neste trecho de c\u00f3digo, aprende como enviar uma API WhatsApp usando JavaScript, para enviar uma mensagem de texto, templates WhatsApp, media, bot\u00f5es interactivos, listas, produtos&#8230; etc, \u00e9 necess\u00e1rio ter uma conta Alvochat para executar os seguintes c\u00f3digos. <a href=\"http:\/\/alvochat.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Crie uma conta<\/a>, se n\u00e3o tiver uma.<\/p>\n\n<p><\/p>\n\n<h2 class=\"wp-block-heading\" id=\"first-whatsapp-message-using-curl\">Enviar modelo usando o WhatsApp API e JavaScript<\/h2>\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"name\",\"hello_world\");\nurlencoded.append(\"language\",\"en_us\");\nurlencoded.append(\"header\",\"\");\nurlencoded.append(\"body\",\"\");\nurlencoded.append(\"buttons\",\"\");\nurlencoded.append(\"priority\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/template\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n<\/div>\n<\/div>\n\n<h2 class=\"wp-block-heading\">Enviar uma mensagem de texto utilizando o WhatsApp API e JavaScript<\/h2>\n\n<p><\/p>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"body\",\"WhatsApp API on alvochat.com works good\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"preview_url\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/chat\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<h2 class=\"wp-block-heading\">Enviar imagem<\/h2>\n\n<p><\/p>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"image\",\"https:\/\/alvochat-example.s3-accelerate.amazonaws.com\/image\/1.jpeg\");\nurlencoded.append(\"caption\",\"image caption\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/image\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<h2 class=\"wp-block-heading\">Enviar \u00e1udio<\/h2>\n\n<p><\/p>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"audio\",\"https:\/\/alvochat-example.s3-accelerate.amazonaws.com\/audio\/1.mp3\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/audio\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<h2 class=\"wp-block-heading\">Enviar v\u00eddeo<\/h2>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"video\",\"https:\/\/alvochat-example.s3-accelerate.amazonaws.com\/video\/1.mp4\");\nurlencoded.append(\"caption\",\"video caption\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/video\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<h2 class=\"wp-block-heading\">Enviar documento  <\/h2>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"document\",\"https:\/\/alvochat-example.s3-accelerate.amazonaws.com\/document\/1.pdf\");\nurlencoded.append(\"filename\",\"\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/document\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<h2 class=\"wp-block-heading\">Enviar autocolante<\/h2>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"sticker\",\"https:\/\/alvochat-example.s3-accelerate.amazonaws.com\/sticker\/1.webp\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/sticker\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<h2 class=\"wp-block-heading\">Enviar Contacto<\/h2>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"contact\",\"\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/contact\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<h2 class=\"wp-block-heading\">Enviar local<\/h2>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"lat\",\"37.484296\");\nurlencoded.append(\"lng\",\"-122.148703\");\nurlencoded.append(\"address\",\"Menlo Park, California, United States\");\nurlencoded.append(\"name\",\"Meta Headquarters\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/location\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<h2 class=\"wp-block-heading\">Enviar lista  <\/h2>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"header\",\"header\");\nurlencoded.append(\"body\",\" please select one of the following options\");\nurlencoded.append(\"footer\",\"footer\");\nurlencoded.append(\"button\",\"options\");\nurlencoded.append(\"sections\",\"option_1,option_2,option_3\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/list\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<p><\/p>\n\n<h2 class=\"wp-block-heading\">Bot\u00e3o Enviar  <\/h2>\n\n<p><\/p>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"header\",\"header\");\nurlencoded.append(\"body\",\" please select one of the following options\");\nurlencoded.append(\"footer\",\"footer\");\nurlencoded.append(\"buttons\",\"option_1,option_2,option_3\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/button\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<p><\/p>\n\n<h2 class=\"wp-block-heading\">Enviar produtos  <\/h2>\n\n<pre class=\"wp-block-code\"><code><code data-enlighter-language=\"js\" class=\"EnlighterJSRAW\">var myHeaders = new Headers();\nmyHeaders.append(\"Content-Type\", \"application\/x-www-form-urlencoded\");\n\nvar urlencoded = new URLSearchParams();\nurlencoded.append(\"token\",\"YourToken\");\nurlencoded.append(\"to\",\"16315555555\");\nurlencoded.append(\"header\",\"header\");\nurlencoded.append(\"body\",\"Hi , check out our new products\");\nurlencoded.append(\"footer\",\"footer\");\nurlencoded.append(\"catalog_id\",\"\");\nurlencoded.append(\"product\",\"\");\nurlencoded.append(\"priority\",\"\");\nurlencoded.append(\"message_id\",\"\");\n\n\nvar requestOptions = {\n  method: 'POST',\n  headers: myHeaders,\n  body: urlencoded,\n  redirect: 'follow'\n};\n\nfetch(\"https:\/\/api.alvochat.com\/instance1199\/messages\/product\", requestOptions)\n  .then(response =&gt; response.text())\n  .then(result =&gt; console.log(result))\n  .catch(error =&gt; console.log('error', error));<\/code><\/code><\/pre>\n\n<h2 class=\"wp-block-heading\"><\/h2>\n\n<p>Os c\u00f3digos acima usam Javascript usando<code> fetch<\/code>, se quiser enviar uma API WhatsApp com Javascript usando o <code>XMLHttpRequest<\/code>, pode ver os c\u00f3digos a partir <a href=\"https:\/\/alvochat.com\/docs\/api\/post\/messages\/chat?docs_tab=javascript-xhr\" data-type=\"URL\" data-id=\"https:\/\/alvochat.com\/docs\/api\/post\/messages\/chat?docs_tab=javascript-xhr\" target=\"_blank\" rel=\"noreferrer noopener\">daqui<\/a>.<\/p>\n\n<p>Pode ver a Documenta\u00e7\u00e3o API Whatsapp completa <a href=\"https:\/\/alvochat.com\/docs\/\" data-type=\"URL\" data-id=\"https:\/\/alvochat.com\/docs\/\" target=\"_blank\" rel=\"noreferrer noopener\">aqui<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Introdu\u00e7\u00e3o Neste trecho de c\u00f3digo, aprende como enviar uma API WhatsApp usando JavaScript, para enviar &#8230; <\/p>\n<p class=\"read-more-container\"><a title=\"Enviar uma API WhatsApp usando JavaScript\" class=\"read-more button\" href=\"https:\/\/alvochat.com\/blog\/pt-br\/how-to-send-whatsapp-api-using-javascript\/#more-1091\" aria-label=\"Read more about Enviar uma API WhatsApp usando JavaScript\">Read More<\/a><\/p>\n","protected":false},"author":1,"featured_media":714,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rank_math_title":"%title% | %currentyear%","rank_math_description":"Neste trecho de c\u00f3digo, aprende como enviar uma API WhatsApp usando javascript, para enviar uma mensagem de texto, modelos, suportes, bot\u00f5es, listas, produtos\n","rank_math_focus_keyword":"JavaScript,WhatsApp API","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[95,96],"tags":[97,98],"class_list":["post-1091","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutoriais","category-whatsappapi-pt-br","tag-o-que-e-api","tag-tutoriais","infinite-scroll-item","generate-columns","tablet-grid-50","mobile-grid-100","grid-parent","grid-50","no-featured-image-padding"],"jetpack_featured_media_url":"https:\/\/alvochat.com\/blog\/wp-content\/uploads\/2022\/11\/WhatsApp-API-JavaScript.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/posts\/1091","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/comments?post=1091"}],"version-history":[{"count":4,"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/posts\/1091\/revisions"}],"predecessor-version":[{"id":1260,"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/posts\/1091\/revisions\/1260"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/media\/714"}],"wp:attachment":[{"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/media?parent=1091"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/categories?post=1091"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/alvochat.com\/blog\/pt-br\/wp-json\/wp\/v2\/tags?post=1091"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}