Apidog

Plataforma Colaborativa All-in-one para Desenvolvimento de API

Design de API

Documentação de API

Depuração de API

Mock de API

Testes Automatizados de API

Como Alterar o Caminho Defauth da URL do Swagger UI

Miguel Oliveira

Miguel Oliveira

Updated on novembro 29, 2024

Swagger UI é uma ótima ferramenta para visualizar e interagir com especificações OpenAPI. Ao trabalhar com Swagger UI, você notará que as URLs desempenham um papel importante na configuração e acesso à documentação da API. Neste post, vamos desmistificar as URLs do Swagger UI para ajudá-lo a usá-las de forma mais eficaz.

💡
Apidog é uma poderosa ferramenta de documentação de API para você. Você pode facilmente personalizar o prefixo da URL do Swagger UI e outros parâmetros na interface visual. Vamos experimentar!
botão

O que é um Swagger UI?

Swagger UI é uma ferramenta que permite ao usuário interagir com APIs usando a documentação da Especificação OpenAPI. Ela lê o documento de especificação e o exibe em um formato visualmente interativo. Isso ajuda os desenvolvedores a entenderem as APIs, enviar requisições de teste, debugar e usar suas APIs REST.

A URL do Swagger UI corresponde ao endpoint onde você serve o seu arquivo JSON da especificação OpenAPI. Isso significa que você precisa fornecer um endereço da web que aponte para a localização do seu arquivo JSON OpenAPI. O Swagger UI lê esse arquivo para criar uma interface amigável acessível através dessa URL. A estrutura exata da URL pode variar devido a configurações de servidor variadas.

Recursos do Swagger UI

O Swagger UI é uma ferramenta poderosa que fornece uma variedade de recursos para testar, entender e visualizar APIs. Alguns recursos são mencionados abaixo:

Os recursos principais incluem:

  • Teste ao vivo das APIs diretamente na documentação
  • Controles intuitivos para parâmetros de requisição
  • Geração de trechos de código para chamadas de API
  • Suporte a Markdown para formatação
  • Ferramentas para colaboração em equipe
  • Visualização automática do modelo de dados
  • Organização e busca de endpoints de API

Parâmetros de URL do Swagger UI

O Swagger UI possui vários parâmetros na URL para configurar seu comportamento e aparência. Esses afetam como a documentação da API é exibida usando o Swagger UI. Alguns dos parâmetros de URL do Swagger UI mais comumente usados são:

URL:

Isso especifica a URL do arquivo da especificação OpenAPI que o Swagger UI deve usar para gerar a documentação da API. O formato da URL é o seguinte:

http://localhost:8080/swagger-ui/?url=/caminho/para/sua/especificacao-api.json

ConfigUrl:

configUrl fornece a URL de uma configuração JSON que personaliza e altera o comportamento do Swagger UI.

http://localhost:8080/swagger-ui/?configUrl=/caminho/para/sua/config.json

deepLinking:

Isso habilita linking profundo para operações individuais ou tags na documentação da API. É benéfico ao compartilhar links diretos para partes específicas da documentação.

http://localhost:8080/swagger-ui/?url=/caminho/para/sua/especificacao-api.json&deepLinking=true

oauth2RedirectUrl:

Isso permite que os usuários redirecionem para outra URL após a autenticação bem-sucedida quando sua API requer autenticação OAuth 2.0.

http://localhost:8080/swagger-ui/?url=/caminho/para/sua/especificacao-api.json&oauth2RedirectUrl=https://seu-app.exemplo.com/oauth2-redirect

defaultModelsExpandDepth:

Isso ajusta a profundidade padrão dos modelos na documentação.

http://localhost:8080/swagger-ui/?url=/caminho/para/sua/especificacao-api.json&defaultModelsExpandDepth=2

Como encontrar a URL do Swagger UI

Algumas pessoas estão confusas sobre onde está a URL do Swagger UI. Ela é gerada com base na configuração do seu projeto. Para encontrar a URL, siga estes passos:

  1. Certifique-se de que seu projeto está configurado para gerar a documentação Swagger.
  2. Para acessar o Swagger UI, você precisa combinar a URL base da sua API com o endpoint da documentação Swagger. Isso resultará na sua URL do Swagger UI.

Por exemplo, se você está hospedando sua API em http://localhost:3000 e seu endpoint swagger é /swagger-ui/, então sua URL do Swagger se tornará http://localhost:8080/swagger-ui/.

