I have got "Access-Control-Allow-Origin" in ej-uploadbox control

[Muthukumar Periasamy]

Hi team ,

  We are using Ej1 Components. We are developing the project with angular4 with typescript and Asp.net core web api . 

In that we have using ej-uploadbox  for uploading the files . Business logics are wrote in the API . Image are not able to upload in the server .

while trying i have got "Failed to load http://wxxshandev02:8095/api/SafetyAlert/UploadAlertAttachment: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:50549' is therefore not allowed access. The response had HTTP status code 500."

"Cross-Origin Read Blocking (CORB) blocked cross-origin response http://wxxshandev02:8095/api/SafetyAlert/UploadAlertAttachment with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details."

Please help me on this . 

Thanks,

Divakaran N

[Prince Oliver]

Hi Divakaran,  

Thank you using Syncfusion products.  

In the API controller, you need to enable CORS (i.e) allow cross origin requests. You can configure CORS policy at application startup in the ConfigureServices method for the UploadboxCoreApi. Kindly refer to the following code snippet.  

 

[Startup.cs] 

public void ConfigureServices(IServiceCollection services)  

{  

    // Add framework services.  

    services.AddMvc();  

    services.AddCors(o => o.AddPolicy("MyPolicy", builder =>  

    {  

        builder.AllowAnyOrigin()  

                .AllowAnyMethod()  

                .AllowAnyHeader();  

    }));  

}  

  

public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactoryloggerFactory)  

{  

    loggerFactory.AddConsole(Configuration.GetSection("Logging"));  

    loggerFactory.AddDebug();  

    app.UseCors("MyPolicy"); // applying to every requests  

    app.UseMvc();  

}  

In case if you are using MVC service, you can allow Cross Origin requests in the web.config file, kindly refer to the following UG documentation for more information: https://help.syncfusion.com/aspnetmvc/datamanager/corsdatafetching 

Also refer to the following online blog for further reference: https://daveceddia.com/access-control-allow-origin-cors-errors-in-angular/  

Regards,  

Prince