Question 108242 in Azure Question posted in
The official documentation to get you started can be found here.

Azure – Angular js front end and .net backend getting CORS error Response to preflight request. Also no page is getting after login

He have deployed two apps

  • Frontend: Angular.js (UI)
  • Backend: .Net framework (API)

We executed from azure pipeline and deployed to IIS. No error application deployed. We have linked in api in config.js file

test_app = {
  environment: "prod",
  apiUrls: {
    mr: "https://new-mr-api.xxx.com/api",
    sites: "https://sitesapi.xxx.com/api",
  },
  azureAD: {
    clientId: "xxxxxxxxxxxxxxx",
    loginAuthorityPolicyName: "B2C_1A_MR_SignUp_SignIn_AAD",
    passwordResetPolicyName: "B2C_1A_MR_PasswordReset",
    tenantName: "cappartners",
    appIds: {
      mr: "mr-test",
      sites: "apis",
    },
  },
  powerBI: {
    workspaceId: "yyyyyyyyyyyyyyyy",
    dockOrderStatusId: "7rrrrrrrrrrrrrrrrrrrrrrrrr",
  },
  applicationInsights: {
    instrumentationKey: "1111111111111111111111111111111",
    roleName: "Browser",
    roleInstance: "PROD",
  },
  googleMapsApiKey: "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
};

Here in mr we provided API url. Also added b2c url for login
So when we hit the UI url http://new-mr.xxx.com then we are getting login microsoft azure b2c login page. After login nothing is displaying. When we check in developer/inspect page console we are getting CORS blocked errorenter image description here

we have added CORS in api webapiconfig.js like

using System.Web.Http.Cors
...........
so on...

string origins = ConfigurationManager.AppSettings["cors:origins"];
string headers = ConfigurationManager.AppSettings["cors:headers"];
string methods = ConfigurationManager.AppSettings["cors:methods"];
var cors = new EnableCorsAttribute(origins, headers, methods, "API-Build-Number");
config.EnableCors(cors);
config.MapHttpAttributeRoutes();
.............. so on....

Also added cors in Web.config

<add key="cors:origins" value="*" />
<!--<add key="cors:headers" value="Origin, X-Requested-With, Content-Type, Accept, Authentication" />
<add key="cors:methods" value="GET, POST PUT, PATCH, DELETE, OPTIONS" />-->
<add key="cors:headers" value="*" />
<add key="cors:methods" value="*" />

Please help in loading the page and resolving the error. Thanks in advance

Tags:

2

Answers


  1. 0

    Also try configure the CORS in your ConfigureServices method on your Startup.cs in your .net API

    Public void ConfigureServices(IServiceCollection services)
{
    // Add service and create Policy with options
    services.AddCors(options =>
    {
        options.AddPolicy("CorsPolicy",
            builder => builder.AllowAnyOrigin()
            .AllowAnyMethod()
            .AllowAnyHeader()
            .AllowCredentials() );
    });

    and use app.UseCors("CorsPolicy"); in configure services method.

    Also make sure to select correct token type from below to access you api,
    enter image description here

    Also check if you need to adjust the packages > microsoft identity web issues(github.com)

    Login or Signup to reply.
  2. 0

    This type of error is very common please check your controller name

    For example:

    [HttpPatch]
[Route("UserProfileUpdate")]
public async Task<ActionResult<MyHtApiResponse>> UserProfileUpdate(AdminVM adminVM)

    In this example, The Route name and controller name are same, sometime it also give this type of error

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search