Se você ainda estiver com problemas para encontrar sua URL do Swagger UI, pode consultar a documentação do framework ou biblioteca que está usando para gerar suas APIs. Isso ajudará a fornecer informações sobre como acessar a URL para sua configuração específica.

Como mudar o caminho padrão do Swagger UI?

O caminho padrão do seu Swagger UI depende das configurações do seu servidor. Ele é construído com base na localização e onde você implantou o Swagger UI. Os caminhos de URL padrão podem ser alterados de acordo com os requisitos do usuário e a implantação. O parâmetro de URL na URL deve apontar para a localização do arquivo da especificação OpenAPI.

Existem muitos métodos para mudar o caminho padrão da URL do Swagger UI.

Alterando o arquivo de configuração do Swagger (Apache e Nginx):

Se você está usando um servidor web, pode alterar as configurações do seu servidor para lidar com requisições em uma URL específica.

Apache:

No caso do Apache, você pode modificar seu arquivo de configuração para criar uma regra de reescrita para que as requisições possam ser redirecionadas para o seu caminho do Swagger UI. Você deve abrir seu arquivo de configuração, frequentemente nomeado ‘httpd.conf’ ou ‘apache2.conf’. Adicione sua regra de reescrita para o seu caminho desejado neste arquivo.

RewriteEngine On
RewriteRule ^/api-docs/(.*)$ /caminho/para/seu/swagger-ui/$1 [L]

Você pode reiniciar seu servidor Apache para que as alterações sejam refletidas.

Nginx:

Se você está usando o Nginx, deve atualizar o arquivo de configuração do seu servidor para definir uma localização para lidar com suas requisições. No bloco do servidor, adicione sua localização.

server {
    listen 80;
    server_name seu-dominio.com;

    location /api-docs {
        alias /caminho/para/seu/swagger-ui;
        index index.html;
    }
}

Verifique se há erros de sintaxe após fazer as alterações e recarregue seu Nginx para que as mudanças sejam refletidas.

Usando frameworks como Express.js:

Usando o Express.js, você pode configurar suas rotas para lidar com requisições do Swagger UI.

Para servir o Swagger UI, você deve definir uma rota no seu arquivo de servidor Express.js.

const express = require('express');
const app = express();

app.use('/caminho-personalizado', express.static('swagger-ui'));

app.listen(3000, () => {
  console.log('Servidor está rodando na porta 3000');
});

Isso permitirá que você acesse seu Swagger UI no seu ‘caminho-personalizado’.

Aproveitando o Springboot para mudar o caminho padrão:

Em uma aplicação Spring Boot, você pode modificar os arquivos ‘application.properties’ ou ‘application.yml’. Você pode adicionar a seguinte propriedade para mudar o caminho padrão do Swagger UI nos seus arquivos ‘application.properties’ ou ‘application.yml’.

springfox.documentation.swagger-ui.path=/caminho-personalizado

Você pode substituir ‘/caminho-personalizado’ de acordo com seu caminho desejado.

Em seguida, você precisa configurar um bean para personalizar o caminho. Você pode estender ‘WebMvcConfigurerAdapter’ para alcançar isso.

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ViewControllerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class SwaggerUIConfiguration implements WebMvcConfigurer {

    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addRedirectViewController("/caminho-personalizado", "/swagger-ui.html");
    }
}

Assegure-se de que você tenha as dependências necessárias no Swagger para obter esses resultados.

Você então precisa configurar a classe principal da sua aplicação.

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import springfox.documentation.builders.ApiInfoBuilder;
import springfox.documentation.service.ApiInfo;
import springfox.documentation.spring.web.plugins.Docket;
import springfox.documentation.swagger2.annotations.EnableSwagger2;

@Configuration
@EnableSwagger2
public class SwaggerConfiguration {

    @Bean
    public Docket api() {
        return new Docket(DocumentationType.SWAGGER_2)
                .apiInfo(apiInfo())
                .select()
                .apis(RequestHandlerSelectors.basePackage("seu.pacote.nome"))
                .paths(PathSelectors.any())
                .build();
    }

    private ApiInfo apiInfo() {
        return new ApiInfoBuilder()
                .title("Documentação da Sua API")
                .version("1.0")
                .build();
    }
}

Substitua “seu.pacote.nome” pelo pacote base dos seus controladores.

Inicialização do Swagger UI:

Você pode ajustar o parâmetro ‘url’ para refletir seu caminho de URL desejado. Isso permitirá mudar o caminho padrão do Swagger UI. Ao inicializar o Swagger UI em JavaScript, você pode fazer as seguintes mudanças.

const ui = SwaggerUIBundle({
  url: "/caminho-personalizado/swagger.json", 
});

