How to add an api-key header to the /ui interface

1

Hi,
when navigating to the api /ui page we want to be able for users to enter their api key.
That should be passed in the header as x-api-key when submitting (testing) any api call

I tried with the OpenApiFeature but it doesnt effect this page

 Plugins.Add(new OpenApiFeature()
        {
            DisableSwaggerUI = false,
            ApiDeclarationFilter = api =>
            {
              
                api.SecurityDefinitions.Add(
                    "apiKey", new OpenApiSecuritySchema {
                        Type = "apiKey",
                        Name = "x-api-key", // Use "x-api-key" as the header name
                        In = "header",
                        Description = "API Key Authentication"
                    });

            
            },
2

The registered Auth Options are supported in the Integrated Sign In dialog where it’s added to the clients BearerToken, but it doesn’t support custom Auth configurations.

3

I have configured auth provider

  private void ConfigureAuthentication(Container container)
        {

            var authProviders = new IAuthProvider[]
            {
                new CustomAuthProvider(),
                new JwtAuthProvider(AppSettings) {
                    RequireSecureConnection = false,
                }
            };

But my login page doesnt show the JWT option

image

4

Looks like something is breaking the Sign In Dialog, does it work when you only have the JwtAuthProvider registered? What are the console errors?

5

Still the same problem when only having JwtAuthProvider

Console errors

The script from “http://localhost:58999/auth?callback=loadAuth&jsconfig=eccn” was loaded even though its MIME type (“application/json”) is not a valid JavaScript MIME type.
ui
asm.js type error: Asm.js optimizer disabled because debugger is active es-module-shims.js
breakpoints.change 
Proxy { <target>: {…}, <handler>: {…} }
 
Proxy { <target>: {…}, <handler>: {…} }
app.mjs:63:49
routes.start() op <empty string> core.mjs:42:9
nav 
Object {  }
6

What’s producing the asm.js errors? Do you have an extension enabled that’s breaking the JS?

7

No nothing that i know about. I just upgraded servicestack version.

Any clue where i should start looking?

8

I’m assuming it’s a browser extension, try using a different browser in a private window.

9

Tried with Private window in Firefox and save problem

Running in Edge i only get this in the log but still doesnt work

routes.start() op

10

ok not sure then, can you put a minimal stand-alone repro on GitHub and I’ll take a look.

11

I have a ApiKeyRequestFilter on all requests… is that maybe blocking something?

12

No idea, remove anything that could be interfering with it and see.

13

Here is a small repo with the issue. It’s only allowed be downloaded one time

Removed the link now as it’s been downloaded

14

It’s because you’re using JwtAuthProviderReader instead of JwtAuthProvider which defines the FormLayout the SignIn Vue component should use to render the form.

So you need to either change it to use JwtAuthProvider:

var authFeature = new AuthFeature(() => new AspnetMembershipAuthSession(), new IAuthProvider[] 
{ 
    new JwtAuthProvider(AppSettings)
    {
        RequireSecureConnection = false,
        PopulateSessionFilter = AspnetMembershipAuthSession.TokenToSession,
    }
});

Or to use JwtAuthProviderReader you need to explicitly specify the FormLayout it should use with:

var authFeature = new AuthFeature(() => new AspnetMembershipAuthSession(), new IAuthProvider[] 
{ 
    new JwtAuthProviderReader(AppSettings)
    {
        RequireSecureConnection = false,
        PopulateSessionFilter = AspnetMembershipAuthSession.TokenToSession,
        FormLayout = new() {
            new InputInfo(nameof(IHasBearerToken.BearerToken), ServiceStack.Html.Input.Types.Textarea) {
                Label = "JWT",
                Placeholder = "JWT Bearer Token",
                Required = true,
            },
        }
    }
});
1 Like
15

Thx works fine now and all good