DEV Community

Send automated Discord messages through Webhooks using JavaScript

Oskar Codes on February 09, 2020

I'm sure you've heard of Discord, the all-in-one voice and text chat app, and maybe you're even using it. Well did you know that it is possible to ...

Read full post

Tiago Rangel • Sep 28 '22 • Edited

This is cool! Congrats for the article!!!
Did the second part lunched?

Samuel Suther • Apr 22 '21

Really nice article.
I've also made one, how to connect your Linux-Server to Discord.
It might be useful as additional information if somebody need to trigger a message from a server-process, instead out of JS.

just-sell-online-en.blogspot.com/2...

jetfire158 • May 29 '20 • Edited

So I can just store the html file on the local machine? What would I need to add in order to tell it to execute every 2 hours? And could I run the webhook off of heroku or somewhere so that I wouldn't have to keep my PC on in order for it to work?

Oskar Codes • Dec 11 '20

You could start a Node server and use a node module like this one: npmjs.com/package/discord-webhook-...
Then you could maybe use a window.setInterval to execute it repeatedly with an interval.

Abid Hasan • Sep 26 '22

Thank you!

Alessandro • Jan 29 '21 • Edited

Hello, Really cool, thanks a bounch!
it his possible to do something like this inside discord app?
I'm using Telegram and it has the cool option to let you write commands in a text message. Then the user click it and Telegram simply repeat the link content and send it to your bot.
Something like this

'Click /done when you have done.'

when you click (or tap) on /done, telegram send a message like this

/done@YourCoolBot

and your bot grab it as a regular command, like if you wrote /done yourself in the text line.

i would like to replicate the behavior on discord to or, if not possible since it seems not, at least do something like that

Oskar Codes • Mar 9 '21

You mean having some programmed logic when pressing links on the message sent by the Webhook?

HtmlConverter22 • Dec 22 '21 • Edited

This is very nice and all, but I have a question:

So I made a simplistic website and I want to add a webhook notifiyer right

Basically they paste their webhook in a textbox, and when they press a button,
a message I made gets sent to the webhook they posted in the text box.

I'd like to know how to do this please, and thank you.

craigseller1979 • Oct 29 '20

what html editor do you use because i kinda need one lol

Tiago Rangel • Dec 13 '23

vscode is very good

Oskar Codes • Nov 20 '20

I use Visual Studio Code

a13bfg • Apr 16 '21

for me personally i use repl.it, its online based, fast, and you don't need to download anything it supports multiple languages and it can be used as a website hoster.

Tiago Rangel • Dec 13 '23

Glitch is much better in my personal opinion

nipundil • Sep 3 '22 • Edited

I need to embed telegram post via this method to my discord channel. How to do it.
The embed code looks like this
<script async src="https://telegram.org/js/telegram-widget.js?19" data-telegram-post="codewithdila/2" data-width="100%"></script>

a13bfg • Apr 16 '21

How do i make it send the content that was in the text box of a html page
like an discord webhook sender

Oskar Codes • Apr 20 '21

Set the content field to the value of your input:

content: document.querySelector("input").value // could be "textarea" as well

Konrad Szacha • Dec 18 '21

