Can't POST from app to Slack Incoming Webhook

Question

I'm able to POST to my Slack Incoming Webhook using curl:

curl -X POST -H 'Content-type: application/json' --data '{"text":"Hello world"}' https://hooks.slack.com/services/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

But when I use

$.ajax({
    url: "https://hooks.slack.com/services/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",
    data: '{"text": "Hello world"}',
    type: "POST",
    contentType: "application/json"
})
    .done(function (reply) {
        console.log("POST to Slack succeeded")
    })
    .fail(function (xhr, status, errorThrown) {
        console.log("Error in POST to Slack: " + errorThrown.toString())
    })

in a page of my app that is served by localhost:8090, I get the error:

jquery.js:9536 OPTIONS https://hooks.slack.com/services/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 
400 (Bad Request)
XMLHttpRequest cannot load https://hooks.slack.com/services/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. 
Response for preflight has invalid HTTP status code 400

Normally a POST from my page would go to my server, which served the page. So I think my confusion has to do with understanding how Webhooks work. I thought that the same-origin policy prohibited me from POSTing to an arbitrary url. But why does the curl command work, and how do I get my page to do what curl does?

Do I need to send the POST from my server, instead of from the client browser?

Answer 1

I got an answer from Ben J at Slack. All I had to do was remove the line

contentType: "application/json"

Wonderful, quick help from the Slack team. Greatly appreciated.