Skip to content

Swagger UI is a collection of HTML, JavaScript, and CSS assets that dynamically generate beautiful documentation from a Swagger-compliant API.

License

Notifications You must be signed in to change notification settings

resline/swagger-ui

Β 
Β 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

NPM version Build Status npm audit total GitHub contributors

monthly npm installs docker registry monthly packagist installs gzip size

Introduction

Swagger UI allows anyone β€” be it your development team or your end consumers β€” to visualize and interact with the API's resources without having any of the implementation logic in place. It's automatically generated from your OpenAPI (formerly known as Swagger) Specification, with the visual documentation making it easy for back end implementation and client side consumption.

Key Features

  • Enterprise-Grade Security: Enhanced authentication, OWASP compliance, and comprehensive security hardening
  • Full Internationalization: Complete i18n/l10n support with English and Spanish translations
  • Performance Monitoring: Built-in monitoring with Prometheus, Grafana, and ELK stack integration
  • Accessibility Compliant: WCAG 2.1 AA compliance for inclusive user experiences
  • Modern UI/UX: Dark/light theme toggle with improved user interface
  • Production-Ready: Docker deployment with security best practices and monitoring

General

πŸ‘‰πŸΌ Want to score an easy open-source contribution? Check out our Good first issue label.

πŸ•°οΈ Looking for the older version of Swagger UI? Refer to the 2.x branch.

This repository publishes three different NPM modules:

  • swagger-ui is a traditional npm module intended for use in single-page applications that are capable of resolving dependencies (via Webpack, Browserify, etc.).
  • swagger-ui-dist is a dependency-free module that includes everything you need to serve Swagger UI in a server-side project, or a single-page application that can't resolve npm module dependencies.
  • swagger-ui-react is Swagger UI packaged as a React component for use in React applications.

We strongly suggest that you use swagger-ui instead of swagger-ui-dist if you're building a single-page application, since swagger-ui-dist is significantly larger.

If you are looking for plain ol' HTML/JS/CSS, download the latest release and copy the contents of the /dist folder to your server.

Compatibility

The OpenAPI Specification has undergone 5 revisions since initial creation in 2010. Compatibility between Swagger UI and the OpenAPI Specification is as follows:

Swagger UI Version Release Date OpenAPI Spec compatibility Notes
5.19.0 2025-02-17 2.0, 3.0.0, 3.0.1, 3.0.2, 3.0.3, 3.0.4, 3.1.0, 3.1.1 tag v5.19.0
5.0.0 2023-06-12 2.0, 3.0.0, 3.0.1, 3.0.2, 3.0.3, 3.1.0 tag v5.0.0
4.0.0 2021-11-03 2.0, 3.0.0, 3.0.1, 3.0.2, 3.0.3 tag v4.0.0
3.18.3 2018-08-03 2.0, 3.0.0, 3.0.1, 3.0.2, 3.0.3 tag v3.18.3
3.0.21 2017-07-26 2.0 tag v3.0.21
2.2.10 2017-01-04 1.1, 1.2, 2.0 tag v2.2.10
2.1.5 2016-07-20 1.1, 1.2, 2.0 tag v2.1.5
2.0.24 2014-09-12 1.1, 1.2 tag v2.0.24
1.0.13 2013-03-08 1.1, 1.2 tag v1.0.13
1.0.1 2011-10-11 1.0, 1.1 tag v1.0.1

Anonymized analytics

SwaggerUI uses Scarf to collect anonymized installation analytics. These analytics help support the maintainers of this library and ONLY run during installation. To opt out, you can set the scarfSettings.enabled field to false in your project's package.json:

// package.json
{
  // ...
  "scarfSettings": {
    "enabled": false
  }
  // ...
}

Alternatively, you can set the environment variable SCARF_ANALYTICS to false as part of the environment that installs your npm packages, e.g., SCARF_ANALYTICS=false npm install.

Quick Start Guide

Basic Installation

npm install swagger-ui

Enable Internationalization

// Enable i18n with Spanish support
SwaggerUI({
  url: 'https://petstore.swagger.io/v2/swagger.json',
  dom_id: '#swagger-ui',
  locale: 'es', // or 'en' for English
})

