[ASP.NET Core] .NET Core로 구현한 SPA(Single Page Applications)(5) - 스웨거(Swagger) 설정
WebAPI를 쓴다면 스웨거를 빼놓을 수 없습니다.
스웨거는 WebAPI 문서를 자동화 해주는 해주는 라이브러리입니다.
( 참고 : 위키백과 - 스웨거 (소프트웨어) )
문서화뿐만 아니라 바로 테스트도 할 수 있으므로 프론트엔드 개발자와 소통이 편해지죠.
[ASP.NET Core] 빈 프로젝트 세팅 (1) - 'index.html'을 시작페이지로 설정하기
[ASP.NET Core] 빈 프로젝트 세팅 (2) - WebAPI 설정
[ASP.NET Core] .NET Core로 구현한 SPA(Single Page Applications)(1) - 기초
[ASP.NET Core] .NET Core로 구현한 SPA(Single Page Applications)(2) - Ajax공통 기능, 데이터 바인드 처리
[ASP.NET Core] .NET Core로 구현한 SPA(Single Page Applications)(3) - API 결과 공통 처리
[ASP.NET Core] .NET Core로 구현한 SPA(Single Page Applications)(4) - 인증 기능 추가
[ASP.NET Core] .NET Core로 구현한 SPA(Single Page Applications)(5) - 스웨거(Swagger) 설정
1. 스웨거 설치
누겟에서 다음 4개를 찾아서 설치합니다.
버전은 4.x 를 설치합니다.
( 참고 : microsoft docs - Swashbuckle 및 ASP.NET Core 시작 )
Swashbuckle.AspNetCore | ASP.NET Core Swagger 를 사용하기 위한 코어 |
Swashbuckle.AspNetCore.Swagger | SwaggerDocument 개체를 JSON 엔드포인트로 노출하기 위한 Swagger 개체 모델 및 미들웨어. |
Swashbuckle.AspNetCore.SwaggerGen |
경로, 컨트롤러 및 모델에서 직접 SwaggerDocument 개체를 빌드하는 Swagger 생성기. 일반적으로 Swagger 엔드포인트 미들웨어와 결합되어 자동으로 Swagger JSON을 노출합니다. |
Swashbuckle.AspNetCore.SwaggerUI | Swagger UI 도구의 포함된 버전. Swagger JSON을 해석하여 웹 API 기능을 설명하기 위한 다양한 사용자 지정 가능한 환경을 빌드합니다. 여기에는 공용 메서드에 대한 기본 제공 테스트 도구가 포함됩니다. |
2. 스워거 설정
'Startup.cs'의 'ConfigureServices'에 아래 코드를 추가합니다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | //스웨거 문서정보를 생성 한다. services.AddSwaggerGen(c => { c.SwaggerDoc("v1" , new Info { Title = "SPA NetCore Foundation API" , Description = "[ASP.NET Core] .NET Core로 구현한 SPA(Single Page Applications)(5) - 스웨거(Swagger) 설정 <br /> https://blog.danggun.net/7689" , Version = "v1" , Contact = new Contact { Name = "Dang-Gun Roleeyas", Email = string.Empty, Url = "https://blog.danggun.net/" } , License = new License { Name = "MIT", Url = "https://opensource.org/licenses/MIT" } }); }); | cs |
'Configure'에는 다음 코드를 추가합니다.
1 2 3 4 5 6 7 8 9 | //스웨거 미들웨어 설정 app.UseSwagger(); //스웨거 UI 활성화 app.UseSwaggerUI(c => { c.SwaggerEndpoint("/swagger/v1/swagger.json", "My API V1"); //c.RoutePrefix = string.Empty; }); | cs |
실행하고 주소 뒤에 'swagger'를 붙이면 스웨거가 생성해준 페이지가 실행됩니다.
2-2. 주석 표시 기능 사용하기
주석을 스웨거에 표시할 수 있습니다.
프로젝트 속성 > 빌드 > 출력
'XML 문서 파일' 옵션을 체크 합니다.
경로를 "\SPA_NetCore_Foundation05.xml"와 같이 해줍니다.
'Startup.cs' 파일에서 'ConfigureServices'함수에 위에서 추가한 'services.AddSwaggerGen'코드 안에 아래 코드를 추가합니다.
1 2 | //주석 표시기능 c.IncludeXmlComments(string.Format(@"{0}\SPA_NetCore_Foundation05.xml", System.AppDomain.CurrentDomain.BaseDirectory)); | cs |
이제 테스트를 해봅시다.
3. 인증 토큰 사용
엑세스 토큰(access token)이 필요한 API의 경우 토큰을 미리 입력할수 있는 UI를 제공해야 합니다.
'Startup.cs'의 'c.SwaggerDoc'선언 끝에 아래 코드를 추가합니다.
1 2 3 4 5 6 7 8 9 10 11 12 13 | //인증UI ************************************** c.AddSecurityDefinition("Bearer", new ApiKeyScheme { In = "header", Description = "로그인 후 전달받은 'ExternalKey'를 헤더의'MgrExternalKey' 담아 전달해야 합니다.", Name = "Authorization", Type = "apiKey" }); c.AddSecurityRequirement(new Dictionary<string, IEnumerable<string>> { { "Bearer", new string[] { } } }); | cs |
이제 스웨거의 오른쪽에 'Authorize' 버튼이 생깁니다.
이 버튼을 누르면 인증키를 입력할 수 있는 UI가 표시됩니다.
여기에
Bearer [access token]
형식으로 키를 입력합니다.
엑세스 토큰이 있어야 하는 API는 '/api/Test/Test02'입니다.
이걸 호출합니다.
헤더에 값이 정확하게 들어갔습니다.
결과도 잘 나오네요.
오류 1. Fetch error : Internal Server Error
오류 내용은 아래와 같습니다.
Fetch error
Internal Server Error /swagger/v1/swagger.json
컨트롤러에 메소드를 잘못지정하면 나는 오류입니다.
적절한 메소드를 지정해 줍시다.
마무리
완성된 샘플 : Github dang-gun - SPA_NetCore_Foundation/SPA_NetCore_Foundation/SPA_NetCore_Foundation05/
스웨거만 연결해놔도 프론트엔드(front-end)나 외부로 API를 공개했을 때 문서 양이 확 줄어듭니다.
거기다 다른 사람이 직접 호출해서 테스트할 수 있으니 잘못된 동작이 있으면 빠르게 피드백이 가능해집니다.
우리 모두 오픈소스의 축복을!