Login to Angular ASP.NET CORE app using Postman

Viewed 532

I would like to login my app using postman and receive a token when login to make other api call with the token. I have tried {locahost}/connect/token but I get a 405 error. How can I login to my app using postman thank you for your help.

Here is how I generated the app

  1. I open visual studio 2019.
  2. I chose "Create a new project"
  3. Chose ASP.NET Core With Angular Select Core With Angular
  4. Click next
  5. Give it a name
  6. Save it where you would like
  7. In dropDown "Authentication Type" select "Invidual Accounts"

Once the app is created the login and register work perfectly but I want to the these api calls in Postman.

Here is the startup that visual studio generated for me.

public class Startup
{
    public Startup(IConfiguration configuration)
    {
        Configuration = configuration;
    }

    public IConfiguration Configuration { get; }

    // This method gets called by the runtime. Use this method to add services to the container.
    public void ConfigureServices(IServiceCollection services)
    {
        services.AddDbContext<erp_colombiaDbContext>(options =>
            options.UseMySql(
                Configuration.GetConnectionString("DefaultConnection")));

        services.AddDefaultIdentity<ApplicationUser>(options => options.SignIn.RequireConfirmedAccount = true)
            .AddEntityFrameworkStores<erp_colombiaDbContext>();

        services.AddIdentityServer()
            .AddApiAuthorization<ApplicationUser, erp_colombiaDbContext>();

        services.AddAuthentication()
            .AddIdentityServerJwt();
        services.AddControllersWithViews();
        services.AddRazorPages();
        // In production, the Angular files will be served from this directory
        services.AddSpaStaticFiles(configuration =>
        {
            configuration.RootPath = "ClientApp/dist";
        });
    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
            app.UseDatabaseErrorPage();
        }
        else
        {
            app.UseExceptionHandler("/Error");
            // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
            app.UseHsts();
        }

        app.UseHttpsRedirection();
        app.UseStaticFiles();
        if (!env.IsDevelopment())
        {
            app.UseSpaStaticFiles();
        }

        app.UseRouting();

        app.UseAuthentication();
        app.UseIdentityServer();
        app.UseAuthorization();
        app.UseEndpoints(endpoints =>
        {
            endpoints.MapControllerRoute(
                name: "default",
                pattern: "{controller}/{action=Index}/{id?}");
            endpoints.MapRazorPages();
        });

        app.UseSpa(spa =>
        {
            // 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");
            }
        });
    }
}

I Have seen this answer Default settings for AddApiAuthorization (Scaffolded Angular + IdentityServer4) but I don't understand where he got the values from to fill the postman form "GET NEW ACCESS TOKEN"

1 Answers

Posting this in response to comments above.

In this question, the answer from user @Lasanga Guruge points out the default values for a basic scaffolded application. So these settings should work for you in Postman

  1. Grantype of Authorization Code

  2. ClientId will be corresponding to the application name. That can be changed in appsettings.json (Clients) and api-authorization.constants.ts (ApplicationName)

  3. By default a client secret would not be applied to the client

  4. Also pkce is enabled.

  5. No default credentials

  6. Additional scope named {ProjectName}API will be added

I created a basic ASP.Net Angular project and got it working with these values

  • Grant Type - Authorization Code (With PKCE)
  • Callback URL - https://localhost:{port}/authentication/login-callback
  • Auth URL - https://localhost:{port}/connect/authorize
  • Token URL - https://localhost:{port}/connect/token
  • ClientId - {ClientId}
  • Scope - {ClientId}API openid profile

enter image description here

To get your client ID look in appsettings.json for the IdentityServer section In mine below, 'Project2" is my clientID. It should be whatever you named the project.

"IdentityServer": {
  "Clients": {
    "Project2": {
      "Profile": "IdentityServerSPA"
    }
  }
}

Update

To make an authorized API call with the token, you need to ensure it is set in the Authorization header of the request.

  • Authorizaion = "Bearer {token}"

You should be able to set this by setting the 'Add authorization data to' field to 'Request Headers' in Postmans Authorization form.

enter image description here

enter image description here

Related