머리말
프런트 엔드 및 백 엔드 분리 개발 모델의 인기로 인해 인터페이스 도킹 및 공동 디버깅이 일반화되었습니다. 프런트 엔드 동료는 종종 다음과 같은 질문을 할 것입니다. 어떤 인터페이스를 조정해야합니까? 이 인터페이스의 데이터 형식은 무엇입니까? 조건은 무엇입니까? 일부 비상 인터페이스의 경우 통신 및 도킹이 채택 된 다음 문서가 보완되고 나머지는 문서를보십시오. 개발 중에 문서를 작성해야합니까? 초창기의 경우 였지만 백엔드 동료에게는 매우 불편했습니다. 코드가 열심히 작동하고 갑자기 문서를 작성해야했습니다 (그렇지 않으면 프론트 엔드 동료가 항상 촉구하거나 의사 소통하러옵니다). 분명히 그리 효율적이지 않습니다. 그리고 Swagger는 문제를 편안하게 해결할 수 있습니다 (물론 다른 방법이 있습니다. 더 인기있는 방법을 선택하십시오). Swagger를 사용하면 다음과 같은 이점이 있습니다.
좋은 시각적 인터페이스, 온라인으로 볼 수 있음 (사용자 지정 가능)
프런트 엔드 및 백 엔드 도킹은 코드를 작성하는 동안 문서 작성을 피하는 데 편리합니다.
자체 테스트의 효율성을 높이기 위해 API 작업을 직접 수행 할 수 있습니다.
문서 생성은 편리하며 타사 API 인터페이스 관리 플랫폼 (YApi 등)과 결합되어 문서를 쉽게 생성 할 수 있습니다 (소프트웨어 파일 파일링에는 많은 문서가 필요함). 문서가 필요없고 코딩에 더 많은 시간이 필요합니다 ~~~
본문
사례 데모, 이전 규칙 또는 친숙한 WebApi 프로젝트로 바로 이동합니다.
데모 실행 :
컴포넌트 등록시 설정 한 이름이 미들웨어 등록시 설정 한 json 주소의 이름과 다른 경우 다음 오류가보고됩니다.
Swagger의 통합을 완료하는 간단한 3 단계 : 설치 패키지-> 등록 된 구성 요소-> 등록 된 미들웨어;
하지만 실행시 URL 주소를 수동으로 입력해야하는데,별로 친근하지 않습니다. 실행시 바로 Swagger 페이지가 되길 바랍니다. 코드는 다음과 같이 최적화되어 있습니다.
끝났어? 물론 그렇지 않습니다. 따라서 프런트 엔드 동료는 항상 다음과 같은 질문을해야합니다. 어떤 인터페이스를 사용할까요? 인터페이스 매개 변수 필드는 무엇을 의미합니까? 인터페이스 목록이 표시되지만 인터페이스 기능을 모르지만 수신 조건 매개 변수 필드는 무엇을 의미합니까?
와서 문제를 해결하기 위해 의견을 추가하십시오.
새로 추가 된 사용자 인터페이스는 자동으로 나열되었지만 코드에 주석을 달았지만 Swagger 인터페이스는 여전히 표시되지 않습니다. 이는 Swagger의 주석 소스가 지정되지 않았기 때문입니다. 여기서 문제에주의하십시오. 작업에 지정된 HttpMethod (예 : HttpGet, HttpPost 등)가 표시되지 않으면 Swagger는 다음과 같은 오류를보고합니다.
오세요, 우리의 댓글은 아직 표시되지 않았습니다. 계속 아래를보세요 ↓↓↓
먼저 API 프로젝트 및 모델 프로젝트 구성에 해당하는 xml 파일을 생성하십시오.
코드를 추가하고 구성 파일을 지정하여 주석을 구문 분석 한 다음 데모를 실행하십시오.
이것으로 Swagger 온라인 문서에 텍스트 설명 추가를 완료하여 프런트 엔드 및 백엔드 도킹 문제를 해결합니다. 그러나 컴파일하고 실행할 때 주석이없는 경고가 많이 표시됩니다 (CS1591).
xml 파일을 생성하려면 주석이 필요하기 때문입니다. 프로그래머의 청결 상 허용되지 않습니다. 작은 빨간색 상자는 코드가 1591임을 나타냅니다.이 코드를 프로젝트 오른쪽 클릭-> 속성-> 생성 인터페이스에 추가합니다. 예, 다음과 같습니다.
컴파일하고 다시 실행하세요, 경고가 없나요, 깨끗이 편해요 ~~~~~
주석을 읽기 위해 xml을 구성 할 때 두 번째 매개 변수를 사용하지 않으면 기본 컨트롤러 주석이 쓸모없고 여기에서 데모가 실행되지 않습니다. 코드 설명은 다음과 같습니다.
Swagger의 통합은 거의 완료되었으며 향후 인증 중에 확장 될 것입니다.
Swagger 페이지의 경우 개발이 확실히 만족 스러울 수 있지만 항상 엄격한 미학 또는 페이지 사용자 정의 요구 사항이 있으므로 사용자 정의 페이지는 피할 수 없습니다. 친구들은 Swagger 만 프로젝트에 설치되어 있음을 알게 될 것입니다. 패키지에 해당하는 정적 파일이 없습니다. 어떻게 액세스합니까? 영감을받은 Swagger, 제 친구들은 이전에 파일 시스템에서 언급 한 임베디드 파일 (어셈블리로 컴파일 된 파일)을 생각했을 것입니다. 기본적으로 Swagger 관련 파일은 모두 임베디드 파일이므로 프로젝트에서 볼 수 없습니다. 에. 페이지를 사용자 정의하는 세 가지 방법이 있습니다.
Swagger의 페이지는 앞뒤로 분리되어 있으며 직접 다운로드 및 확장 할 수 있습니다.
홈 페이지를 직접 작성한 다음 관련 JS를 삽입하고 마지막으로 지정된 로딩 페이지를 표시하기 위해 임베디드 파일로 변경하십시오.
기본적으로 Swagger에서 제공하는 API를 통해 페이지 사용자 정의를 위해 관련 Js 파일을 삽입하십시오.
상대적으로 말하면 첫 번째 코드는 상대적으로 명확하고 코드는 백엔드 코드와 관련이 없습니다. 따라서 여기서 첫 번째 코드를 데모 용으로 사용하고 나머지 두 개는 친구가 탐색하고 탐색 할 수 있도록 남겨 둡니다.
대략적인 단계 :
먼저 Swagger 프런트 엔드 및 백엔드 프로젝트 파일을 다운로드합니다 (다운로드 주소 : https://github.com/swagger-api/swagger-ui/).
dist에 다운로드 한 파일을 WebApi의 wwwroot 디렉토리에 복사합니다.
WebApi는 정적 파일 처리 기능, 즉 정적 파일 미들웨어 등록을 가능하게합니다.
정적 파일을 수정합니다 (파일은 로컬이며 원하는대로 수행합니다).
효과를 보려면 실행하십시오.
이것은 단지 아이디어를 제공하기위한 것입니다. 스타일이 좋지 않습니다. 나에게 말하지 마십시오 (말하지 않을 것입니다. 맞습니다). 미화는 시간 문제 일뿐입니다. 사용자 정의 인터페이스는 그렇게 간단합니다.
두 가지 팁을 추가하십시오.
일반적으로 일부 인터페이스는 구식이지만 즉시 폐기 할 수없는 경우 알림을 제공 할 수 있습니다. [Obsolete] 기능을 추가하면 구식이지만 여전히 사용할 수 있으며 교체 할 전환 기간이 있습니다.
Swagger 문서에 일부 인터페이스를 표시하지 않으려는 경우도 있습니다. [ApiExplorerSettings (IgnoreApi = true)]를 추가 할 수 있습니다.
요약하자면
이 기사를 보면 왜 그렇게 간단한 통합에 대해 그렇게 많이 이야기해야하는지 궁금 할 것입니다. 사실 저는 이전 연구의 관점에서 서서 각각의 사용법을 명확하게 표현하고 싶습니다.이를 사용할 때 왜 그런지 알고 있으므로 후속 기사는 점진적으로 Docker 배포로 이동하지 않을 것입니다. 게이트웨이에서 사용합니다. Docker를 배우지 않았다면 문서를 볼 때 혼란 스러울 것입니다. 사례를 따라도 많은 결과를 얻지 못할 것입니다. 걱정하지 마십시오. 말해야 할 모든 것이 하나씩 올 것입니다. 동시에 저는 계속해서 배우고 공유하려고 노력할 것입니다. 더 많은 기술 지식. 다음 섹션에서는 Jwt 인증 통합 사용에 대해 설명합니다.
프로그램에 못생긴 미남이 "코드 버라이어티 쇼"에 주목하고 나를 알아보고 따라 와서 배운다 ~~~
글쓰기가 쉽지 않아 그냥 쳐다 보지 말고 세 번 연속 ~~~~