วิธีแก้ปัญหา CORS ใน C# ASP.NET WebAPI

Cross-Origin Resource Sharing (CORS) ใช้ HTTP Header เพิ่มเติมเพื่อให้ Browser อนุญาตให้ Web App เรียก Resource จาก Origin อื่น (Domain, Protocol, Port ต่างกัน)

ตัวอย่าง: Frontend https://demodomain-ui.com เรียก Backend https://demodomain-service.com/api Browser จะบล็อก Cross-origin Request เพื่อความปลอดภัย

HTTP Headers ที่ CORS เพิ่ม

• Access-Control-Allow-Origin
• Access-Control-Allow-Credentials
• Access-Control-Allow-Headers
• Access-Control-Allow-Methods
• Access-Control-Expose-Headers
• Access-Control-Max-Age
• Access-Control-Request-Headers
• Access-Control-Request-Method
• Origin

เปิด CORS ระดับ Global

1. ติดตั้ง Package Microsoft.AspNet.WebApi.Cors จาก NuGet
2. แก้ไข App_Start/WebApiConfig.cs:

   public static class WebApiConfig
   {
       public static void Register(HttpConfiguration config)
       {
           var cors = new EnableCorsAttribute("*", "*", "*");
           config.EnableCors(cors);
           // ... routes
       }
   }

เปิด CORS ระดับ Controller/Action

using System.Web.Http;
using System.Web.Http.Cors;

namespace DemoWebApplication.Controllers
{
    [EnableCors("*", "*", "*")] // Controller Level
    public class DemoController : ApiController
    {
        [EnableCors("*", "*", "*")] // Action Level
        public IHttpActionResult Get(int id)
        {
            return Ok();
        }
    }
}

ใช้ [DisableCors] เพื่อปิด CORS เฉพาะ Action/Controller