You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Integration tests can be run locally with `npm run e2e` - be sure you aren't running a dev server when testing!
69
59
70
-
71
-
##### Browser support
60
+
### Browser support
72
61
Swagger UI works in the latest versions of Chrome, Safari, Firefox, Edge and IE11.
73
62
74
63
### Known Issues
75
64
76
65
To help with the migration, here are the currently known issues with 3.X. This list will update regularly, and will not include features that were not implemented in previous versions.
77
66
78
-
- Only part of the [parameters](#parameters) previously supported are available.
67
+
- Only part of the parameters previously supported are available.
79
68
- The JSON Form Editor is not implemented.
80
69
- Support for `collectionFormat` is partial.
81
70
- l10n (translations) is not implemented.
82
71
- Relative path support for external files is not implemented.
83
72
84
-
### Direct use of JS and CSS assets
85
-
To include the JS, CSS and image assets directly into a webpage, use the [swagger-ui-dist](https://www.npmjs.com/package/swagger-ui-dist) package.
86
-
The root directory of this package contains the contents of the _dist/_ directory of this repo.
87
-
As a node module, `swagger-ui-dist` also exports the `swagger-ui-bundle` and `swagger-ui-standalone-preset` objects.
88
-
89
-
### SwaggerUIBundle
90
-
To use swagger-ui's bundles, you should take a look at the [source of swagger-ui html page](https://github.com/swagger-api/swagger-ui/blob/master/dist/index.html) and customize it. This basically requires you to instantiate a SwaggerUi object as below:
91
-
92
-
```javascript
93
-
constui=SwaggerUIBundle({
94
-
url:"http://petstore.swagger.io/v2/swagger.json",
95
-
dom_id:'#swagger-ui',
96
-
presets: [
97
-
SwaggerUIBundle.presets.apis,
98
-
SwaggerUIStandalonePreset
99
-
],
100
-
plugins: [
101
-
SwaggerUIBundle.plugins.DownloadUrl
102
-
],
103
-
layout:"StandaloneLayout"
104
-
})
105
-
```
106
-
107
-
#### OAuth2 configuration
108
-
You can configure OAuth2 authorization by calling `initOAuth` method with passed configs under the instance of `SwaggerUIBundle`
109
-
default `client_id` and `client_secret`, `realm`, an application name `appName`, `scopeSeparator`, `additionalQueryStringParams`,
110
-
`useBasicAuthenticationWithAccessCodeGrant`.
111
-
112
-
Config Name | Description
113
-
--- | ---
114
-
client_id | Default clientId. MUST be a string
115
-
client_secret | Default clientSecret. MUST be a string
116
-
realm | realm query parameter (for oauth1) added to `authorizationUrl` and `tokenUrl` . MUST be a string
117
-
appName | application name, displayed in authorization popup. MUST be a string
118
-
scopeSeparator | scope separator for passing scopes, encoded before calling, default value is a space (encoded value `%20`). MUST be a string
119
-
additionalQueryStringParams | Additional query parameters added to `authorizationUrl` and `tokenUrl`. MUST be an object
120
-
useBasicAuthenticationWithAccessCodeGrant | Only activated for the `accessCode` flow. During the `authorization_code` request to the `tokenUrl`, pass the [Client Password](https://tools.ietf.org/html/rfc6749#section-2.3.1) using the HTTP Basic Authentication scheme (`Authorization` header with `Basic base64encoded[client_id:client_secret]`). The default is `false`
121
-
122
-
```javascript
123
-
constui=SwaggerUIBundle({...})
124
-
125
-
// Method can be called in any place after calling constructor SwaggerUIBundle
126
-
ui.initOAuth({
127
-
clientId:"your-client-id",
128
-
clientSecret:"your-client-secret-if-required",
129
-
realm:"your-realms",
130
-
appName:"your-app-name",
131
-
scopeSeparator:"",
132
-
additionalQueryStringParams: {test:"hello"}
133
-
})
134
-
```
135
-
136
-
If you'd like to use the bundle files via npm, check out the [`swagger-ui-dist` package](https://www.npmjs.com/package/swagger-ui-dist).
137
-
138
-
#### Parameters
139
-
140
-
Parameters with dots in their names are single strings used to organize subordinate parameters, and are not indicative of a nested structure.
141
-
142
-
Parameter Name | Description
143
-
--- | ---
144
-
url | The url pointing to API definition (normally `swagger.json` or `swagger.yaml`). Will be ignored if `urls` or `spec` is used.
145
-
urls | An array of API definition objects (`{url: "<url>", name: "<name>"}`) used by Topbar plugin. When used and Topbar plugin is enabled, the `url` parameter will not be parsed. Names and URLs must be unique among all items in this array, since they're used as identifiers.
146
-
urls.primaryName | When using `urls`, you can use this subparameter. If the value matches the name of a spec provided in `urls`, that spec will be displayed when Swagger-UI loads, instead of defaulting to the first spec in `urls`.
147
-
spec | A JSON object describing the OpenAPI Specification. When used, the `url` parameter will not be parsed. This is useful for testing manually-generated specifications without hosting them.
148
-
validatorUrl | By default, Swagger-UI attempts to validate specs against swagger.io's online validator. You can use this parameter to set a different validator URL, for example for locally deployed validators ([Validator Badge](https://github.com/swagger-api/validator-badge)). Setting it to `null` will disable validation.
149
-
dom_id | The id of a dom element inside which SwaggerUi will put the user interface for swagger.
150
-
domNode | The HTML DOM element inside which SwaggerUi will put the user interface for swagger. Overrides `dom_id`.
151
-
oauth2RedirectUrl | OAuth redirect URL
152
-
tagsSorter | Apply a sort to the tag list of each API. It can be 'alpha' (sort by paths alphanumerically) or a function (see [Array.prototype.sort()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort) to learn how to write a sort function). Two tag name strings are passed to the sorter for each pass. Default is the order determined by Swagger-UI.
153
-
operationsSorter | Apply a sort to the operation list of each API. It can be 'alpha' (sort by paths alphanumerically), 'method' (sort by HTTP method) or a function (see Array.prototype.sort() to know how sort function works). Default is the order returned by the server unchanged.
154
-
defaultModelRendering | Controls how models are shown when the API is first rendered. (The user can always switch the rendering for a given model by clicking the 'Model' and 'Example Value' links.) It can be set to 'model' or 'example', and the default is 'example'.
155
-
defaultModelExpandDepth | The default expansion depth for models. The default value is 1.
156
-
configUrl | Configs URL
157
-
parameterMacro | MUST be a function. Function to set default value to parameters. Accepts two arguments parameterMacro(operation, parameter). Operation and parameter are objects passed for context, both remain immutable
158
-
modelPropertyMacro | MUST be a function. Function to set default values to each property in model. Accepts one argument modelPropertyMacro(property), property is immutable
159
-
docExpansion | Controls the default expansion setting for the operations and tags. It can be 'list' (expands only the tags), 'full' (expands the tags and operations) or 'none' (expands nothing). The default is 'list'.
160
-
displayOperationId | Controls the display of operationId in operations list. The default is `false`.
161
-
displayRequestDuration | Controls the display of the request duration (in milliseconds) for `Try it out` requests. The default is `false`.
162
-
maxDisplayedTags | If set, limits the number of tagged operations displayed to at most this many. The default is to show all operations.
163
-
filter | If set, enables filtering. The top bar will show an edit box that you can use to filter the tagged operations that are shown. Can be true/false to enable or disable, or an explicit filter string in which case filtering will be enabled using that string as the filter expression. Filtering is case sensitive matching the filter expression anywhere inside the tag.
164
-
deepLinking | If set to `true`, enables dynamic deep linking for tags and operations. [Docs](https://github.com/swagger-api/swagger-ui/blob/master/docs/deep-linking.md)
165
-
requestInterceptor | MUST be a function. Function to intercept try-it-out requests. Accepts one argument requestInterceptor(request) and must return the potentially modified request.
166
-
responseInterceptor | MUST be a function. Function to intercept try-it-out responses. Accepts one argument responseInterceptor(response) and must return the potentially modified response.
167
-
showMutatedRequest | If set to `true` (the default), uses the mutated request returned from a rquestInterceptor to produce the curl command in the UI, otherwise the request before the requestInterceptor was applied is used.
168
-
169
-
### Plugins
170
-
171
-
#### Topbar plugin
172
-
Topbar plugin enables top bar with input for spec path and explore button or a dropdown if `urls` is used. By default the plugin is enabled, and to disable it you need to remove Topbar plugin from presets in `src/standalone/index.js`:
173
-
174
-
```javascript
175
-
let preset = [
176
-
// TopbarPlugin,
177
-
ConfigsPlugin,
178
-
() => {
179
-
return {
180
-
components: { StandaloneLayout }
181
-
}
182
-
}
183
-
]
184
-
```
185
-
186
-
#### Configs plugin
187
-
Configs plugin allows to fetch external configs instead of passing them to `SwaggerUIBundle`. Fetched configs support two formats: JSON or yaml. The plugin is enabled by default.
188
-
There are three options of passing config:
189
-
- add a query parameter `config` with URL to a server where the configs are hosted. For ex. http://petstore.swagger.io/?config=http://localhost:3001/config.yaml
190
-
- add a config `configUrl` with URL to SwaggerUIBundle
191
-
- change default configs in `swagger-config.yaml`*Note: after changing, the project must be re-built*
192
-
193
-
These options can be used altogether, the order of inheritance is following (from the lowest priority to the highest):
194
-
`swagger-config.yaml` -> config passed to `SwaggerUIBundle` -> config fetched from `configUrl` passed to `SwaggerUIBundle` -> config fetched from URL passed as a query parameter `config`
195
-
196
-
## CORS Support
197
-
198
-
CORS is a technique to prevent websites from doing bad things with your personal data. Most browsers + JavaScript toolkits not only support CORS but enforce it, which has implications for your API server which supports Swagger.
199
-
200
-
You can read about CORS here: http://www.w3.org/TR/cors.
201
-
202
-
There are two cases where no action is needed for CORS support:
203
-
204
-
1. swagger-ui is hosted on the same server as the application itself (same host *and* port).
205
-
2. The application is located behind a proxy that enables the required CORS headers. This may already be covered within your organization.
206
-
207
-
Otherwise, CORS support needs to be enabled for:
208
-
209
-
1. Your Swagger docs. For Swagger 2.0 it's the `swagger.json`/`swagger.yaml` and any externally `$ref`ed docs.
210
-
2. For the `Try it now` button to work, CORS needs to be enabled on your API endpoints as well.
211
-
212
-
### Testing CORS Support
213
-
214
-
You can verify CORS support with one of three techniques:
215
-
216
-
- Curl your API and inspect the headers. For instance:
This tells us that the petstore resource listing supports OPTIONS, and the following headers: `Content-Type`, `api_key`, `Authorization`.
230
-
231
-
- Try swagger-ui from your file system and look at the debug console. If CORS is not enabled, you'll see something like this:
232
-
233
-
```
234
-
XMLHttpRequest cannot load http://sad.server.com/v2/api-docs. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
235
-
```
236
-
237
-
Swagger-UI cannot easily show this error state.
238
-
239
-
- Using the http://www.test-cors.org website. Keep in mind this will show a successful result even if `Access-Control-Allow-Headers` is not available, which is still required for Swagger-UI to function properly.
240
-
241
-
### Enabling CORS
242
-
243
-
The method of enabling CORS depends on the server and/or framework you use to host your application. http://enable-cors.org provides information on how to enable CORS in some common web servers.
244
-
245
-
Other servers/frameworks may provide you information on how to enable it specifically in their use case.
246
-
247
-
### CORS and Header Parameters
248
-
249
-
Swagger lets you easily send headers as parameters to requests. The name of these headers *MUST* be supported in your CORS configuration as well. From our example above:
Only headers with these names will be allowed to be sent by Swagger-UI.
256
-
257
73
## Security contact
258
74
259
75
Please disclose any security-related issues or vulnerabilities by emailing [[email protected]](mailto:[email protected]), instead of using the public issue tracker.
0 commit comments