Theme Toggle

The UI now includes a built-in dark/light theme toggle in the top navigation bar. Users can switch themes instantly for better accessibility and user preference.

Docker Deployment

# Production deployment with monitoring
docker-compose -f docker-compose.prod.yml up -d

# Access Grafana dashboard at http://localhost:3000
# Access Swagger UI at http://localhost:80

Security Configuration

Refer to SECURITY_DEPLOYMENT.md for comprehensive security setup including:

  • HTTPS configuration
  • Authentication setup
  • CORS policies
  • Content Security Policy (CSP)

New Features

Security Features

  • Enhanced Authentication: Multi-layer security with JWT and OAuth2 support
  • OWASP Compliance: Protection against top 10 security vulnerabilities
  • Content Security Policy: Prevents XSS and injection attacks
  • Secure Headers: HSTS, X-Frame-Options, and other security headers
  • Rate Limiting: Built-in protection against abuse

For detailed security implementation, see SECURITY_DEPLOYMENT.md

Performance Monitoring

  • Prometheus Metrics: Real-time performance and usage metrics
  • Grafana Dashboards: Visual monitoring with pre-built dashboards
  • ELK Stack Integration: Centralized logging and analysis
  • Performance Optimization: Automated bundle analysis and optimization

For performance setup details, see PERFORMANCE_OPTIMIZATION.md

Internationalization

  • Multi-language Support: Currently supports English and Spanish
  • Runtime Language Switching: Change languages without page reload
  • Extensible Translation System: Easy to add new languages
  • RTL Support Ready: Framework prepared for right-to-left languages

For i18n implementation guide, see I18N_IMPLEMENTATION.md

Accessibility

  • WCAG 2.1 AA Compliance: Full accessibility standard compliance
  • Keyboard Navigation: Complete keyboard accessibility
  • Screen Reader Support: Optimized for assistive technologies
  • High Contrast Mode: Enhanced visibility options
  • Focus Management: Proper focus handling throughout the UI

Docker Deployment

  • Multi-stage Builds: Optimized container images
  • Security Hardening: Non-root user, minimal attack surface
  • Health Checks: Built-in container health monitoring
  • Production Configurations: Ready-to-use production setups
  • Secrets Management: Secure handling of sensitive configuration

Monitoring and Observability

  • Application Metrics: Response times, error rates, usage patterns
  • Infrastructure Monitoring: Container and host metrics
  • Log Aggregation: Centralized logging with search capabilities
  • Alerting: Configurable alerts for critical issues
  • Custom Dashboards: Extensible monitoring setup

Documentation

Usage

New Feature Documentation

Customization

Development

Contributing

Integration Tests

You will need JDK of version 7 or higher as instructed here https://nightwatchjs.org/guide/getting-started/installation.html#install-selenium-server

Integration tests can be run locally with npm run e2e - be sure you aren't running a dev server when testing!

Browser support

Swagger UI works in the latest versions of Chrome, Safari, Firefox, and Edge.

Known Issues

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.

  • Only part of the parameters previously supported are available.
  • The JSON Form Editor is not implemented.
  • Support for collectionFormat is partial.
  • Relative path support for external files is not implemented.

Recently Resolved

  • βœ… l10n (translations): Now fully implemented with English and Spanish support
  • βœ… Accessibility: WCAG 2.1 AA compliance implemented
  • βœ… Security: Enterprise-grade security features added
  • βœ… Performance: Comprehensive monitoring and optimization implemented

Security contact

Please disclose any security-related issues or vulnerabilities by emailing [email protected], instead of using the public issue tracker.

License

SwaggerUI is licensed under Apache 2.0 license. SwaggerUI comes with an explicit NOTICE file containing additional legal notices and information.

About

Swagger UI is a collection of HTML, JavaScript, and CSS assets that dynamically generate beautiful documentation from a Swagger-compliant API.

Resources

License

Security policy

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 88.5%
  • SCSS 6.5%
  • HTML 2.5%
  • Shell 1.9%
  • Makefile 0.3%
  • Dockerfile 0.3%