Implement swagger 3

✅ swagger v3

🔴 HTTPS CORS error

However, there kept happening a CORS error

🔵 What I tried

In browser, I was using https.
However, the generated server url in swagger seemed to be http
So I decided to change http to https.

🟢 Solution

In SwaggerConfig, I added server and server url

@Configuration
@OpenAPIDefinition(
        info = @io.swagger.v3.oas.annotations.info.Info(
                title = "DrugstoreShop project",
                description = "원하는 상품을 장바구니에 담아 살 수 있는 기능을 제공합니다",
                version = "1.0.0"
        ),
        servers = {
                @Server(url = "https://drugstoreproject.shop", description = "Generated server url") //🟢 add server url
        }
)

public class SwaggerConfig {
  //swagger config
}

Now, the page looks like this.
And the CORS error was gone.

🔴 Required Token Problem

The cors error was fixed, and APIs that do not require tokens were run successfully.
However, we stil need to fix the problem of APIs that need token.
If APIs are run without token, I got a 500 error.

🔵 Identify cause of error

THe problem is because there is no token, when the API requires token.

🟢 Add token in swagger

✔️ add build.gradle

 implementation 'org.springdoc:springdoc-openapi-ui:1.7.0'

✔️ add to SwaggerConfig
💡 Reference https://velog.io/@ryulkim/Spring-boot-JWT%EC%99%80-Swagger-JWT-%EC%A0%81%EC%9A%A9%ED%95%98%EA%B8%B0

private SecurityScheme createAPIKeyScheme() {
    return new SecurityScheme().type(SecurityScheme.Type.HTTP)
        .bearerFormat("JWT")
        .scheme("bearer");
}

🔴 HTTP Error

However, it was not run.
There seemed to be HTTP error.
The blog reference uses http, whereas I am using https

🔵 Swagger Security Scheme type

I realized there are various Swagger Security Scheme types.
💡 Reference https://swagger.io/docs/specification/authentication/basic-authentication/
💡 Reference https://swagger.io/docs/specification/authentication/api-keys/

I leaned that I have to use APIKEY.
If I am using HTTPS/SSL, I have to use type APIKEY.

🟢 change type to APIKEY

    private SecurityScheme createAPIKeyScheme() {
        return new SecurityScheme()
                .type(SecurityScheme.Type.APIKEY)
                .in(SecurityScheme.In.HEADER)
                .bearerFormat("JWT")
                .scheme("bearer");
    }

Finally, I made Authorize button in swagger.
I could login and get the token.
And also I could put token in the Authorize button.

🔴 Header name difference error

However, for some reason, it would not recognize the token.

🔵 Identify cause of error

I looked closely at postman, developer tools and swagger,
I realized the name of developer tools and swagger is different!

• Developer tools token
  name of token is Token
  

• Swagger token
  name of token is Authorization
  

🟢 Change the token header name of swagger

I decided to change the swagger token header name.

public class SwaggerConfig {
    @Bean
    public OpenAPI openAPI() {
        return new OpenAPI().addSecurityItem(new SecurityRequirement().
                        addList("Bearer token"))
                .components(new Components().addSecuritySchemes
                        ("Bearer token", createAPIKeyScheme())) //🟢 change
                .info(new Info().title("DrugstoreShop project")
                        .description("원하는 상품을 장바구니에 담아 살 수 있는 기능을 제공합니다.")
                        .version("1.0.0"));
    }

    private SecurityScheme createAPIKeyScheme() {
        return new SecurityScheme()
                .type(SecurityScheme.Type.APIKEY)
                .in(SecurityScheme.In.HEADER)
                .name("token") //🟢 change
                .bearerFormat("JWT")
                .scheme("bearer");
    }

}

Finally, all APIs recognize the token and works perfectly.
My swagger has been finished!

🟢 Swagger Link

https://drugstoreproject.shop/swagger-ui/index.html#/