OpenAPI 사용자 인터페이스 사용자 정의

/openapi/ui 및 /api/explorer 엔드포인트에서 사용 가능한 OpenAPI 사용자 인터페이스의 요소를 사용자 정의할 수 있습니다. Liberty 는 OpenAPI UI에 대한 변경사항을 처리하고 업데이트하기 위해 사용자 정의 CSS 파일에 대한 변경사항을 모니터합니다.

1. CSS 파일을 사용자 정의하여 OpenAPI UI의 헤더 막대에서 HTML 요소의 스타일을 편집하십시오.
   이 CSS 파일은 유효한 것으로 간주되는 다음 형식 요구사항을 갖습니다.

   • CSS 파일은 .swagger-ui .headerbar로 시작하는 요소를 하나 이상 지정합니다.
   • .swagger-ui .headerbar로 시작하는 CSS 요소 아래에 지정된 컨텐츠만 사용됩니다.
   • CSS 파일에서 참조하는 사용자 정의 로고 파일은 PNG 형식이어야 합니다.
   • 사용자 정의 로고 파일의 이름은 custom-logo.png이어야 하며 images/custom-logo.png에 위치해야 합니다.
   • 로고 파일 경로는 CSS 파일과 관련이 있어야 합니다.
   • CSS 파일은 background-image 특성이 url(images/custom-logo.png) 값으로 설정된 로고 이미지를 참조해야 합니다.

   다음 스니펫은 CSS 파일을 대체하는 방법에 대해 설명합니다.

   .swagger-ui .headerbar {
      background-color: #5f3345;
   }
    .swagger-ui .headerbar .headerbar-wrapper {
      background-image: url(images/custom-logo.png);
   }
   

2. 사용자 정의 파일에 대한 파일 모니터링을 구성하십시오.

   자동 모니터링을 위해 $server.config.dir/mpopenapi/customization.css 및  $server.config.dir/openapi-3.1/customization.css 위치에 사용자 정의 CSS 파일을 저장할 수 있습니다. 첫 번째 CSS 파일의 위치는 /openapi/ui 엔드포인트에 적용됩니다. 두 번째 CSS 파일의 위치는 /api/explorer 엔드포인트에 적용됩니다. 사용자 정의 로고도 지정하려면 $server.config.dir/mpopenapi/images/custom-logo.png 및 $server.config.dir/openapi-3.1/images/custom-logo.png 위치에 저장한 다음 두 위치 모두에 있는 CSS 파일에서 참조하십시오.

   참고: CSS 파일만 업데이트에 대해 모니터됩니다. 로고 파일은 모니터링하지 않습니다. 로고 파일 중 하나를 변경한 다음 해당 CSS 파일을 업데이트하여 동적으로 변경사항을 적용해야 합니다.
3. 선택사항: 사용자 정의 파일에 대한 파일 모니터링을 제어하십시오.

   Liberty 는 기본적으로 CSS 사용자 정의 파일을 지속적으로 모니터합니다. 그러나 파일을 모니터링하면 추가 시스템 자원이 사용됩니다. 업데이트를 위해 모니터링되는 파일을 확인하는 빈도를 변경할 수 있습니다. 사용자 정의 파일이 없는 경우 파일 모니터링을 끄는 것이 좋습니다.

   구성 특성 mp.openapi.extensions.liberty.file.polling.interval에서 업데이트를 위해 모니터링되는 파일을 확인하는 빈도를 지정합니다. 이 특성의 값은 음수로 된 정수입니다. 간격의 단위는 초입니다. 기본값은 2초입니다. 값을 0으로 설정하면 파일 모니터링이 사용 안함으로 설정됩니다.

   구성은 MicroProfile 구성 스펙으로 삽입됩니다.

   참고: 이 특성의 값은 mpOpenAPI-1.0 또는 openapi-3.1 기능이 사용으로 설정된 경우에만 확인됩니다.