웹 접근 방식의 기본
아키텍처
웹 접근 방식의 경우 마이크로서비스와 거의 동일한 아키텍처를 사용합니다. 하지만 어떻게 구현되는지에 대해서 규정짓지 않기 때문에 특정 헤더에 민감하도록 만들수도 있습니다.
Accept: text/html, application/xhtml+xml
JavaScript
복사
다른 방법으로는 개벌 마이크로 프론트엔드를 위해 전용 웹 서버를 구성할 수 있지만, 데이터는 기존 API 서버를 이용해 읽는 방법입니다. 이는 많은 인프라 자원이 필요한 방법입니다.
마지막으로 고려할 사항은 API 게이트웨이와 같은 집계 계층입니다.
게이트 웨이를 도입한 방법의 장단점
마이크로서비스로부터 파생된 유사성, 순수성, 단순성과 같은 장점이 있습니다. 하지만 장점이 단점이 되기도 하는데, UX패턴을 사용하여 일관성을 유지해야 하기 때문에 마이크로서비스가 양립하기 어렵습니다.
이를 위해 링크와 iframe을 사용해 서로 다른 마이크로 프론트엔드를 참조하거나 사용할 수 잇습니다.
웹 접근방식이 사용해야 하는 상황은 일관성이 필요하지 않을 때 사용해야 합니다. 예를들어 서드 파티 쿠키 도으이 솔루션, 채팅 봇등 서비스들을 사용할 때 활용할 수 있습니다.
링크
웹 접근방식의 핵심 매커니즘은 하이퍼 링크를 사용하는 방법입니다. 이를 통해 전체 페이지, 스타일 시트, JS 파일등을 가져올 수 있스빈다.
중앙 연결 디렉토리
중앙 서비스 형태로 하이퍼 레퍼런스를 저장,검색,검증합니다. 이는 각 마이크로 프론트엔드가 모든 URL이 변하는 것을 중앙 디렉토리에 알려야 합니다. 문제점으론 분산된 개별 마이크로 프론트엔드가 범위를 벗어난 서비스를 필요로 해 의존성, 견고성등의 문제가 생길 수 있습니다.
로컬 연결 디렉토리
중앙 서비스 대신에 웹 서버에 로컬 디렉토리를 통합할 수 있습니다. 지역적이게 되지만 인프라가 더 복잡해지게 됩니다. 예를 들어 ‘마이크로 프론트엔드 1’에서는 ‘/mf1/mf2-some-page’와 같은 별칭 URL을 도입해 실제 URL(’/mf2/some-page’)로 리다이렉션할 수 있습니다.
디렉토리를 둘로 나눌 수 있는데, 하나는 고유 ID를 사용하여 모든 링크를 노출하는 부분이고, 하나는 현재 값으로 현재 링크를 실제로 표시하는 부분입니다. 이를 통해 ID를 사용해 서비스와 자원 관리가 가능해집니다.
iframe 태그
웹 접근 방식으로 iframe 태그를 사용할 수 있습니다.
보안
소스 링크를 동적으로 만드는 것 이외에도, sandbox 속성등을 통해 보안을 강화해야 합니다.
접근성
iframe은 보안성은 높지만 접근성과 SEO에서 부족합니다.
레이아웃
다른 문서에 저장된 페이지이기 때문에 현재 페이지와 맞지 않는 경우가 있는데 이는 여러 위험을 가지고 있습니다.
iframe-resizer… 멈춰ㅓㅓ