Forum Discussion

joschroth's avatar
joschroth
Copper Contributor
Aug 11, 2020

Microsoft teams incoming webhook CORS error

Hi there,

 

I've been trying to get my web app (javascript) to send a message to a microsoft teams channel. I went through the steps of the "getting-started" page and then referred to this tutorial: https://medium.com/@john_93626/automating-posts-to-microsoft-teams-using-javascript-2b5afeab1974 .

 

Problem is, whenever i try to send a Post request to my url (using axios or XMLHttpRequest), i got an error saying: Access to XMLHttpRequest at 'https://outlook.office.com/webhook/8857e17c-5ad9-4561-8970-180c05644bc4@0400011a-0b87-4500-ac8a-610ba1dfd12f/IncomingWebhook/b4b6d53465994ee69efce77ac7a93bea/b193af5d-b425-447e-a187-7ee36bb8ac66' from origin 'http://localhost:3030' 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.

As you can see in my code below, i added the 'Access-Control-Allow-Origin' header to my request, but I still get the same error. 

 
Did this occur to anyone else as well? Or am I doing something wrong?
 
Help would be much appreciated,
Best regards,
Josch
developer
microsoft teams
  • farisdurrani425's avatar
    farisdurrani425
    Copper Contributor
    Mar 24, 2023

    Make sure you're using a native server and not React for example. So, a call from a basic ExpressJS app works but not if initiated from within React. That solved the issue for me

    • tonanuvem's avatar
      tonanuvem
      Copper Contributor
      May 10, 2023

        

      Just had the same issue, and got it working by using: https://www.npmjs.com/package/teams-web-send

       

      see the docs:

      • Directly off the browser as a UMD
        <script src="https://unpkg.com/teams-web-send@0.1.1/dist/tws.umd.production.min.js"></script>
<script>
(() => {
	const sendMessage = window.tws.bootstrap();
	const message = `{"text": "Hello World"}`;
	sendMessage('http://your.msteams.webhook.url', message).then(() => {
		console.info('Message sent!')
	});
})();
</script>

      farisdurrani425

    • joschroth's avatar
      joschroth
      Copper Contributor
      Aug 25, 2020

      Gousia_Begum Hi! Yeah I've followed the steps of the guide closely, problem is they only send the JSON via Curl or Postman, not through an Http post request. Whats the connector registration portal? Did you mean the dialog inside of teams where you can manage your connectors etc.?

       

      Best regards,

      Josch

Resources