Error – Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.

I was working on a project where I wrote a web method and called this web method from JQuery.
While accessing the web method I got this error –
“Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.”
In debugging, I couldn’t find any issue with the code either in C# or in JQuery.
Then I got the below solution.

This error is due to the Cross-Origin Resource Sharing (CORS). To learn more about Cross-Origin Resource Sharing (CORS) click here.

To resolve this error, follow the below solution.

In web.config , file search for  <system.webServer> and add the below section if you want to allow for all domain

<httpProtocol>
	<customHeaders>
		<add name="Access-Control-Allow-Origin" value="*" />
		<add name=”Access-Control-Allow-Headers” value="Origin, X-Requested-With, Content-Type, Accept" />
	</customHeaders>
</httpProtocol>

If you wish to allow a particular domain then use the below lines.

<httpProtocol>
	<customHeaders>
		<add name="Access-Control-Allow-Origin" value="www.domain-name.com" />
		<add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept" />
	</customHeaders>
</httpProtocol>

After applying this solution my code works.
Hope this helps you.