swagger-api / swagger-ui

Swagger UI is a collection of HTML, JavaScript, and CSS assets that dynamically generate beautiful documentation from a Swagger-compliant API.
https://swagger.io
Apache License 2.0
26.66k stars 8.97k forks source link

Show required OAuth scopes on each endpoint #5062

Open pacey opened 5 years ago

pacey commented 5 years ago

The API I am documenting has a lot of scopes available. However, a single endpoint usually only requires one scope. Currently a padlock is displayed on each endpoint and clicking it opens the Available authorizations modal where all scopes the API has are displayed.

It would be great to know which individual scopes are required per endpoint.

I have checked my source swagger json and this information is there on a per endpoint basis. Here is a subset of my swagger json to show the relevant sections:

{
  "swagger": "2.0",
  "info": {
    "description": "Api Documentation",
    "version": "1.0",
    "title": "Api Documentation",
    "termsOfService": "urn:tos",
    "contact": {},
    "license": {
      "name": "Apache 2.0",
      "url": "http://www.apache.org/licenses/LICENSE-2.0"
    }
  },
  "paths": {
    "/v1/organisations/{id}": {
      "get": {
        "summary": "Get a single Organisation",
        "operationId": "getByIdUsingGET",
        "security": [
          {
            "Auth0": [
              "get:organisation"
            ]
          }
        ],
        "deprecated": false
      }
    }
  },
  "securityDefinitions": {
    "Auth0": {
      "type": "oauth2",
      "tokenUrl": "https://xxxxxxxxx/oauth/token",
      "flow": "application",
      "scopes": {
        "create:organisation": "Create an Organisation",
        "get:organisation": "Get a single Organisation",
        "list:organisation": "List Organisations",
        "update:organisation": "Update an Organisations",
        "delete:organisation": "Delete an Organisations",
      }
    }
  }
}
hkosova commented 5 years ago

Related: Auth button doesn't indicate missing OAuth2 scopes anymore.

danielbecroft commented 4 years ago

Is there any update on this? It is planned to be added in a soon-to-be-released release?

ruks commented 4 years ago

Looks this is a valid requirement. Can we support this in the next release?

Akridian commented 4 years ago

Is there any chances to get this functionality in future?

killergege commented 4 years ago

I'd vote too for this. I don't know if it was a custom dev from my company or the old version but before upgrading, we had an icon that displayed the scopes for each endpoint, and its status (whether current user has the scope or not) It was great. So I suggest that you do the same, for instance on the padlock icon.

Screenshot examples: Not authenticated / Authenticated with a few of the required scopes / Fully authenticated imageimageimage

The colors is a bonus, but at least having the list would be great.

jdvalentine commented 3 years ago

Another vote for this.

Thanks for a great product!

rgreil commented 3 years ago

This feature would be really helpful.

lephuongbg commented 3 years ago

We came up with a plugin that do the job well enough for us:

image

// Remember to include React either through script tag in browser environment:
//     <script src="https://unpkg.com/react@15/dist/react.min.js"></script>
// or through import with webpack/babel:
//     import React from 'react'
const h = React.createElement
SwaggerUIBundle({
    // ...
    presets: [
        system => {
            // Variable to capture the security prop of OperationSummary
            // then pass it to authorizeOperationBtn
            let currentSecurity
            return {
                wrapComponents: {
                    // Wrap OperationSummary component to get its prop
                    OperationSummary: Original => props => {
                        const security = props.operationProps.get('security')
                        currentSecurity = security.toJS()
                        return h(Original, props)
                    },
                    // Wrap the padlock button to show the
                    // scopes required for current operation
                    authorizeOperationBtn: Original =>
                        function (props) {
                            return h('div', {}, [
                                ...(currentSecurity || []).map(scheme => {
                                    const schemeName = Object.keys(scheme)[0]
                                    if (!scheme[schemeName].length) return null

                                    const scopes = scheme[schemeName].flatMap(scope => [
                                        h('code', null, scope),
                                        ', ',
                                    ])
                                    scopes.pop()
                                    return h('span', null, [schemeName, '(', ...scopes, ')'])
                                }),
                                h(Original, props),
                            ])
                        },
                },
            }
        },
    ]
})
4integration commented 3 years ago

Old issue - any plans to implement this?

KyleCrowley commented 3 years ago

Another vote for this. Despite the documentation specifically mentioning this use case (see below), it appears that the Swagger UI is unable to distinguish between global and route (path)-based security.

Relevant excerpt from the documentation (bolded for emphasis):

"For each scheme, you specify a list of security scopes required for API calls (see below). Scopes are used only for OAuth 2 and OpenID Connect Discovery; other security schemes use an empty array [] instead. Global security can be overridden in individual operations to use a different authentication type, different OAuth/OpenID scopes, or no authentication at all:"

Kieun commented 2 years ago

We are also facing same issues. Is there any update on this? If not, it's better to customize the swagger-ui by ourselves. We might define each security scheme per the OAuth2 scope, it's not ideal since such security schemes are also displayed in the global pad lock.

souvik-sarkar-98 commented 1 year ago

Another vote for this.

panvid commented 2 months ago

Bump: Is there any change?

prygunov commented 1 month ago

One more vote