로컬 파일에서 Chrome 64의 CSS 규칙에 액세스할 수 없는 이유는 무엇입니까?
- Linda Hamilton원래의
- 2024-11-03 06:48:30863검색
Chrome 64에서 CSS 개체 모델 액세스 제한
Chrome 64에서는 로컬로 로드된 스타일시트에서 CSS 규칙에 액세스하는 것이 문제가 되었습니다. 이 문제를 이해하려면, 다음 코드 조각을 고려하십시오.
<code class="html"><head>
<link rel='stylesheet' href='myStyle.css'>
<script>
window.onload = function() {
try {
alert(document.styleSheets[0]); // works
alert(document.styleSheets[0].cssRules); // doesn't even print undefined
} catch (e) { alert(e); } // catch and alert the error
}
</script>
</head></code>
Chrome 64 이상에서는 document.styleSheets[0]이 스타일시트 객체를 반환하더라도 cssRules에 액세스하면 오류가 발생합니다.
원인 :
이는 Chrome 64에 적용되는 스타일시트 보안 규칙 변경으로 인한 것입니다. 특히 로컬 파일에서 CSSOM(CSS 개체 모델)에 액세스하면 CORS(Cross-Origin Resource Sharing)를 위반합니다. 정책.
솔루션:
- 로컬 개발 서버 사용: CORS 정책이 완화되는 통제된 환경을 제공합니다.
- 온라인 또는 로컬 호스트에서 파일 호스트: 웹 서버를 사용하면 CORS 문제가 제거됩니다.
- 다른 브라우저 사용: Firefox, Edge 및 Internet Explorer에서는 로컬 파일에서 CSSOM에 액세스할 수 있습니다.
영향 및 해결 방법:
이 변경 사항은 로컬 파일 시스템에서 CSS 기능을 테스트하는 개발자에게 영향을 미칩니다. 온라인/로컬 호스트 파일 또는 기타 브라우저를 사용하는 등의 해결 방법은 임시 솔루션을 제공합니다.
논쟁 및 공개 질문:
보안 수정에도 불구하고 이에 대한 지속적인 토론과 논의가 있습니다. 이 변화. 일부에서는 접근성 문제를 감지할 수 있는 대안이 없다는 점이 불편하다고 주장합니다. 다른 사람들은 다른 브라우저에서 구현 범위에 대해 의문을 제기합니다. W3C 사양은 아직 개발 중이므로 이 문제가 어떻게 전개될지는 지켜봐야 합니다.
위 내용은 로컬 파일에서 Chrome 64의 CSS 규칙에 액세스할 수 없는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.