Fix: No 'Access-Control-Allow-Origin' header is present on the requested resource

I came across following error when executing AJAX request to another external site from source site over https protocol
Access to XMLHttpRequest at 'https://destination.com/test.svc/test' from origin 'https://source.com/test.html' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

The fix for this issue is adding custom headers 'Access-Control-Allow-Origin' in the response, To do this let's add following node in web.config

now in the response of XmlHttpRequest we get the access control header as follows: