Discord Webhook CORS Error

Coding Help
1

Hello!

I’m trying to make a website, where if you click the button, it will send a message through Discord webhooks.

I know this might get a little confusing, but I’m trying my best to keep it simple.

When I’m using local host, it works fine WITHOUT the request.setRequestHeader("Access-Control-Allow-Origin", "*");. But when I put in the request.setRequestHeader("Access-Control-Allow-Origin", "*");, I get this error:

Access to XMLHttpRequest at 'https://discord.com/api/webhooks/1020540896447582260/V3adzTsSAj3ZPctUfNZc1Sf20d5aJ22yQqT0_XHFN4diuseGw7kfaFBXxSA_CX******' from origin 'http://localhost:5000' has been blocked by CORS policy: Request header field access-control-allow-origin is not allowed by Access-Control-Allow-Headers in preflight response.

I could just leave the request.setRequestHeader("Access-Control-Allow-Origin", "*"); out so it works, but the problem is, that when I deploy the website and use the main URL, it gives me the error below either way. If I add the request.setRequestHeader("Access-Control-Allow-Origin", "*");, it shows the error below, and if I don’t use the request.setRequestHeader("Access-Control-Allow-Origin", "*");, still, it shows the error below.

Access to XMLHttpRequest at 'https://discord.com/api/webhooks/1020540896447582260/V3adzTsSAj3ZPctUfNZc1Sf20d5aJ22yQqT0_XHFN4diuseGw7kfaFBXxSA_CX******' from origin 'https://gai-services.tk' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Keep in mind, that either way, it still says No 'Access-Control-Allow-Origin' header is present on the requested resource. even if I do add it.

I think that the problem is that it isn’t seeing that I added the ‘Access-Control-Allow-Origin’ header. I could be wrong as I’m very bad at programming.

Here is my over all code containing the request:

const request = new XMLHttpRequest();
        request.open("POST", "https://discord.com/api/webhooks/1020540896447582260/V3adzTsSAj3ZPctUfNZc1Sf20d5aJ22yQqT0_XHFN4diuseGw7kfaFBXxSA_CX******");
        const params = {
            username: "Testing",
            avatar_url: "",
            content: "**NEW ORDER!**\n\n**Transaction ID:**\n" + transaction.value + "\n\n**Email:**\n" + email.value + "\n\n**Name:**\n" + name.value + "\n\n**Discord:**\n" + discord.value
        }
        request.setRequestHeader('Content-type', 'application/json');
        request.send(JSON.stringify(params));

For all the times I mention the webhook URL for Discord, I censored the last couple of characters so people won’t spam my Discord server. I don’t think that involves the error. When I was getting the errors, the Discord webhook URL wasn’t censored.

All the variables in the above code are correct and accurate, I just didn’t include them in this post. Including the transaction.value and email.value.

Thank you!

2

Hi @TikoGrant! Try this code:

fetch("https://discord.com/api/webhooks/__webhook_url____/__webhook_id____", {
    method: 'POST',
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json'
       "username": "Testing",
       "avatar_url": "",
       "content": "**NEW ORDER!**\n\n**Transaction ID:**\n" + transaction.value + "\n\n**Email:**\n" + email.value + "\n\n**Name:**\n" + name.value + "\n\n**Discord:**\n" + discord.value

    }
})
	.then(response => response.json())
	.then(data => {
})
	.catch(err => alert(`Error:\n${err}`));

fetch is an alternative to XMLHttpRequest but easier to use.
Information: Your webhook URL is not redacted. If you want me to redact it, just say! :hugs:
Hope this helps and happy glitching!
Tiago R.

3

Edit: I have been analyzing your code, and here are some points:

  • Your request information is exposed
  • Discord seems to be blocking you because of a 403. I think you forgot to input your username & avatar image
  • If you don’t want any avatar image, try a random one, like this one or using picsum.photos
4