Usando o Swagger UI para testar APIs

Assim como outras ferramentas de teste de API, como Apidog, o Swagger UI fornece uma maneira eficiente e amigável de testar APIs. Você deve seguir certos passos para debugar e testar suas APIs usando o site do Swagger. Clique em Demonstração Ao Vivo e comece a explorar o Swagger UI. Você verá uma janela como esta se abrir.

Swagger Petstore

Você pode explorar vários métodos HTTP/HTTPS como POST, GET, PUT, etc.

Você pode clicar em qualquer método e explorar. Se você clicar no método POST, verá uma opção para carregar uma imagem e atualizar os parâmetros do método. Você pode pressionar ‘Executar’ e sua requisição será executada.

Parâmetros do Pet


Você pode ver a resposta para a requisição POST rolando para baixo.

resposta

Da mesma forma, você pode interagir com outros métodos apresentados e ver o que eles fazem. Isso lhe dará uma boa ideia de como o Swagger UI funciona.

Considere Apidog para uma documentação de API mais robusta além das capacidades do Swagger UI. O Apidog permite uma gestão completa do ciclo de vida da API incluindo design, simulação, teste, versionamento, colaboração e mais.

Com recursos avançados como integração de CI/CD e fluxos de trabalho em equipe, o Apidog oferece um conjunto de ferramentas mais completo para otimizar a entrega de APIs. Sua plataforma abrangente escala o desenvolvimento de APIs e melhora a produtividade.

Apidog CI/CD

Resolvendo problemas com Swagger UI Localhost

Se você enfrentar problemas com a URL do Swagger UI no localhost, existem vários passos de solução de problemas que você pode considerar para diagnosticar e resolver o problema.

  1. Certifique-se de que seu servidor API está em funcionamento. O Swagger UI não pode buscar a documentação se seu servidor tiver problemas para rodar.
  2. Verifique suas configurações do Swagger para ver se estão configuradas corretamente.
  3. Use a URL correta do Swagger UI com os endpoints corretos.
  4. Limpe o cache do seu navegador. Às vezes, erros inesperados podem ocorrer com dados em cache.
  5. Reinicie tanto seu servidor API quanto o navegador após fazer qualquer alteração.
  6. Verifique novamente o formato da URL que você está usando para acessar o Swagger UI.

Conclusão

Em conclusão, o Swagger UI está rapidamente ganhando popularidade entre os desenvolvedores devido às suas amplas técnicas de gerenciamento de API. Ele fornece documentação bem estruturada e uma interface amigável. Os usuários também podem visualizar modelos de dados enquanto fazem testes de API ao vivo, tornando-o uma boa escolha para teste e depuração de APIs.

Embora o Swagger UI tenha suas vantagens, também existem várias limitações que o usuário pode observar ao testar APIs. Ele fornece colaboração limitada entre desenvolvedores e não suporta integração com outras ferramentas de gerenciamento de API.













Como acessar a API do Claude 3.7 Sonnet e testar usando ApidogTutoriais

Como acessar a API do Claude 3.7 Sonnet e testar usando Apidog

Se você está empolgado com o último lançamento da Anthropic, Claude 3.7 Sonnet, e quer explorar suas capacidades através da API enquanto o testa com o Apidog, você está no lugar certo. 💡Antes de começarmos, deixe-me fazer uma rápida observação: baixe o Apidog gratuitamente hoje e otimize seu processo de teste de API, especialmente para explorar os poderosos recursos do Claude 3.7 Sonnet—perfeito para desenvolvedores que desejam testar modelos de IA de ponta como este!botão Vamos começar com a

@apidog

fevereiro 25, 2025

Como passar o x-API-key no cabeçalho?Tutoriais

Como passar o x-API-key no cabeçalho?

Desvende os segredos da segurança eficaz de APIs, dominando como passar x-API-key nos cabeçalhos. Este guia abrangente revelará a importância desse processo e como ferramentas como o Apidog podem facilitar seus esforços. Continue lendo para garantir que suas interações com a API permaneçam seguras!

Miguel Oliveira

agosto 12, 2024

Como corrigir o erro HTTP 405 Método Não Permitido no PostmanTutoriais

Como corrigir o erro HTTP 405 Método Não Permitido no Postman

O código de erro HTTP 405 ocorre quando você tenta acessar um servidor usando uma chave de API ou token de acesso inválido ou ausente. Neste artigo, veremos mais sobre o erro 405 e como corrigi-lo.

Miguel Oliveira

agosto 11, 2024