i did it like that but this is dont working please help me bro
<br> function sendMessage() {<br> const request = new XMLHttpRequest();<br> request.open("POST", "<a href="https://discord.com/api/webhooks/921856294481186857/cJd-f85MqKVdLyFotaxZf7yzWH-ILK3VGPL1H7W2IX7UsQwIs0yDEap7cG4oF18uE4K0%22" rel="nofollow">https://discord.com/api/webhooks/921856294481186857/cJd-f85MqKVdLyFotaxZf7yzWH-ILK3VGPL1H7W2IX7UsQwIs0yDEap7cG4oF18uE4K0"</a>);</p> <div class="highlight"><pre class="highlight plaintext"><code> request.setRequestHeader('Content-type', 'application/json'); const params = { username: "My Webhook Name", avatar_url: "", content: document.querySelector("input").value } request.send(JSON.stringify(params)); } </code></pre></div> <p>

and how i should modify this

Oskar Codes • Jan 3 '22

Where did you copy that code from? That’s some plain HTML displaying JavaScript code, not executing it.

SaucierPond • Sep 14 '21 • Edited

Hey @oskarcodes ! My code doesn't work. Can you please check why?

function sendMessage() {
    const request = new XMLHttpRequest();
    request.open("POST", "https://discordapp.com/api/webhooks/676118118082281513/ZS5YcWhurzokBrKX9NgexqtxrJA5Pu2Bo4i7_JsIxC-JIbPBVhSZkcVVukGOro52rnQA");

    request.setRequestHeader('Content-type', 'application/json');

    const params = {
        username: "My Webhook Name",
        avatar_url: "",
        content: "The message to send"
    }

    request.send(JSON.stringify(params));
}

Thank you!

Oskar Codes • Dec 2 '21

Your code looks fine, it must be the Webhook URL endpoint that is wrong

BIGBOIELTHICO⁶⁹ • Jun 2 '21

How would I make it to where I make a text submit box and get whatever hey typed in sent to the webhook?

Oskar Codes • Jun 4 '21 • Edited

Make an HTML <input> element, select if from JavaScript, and pass the .value of that element to the payload you send to your Webhook.

BIGBOIELTHICO⁶⁹ • Jul 19 '21

can you make an example of this please im really new to this

shllshckd • Apr 30 '21

Works flawlessly. <3

TEODORv2 • Sep 25 '20

Hi! So I wanted to enter the content directly from the html page, so I made a label, but I don't really know how to link the label's entered input to the content value. Anyone got any ideas? I'm really new to html, css and java so I don't really know much.

Oskar Codes • Dec 1 '20

Set the content field to the value of your input:

content: document.querySelector("input").value

EnterUsernameHere • May 1 '20

How do you make it like send a message every 24 hours?

Bradley Elko • May 5 '20 • Edited

set a timer for 24 hours that sends a request

EnterUsernameHere • May 7 '20

What would be the code to do that?
Sorry I am not very experienced at this.

Oskar Codes • May 8 '20

In JavaScript, you can use the setInterval method to run some code repeatedly.
Check out the documentation: developer.mozilla.org/en-US/docs/W...

Mmmm2006 • Mar 29 '20

Une partie 2, une partie 2, une partie 2

Oskar Codes • Mar 29 '20 • Edited

Ça arrive bientôt

kengreg • Oct 10 '21

hi, thanks for the help. Can you write also how to get messages from a channel? I am trying but everything and everyone just use discord.js which I cant use in my project

Oskar Codes • Dec 2 '21

Webhooks cannot read data from channels, because they're just HTTP endpoints you send requests to, there's no code logic involved in the Webhook on Discord's side.
So yeah, you'll have to use Discord.js to read from channels

TheRayJohnson • Nov 18 '20

Is it possible to do multiple webhooks? Like a dropdown menu of channels and selecting X channel from the form dropdown list will use Y webbook?

Oskar Codes • Nov 20 '20

Yes that’s totally possible, just check which option is selected in the drop down, and send to a different webhook url based on that

Dejvy • Jun 12 '21

Uhm hello, can i ask, I'm getting error from CORS Policy, how should i fix it?

Oskar Codes • Jun 16 '21

Then your webhook endpoint must be wrong, check it again.

censorr • Apr 30 '20

Is there a way to make it so it sends multiple lined messages? In this it only allows me to send a message that is in all one line.

Oskar Codes • May 1 '20

Add the character \n to create a newline, like so:

content: "The message\nto send"

Otherwise you could use backsticks instead of quotes, like so:

content: `The message
to send`

abdus salam • May 18 '21

How do you send the same messages to multiple server ??

Oskar Codes • Jun 16 '21

Make requests to multiple webhook endpoints

misterymissile • May 8 '20

How do I make it send a variable in the content: parameter?

Oskar Codes • May 8 '20

Well you can just put your variable in there instead of the string

content: yourVariableName

WikiNope • Jan 26 '21

How would you post an updating game log through discord?

Oskar Codes • Mar 21 '21

Same logic as explained in this article, just that the environment is your game framework or engine.

Punith Reddy V • Oct 29 '20

can we put text box instead of writing the message in code all the time pls help

Oskar Codes • Dec 11 '20

Yes you can, just use the value property of the text box and pass it in the object that is sent in the webhook payload.

NotflameE121 • Jan 3 '22

can you link the enbed vid plz ty

Oskar Codes • Jan 4 '22

Which video?

Ian Moone • Sep 21 '20

Is there a way to use webhook to send a private message if person is on the server which my app is connected to?

Oskar Codes • Nov 20 '20

No, for that you’ll need a Discord bot. A webhook can only send to server channels.

Andy • Nov 9 '23 • Edited

Can you send an image instead of text to the discord server? if so, what's the code?

i need name ideas 💀 • May 19 '23

hey there is a problem for some reason it gives me this error:
(index):1 Uncaught ReferenceError: sendMessage is not defined
at HTMLButtonElement.onclick ((index):1:1)
can you help me fix it?