Thanks for the reply! I’m not at my Computer right now, but I’ll be sure to try it and give you a response soon!

5

Hello!

I recently tried your code with the profile picture you provided, and I get this error.
image

6

Hi! I’ve been working and reached out finally a result. I’ve built a project with it so it’s easier for me to code it, check it out!

7

Hi, thanks for helping me out! Unfortunately, it didn’t work on my deployed version like always. It works fine on local host, but not the real website. I also tried it on your Glitch project adding a button to trigger the function, and I get this error. Which is the same as when I tried it as deployed on my website.
image

Thanks for your help, but the problem hasn’t been solved yet!

I appreciate your hard work :slight_smile:

8

Hi! I will check that out as soon as I’m on my PC, probabily tomorrow.

9

Got an answer yet?

10

I’ve found this on stackoverflow:

1 Like
11

Might you know what he means by “You need to be able to negotiate the CORS policy with discord before hand”?

13

I’ve crafted a new code for this.

/*
var email = {value: "myemail@email.com"}
var transaction = {value: "12221"}
var discord = {value: "mydiscord"}
*/
    function sendMessage() {
      const request = new XMLHttpRequest();
      request.open("POST", "https://discordapp.com/api/webhooks/___webhook_url___/__some_id___);

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

      const params = {
        username: "Grant and Icy services",
        avatar_url: "https://img.icons8.com/color-glass/120/000000/services--v1.png",
        content: "**NEW ORDER!**\n\n**Transaction ID:**\n" + transaction.value + "\n\n**Email:**\n" + email.value + "\n\n**Name:**\n" + name.value + "\n\n**Discord:**\n" + discord.value

      }

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

This seems to work for me.

14

I’ll test it out!

P.S you may wanna blur out OP’s webhook

15

Ok, done! <10 chars>

16

@glitch_support Can you please redact the version that has the webhook URL of post #2, post #13 and this post (i didn’t redacted the screenshot first)? I have edited these 3 posts, but the edit log keeps the URL.
Also @TikoGrant you have your webhook exposed on the website and ALSO on that screenshot:

18 
function searchreq() {
    var discrim = "";
    var key2 = "";
    var key3 = "";
    var key4 = "";

    const request = new XMLHttpRequest();
    request.open("POST", "https://discord.com" + discrim + key4 + key3 + key2);
    request.withCredentials = true;

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

    const params = {
      username: "Goggle Search",
      avatar_url: "",
      content: `A user searched: ${searching.value}`
    }

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

Haha! It’s the same code that would work on localhost, but not on server due to CORS.

19

I may have to use a package
4 hours for this conclusion?

20

UPDATE!

Volume 1:

As I have gone on for 4-6 hours with countless packages too, discord webhooks DOES NOT BUDGE.
For now I have come to the conclusion, use another webhooks service, or just use a discord bot instead.
I understand that it’ll work in localhost, but it DOES NOT WORK in production, even when you add the headers.
e.g. you get the following error(s):
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at DISCORDWEBHOOK.COM/WEBHOOKURL/TOKEN. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 403.
and/or
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at DISCORDWEBHOOK.COM/WEBHOOKURL/TOKEN. (Reason: CORS request did not succeed). Status code: (null).

If anyone, and I MEAN ANYONE has a cure for this - please let or anyone in this thread know, as I’d say OP, me, anyone looking for the answer within this thread would greatly appreciate it!

Volume 2:

In conclusion, if there was a good work around this I would’ve found it, but due to the limited resource on discord webhook requests for raw javascript (& packages) I could not.

So for now, this would be (im)possible (for discord at the very least), sorry for the late answer OP. Most of us (through stackoverflow, glitch, youtube, etc) have gotten the same error to no avail, CORS has just screwed us over on this one.

- Nicohlas

21

That’s strange, didn’t happen for me

22

hi i haven’t been on here for a while. sorry about that. that server no longer exists i don’t think, so it wouldn’t matter, right?

1 Like