Web Forms 모델 및 페이지를 만들고 컨트롤을 사용하는 방법입니다.
내 페이지의 외부 리소스가 Web Live 미리 보기에서 차단되는 이유는 무엇인가요?
페이지에 있는 타사 도메인의 외부 리소스가 있는 경우 Web Live Preview의 디자이너가 로드를 차단하고 이 알림 메시지를 표시할 수 있습니다.
리소스가 디자이너에서 로드되지 않도록 차단된 이유와 알림이 표시되는 이유가 궁금할 수 있습니다. 이 문서에서는 리소스가 차단된 이유를 설명합니다.
웹 라이브 미리 보기 및 BrowserLink 개요
WLP(Web Live Preview)는 BrowserLink를 기반으로 빌드된 Visual Studio 확장입니다. WLP는 BrowserLink를 사용하여 Visual Studio와 디자이너 간의 양방향 통신을 위한 채널을 제공합니다. 이 양방향 통신을 통해 WLP는 다음과 같은 여러 기능을 제공할 수 있습니다.
- 디자이너의 콘텐츠 및 현재 선택한 노드를 편집기의 노드와 동기화합니다.
- 디자이너에서 만든 새 콘텐츠를 편집기에 푸시합니다.
- 작업 패널 명령 실행
Web Live 미리 보기 및 BrowserLink를 사용한 잠재적 보안 취약성
타사에서 웹 페이지에 스크립트 또는 리소스를 삽입하는 경우 WLP 및 BrowserLink를 사용하여 XSS(사이트 간 스크립팅) 공격을 수행하여 잠재적인 보안 취약성에 노출될 수 있습니다.
타사 리소스가 사이트에 악성 코드를 삽입할 수 있는 경우 코드는 디자이너에 삽입된 브라우저 링크 스크립트를 사용하여 Visual Studio를 다시 호출할 수 있습니다. 삽입된 스크립트를 사용하면 코드가 Visual Studio에서 열린 파일에 임의의 콘텐츠를 작성하거나 다른 공격 벡터를 열 수 있습니다.
현재 공격자가 BrowserLink 스크립트를 통해 Visual Studio로 다시 통신하는 것을 방지하는 좋은 방법은 없습니다.
보안 취약성 완화
브라우저링크 스크립트를 통해 Visual Studio로의 통신에서 보안 취약성을 최대한 제한하고 완화했습니다. 그러나 일부 공격은 XSS 공격을 통해 계속 가능할 수 있습니다.
이러한 XSS 공격의 가능성을 줄이기 위해 기본적으로 WLP는 모든 외부 리소스가 로드되지 않도록 차단합니다. 외부 리소스가 차단된 경우 WLP는 디자이너의 오른쪽 위 모서리에 다음 알림을 표시합니다.
(이 예제에서는 샘플 웹앱 https://visualstudio.microsoft.com/wp-content/uploads/2021/10/Product-Icon.svg에 사용되는 외부 리소스인 다음 SVG를 사용합니다. )
Microsoft Edge DevTools 창이 열려 있는 경우 외부 리소스를 로드하지 못한 이유를 설명하는 다음 메시지도 확인할 수 있습니다.
디자이너의 알림에서 여기 클릭 링크를 선택하면 차단된 리소스의 도메인이 대화 상자 목록에 자동으로 추가된 다음 대화 상자가 표시됩니다.
대화 상자 목록에 저장된 외부 도메인에서 들어오는 모든 리소스는 기본적으로 WLP에서 차단되지 않으며 평소와 같이 로드됩니다. 확인을 클릭하면 디자이너는 페이지를 다시 로드하고 이전에 차단된 도메인이 대화 상자에 추가된 리소스를 로드합니다. 신뢰할 수 있고 안전한 것으로 확인된 외부 도메인만 허용해야 합니다.
알림에서 웹 라이브 미리 보기 - 외부 도메인 링크를 클릭하면 동일한 대화 상자가 표시되지만 차단된 리소스의 도메인은 대화 상자에 추가되지 않습니다.
설정을 통해 Tools -> Options -> Web Live Preview -> Allowed external domains during design 대화 상자에 액세스할 수도 있습니다. 대화 상자 설정은 Visual Studio의 설치된 instance 따라 설정됩니다.
경고
도메인을 기본적으로 차단하지 않도록 허용하면 위에서 언급한 XSS 공격에 노출될 수 있습니다. 다시 말하지만 신뢰할 수 있고 안전한 것으로 확인할 수 있는 외부 도메인만 허용하는 것이 좋습니다.