How to convert the upload sample to angular stand-alone and not get the CORS error ?

[matthew]

So I took this sample

kendo-angular/examples-standalone/aspnetcore-upload at master · telerik/kendo-angular (github.com)

 

Removed these lines

/{
            //    // To learn more about options for serving an Angular SPA from ASP.NET Core,
            //    // see https://go.microsoft.com/fwlink/?linkid=864501

            //    spa.Options.SourcePath = "ClientApp";

            //    if (env.IsDevelopment())
            //    {
            //        spa.UseAngularCliServer(npmScript: "start");
            //    }
            //});

changed this line to..

 

  <kendo-upload [saveUrl]="'https://localhost:44316/api/Upload'" [removeUrl]="'api/Remove'" [withCredentials]="'false'"> </kendo-upload>

Then loaded the ClientApp in VS code.. Ran it and got the cors error...

 

I tried to add these lines below but I still got the same error.  What minimal changes do I need to do with this sample to split out the server and client ?

 

                options.AddPolicy("CorsPolicy",
 builder =>
 {
     builder.WithOrigins("http://localhost:4200")
            .AllowAnyHeader();
 });

            });

 

            app.UseCors("CorsPolicy");

[Yanmario]

Hi Matthew,

The most straightforward approach to split the application is to cut the ClientApp and place it in another folder, then run the following commands:

• npm install
• ng s

This will run the client application as a standalone. However, I would recommend creating the application from scratch using Angular version 12 and, if desired copy some of the source code from the demo app.

I hope this helps.

Regards,
Yanmario
Progress Telerik