We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

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

Thread ID:

Created:

Updated:

Platform:

Replies:

141134 Nov 26,2018 11:26 AM UTC Nov 27,2018 07:23 AM UTC Angular - EJ 2 1
loading
Tags: Uploader
Muthukumar
Asked On November 26, 2018 11:26 AM UTC

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 [Syncfusion]
Replied On November 27, 2018 07:23 AM UTC

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 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon