[WIP] feat: add access token UI

[hacksparrow]

Add UI for specifying the access token in API Explorer. Also makes additional UI improvements.

Old

New

[bajtos]

I am confused. How do you envision to use the access token set in the UI? In your pull request, I don't see how the value is passed to the underlying swagger-ui or swagger-js implementation.

Also note that by default, LoopBack 4 applications don't have authentication enabled, they don't accept any access tokens!

[bajtos]

IMO, we need to implement first few parts of Authentication epic #1035, most notably #1997, before it makes sense to work on API Explorer enablement.

[hacksparrow]

I don't see how the value is passed to the underlying swagger-ui or swagger-js implementation.

Work in progress.

After discussing with you on Slack, looks like this is indeed early.

[sbacem]

I think is better to use like this in SwaggerUI

and

[bajtos]

I think is better to use like this in SwaggerUI

+1 to use swagger-ui's built-in controls and don't reinvent the wheel.

[hacksparrow]

@sbacem is that an in-built feature in SwaggerUI? How do you bring it up?

[sbacem]

@hacksparrow you can see this https://editor.swagger.io

In first step is to define your security strategy

securityDefinitions:
  petstore_auth:
    type: "oauth2"
    authorizationUrl: "http://petstore.swagger.io/oauth/dialog"
    flow: "implicit"
    scopes:
      write:pets: "modify pets in your account"
      read:pets: "read your pets"
  api_key:
    type: "apiKey"
    name: "api_key"
    in: "header"

After this you can use this definition in path like this

      security:
      - petstore_auth:
        - "write:pets"
        - "read:pets"

[bajtos]

Thank you @sbacem for an example of how to configure auth/auth in OpenAPI. The full spec can be found here: https://github.com/OAI/OpenAPI-Specification/blob/master/versions/3.0.1.md#securitySchemeObject

Here are the valid auth types: "apiKey", "http", "oauth2", "openIdConnect". We have been using "apiKey" type in LoopBack 3.x, I think that's the direction we are investigating for LB4 too.

cc @jannyHou

[hacksparrow]

Thanks @sbacem!

[raymondfeng]

As we improve the authentication/authorization support, security related metadata should be generated into the OpenAPI spec.

[hacksparrow]

Closing this as we won't need to work on additional UI.

[shendkardevesh]

hi , confuse how to get ui changed for accepting authentication key

[dougal83]

@shendkardevesh The UI is not ready yet, for implementation progress see issue: #2027

You can use a tool like Postman to query the API with an access token in the meantime.