다음 정책을 사용하여 콘텐츠 보안 정책 헤더를 구현 하고 있습니다.
Content-Security-Policy: default-src 'self'
따라서 실행되지 않기 때문에 인라인 스크립트를 피해야합니다.
그러나 MVC 응용 프로그램에서 편집기 템플릿과 같은 특정 기능은 인라인 스크립트를 사용합니다. 예 : tinymce_jquery_full.cshtml포함
$(function() {
$('#@ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty)').tinymce({
...
.jsCSP를 사용할 때 외부 파일에 동적 값을 포함하는 좋은 방법은 무엇입니까 ?
내 현재 생각은 두 가지 방법 중 하나입니다.
URL에서 콜백을 지정하지 않는다는 점을 제외하면 JSONP가 작동 하는 방식과 유사 합니다. 단순히 동적 값을 전달합니다. 동적 JavaScript가 필요한 각 파일에는 다음과 같은 링크가 포함됩니다.
<script src="/script/Foo/bar"></script>
동적 값을 삽입하는 유형의 콘텐츠를 반환 하는 히트 ScriptController의 Foo액션입니다 . 이것은 약간 투박하고 처음에 CSP를 사용하는 이점 중 일부를 무너 뜨리는 경우 신뢰할 수있는 방법이라고 생각합니다 (인코딩되지 않은 텍스트를 실수로 삽입 하고 CSP가없는 것처럼 XSS 를 유발하기 쉽습니다 ).text/javascriptbar
페이지에 동적 값이 삽입됩니다.
<input type="hidden" id="url" name="url" value"http:://www.example.com/" />
이러한 값은 외부 JavaScript 파일에서 조회됩니다.
$('#url').val();
이것은 작동하지만 페이지에 여러 개의 동적 컨트롤이 있거나 동일한 유형의 컨트롤이 둘 이상있는 경우 어색 할 수 있습니다. 문제는 각 .js스크립트를 숨겨진 필드 에 효율적으로 일치시키는 방법 입니다.
이에 대한 더 나은 솔루션이 있습니까? 아니면 사용할 수있는 준비된 프레임 워크가 있습니까?
$ ( '# @ ViewData.TemplateInfo.GetFullHtmlFieldName (string.Empty)')
예, 이것은 일반적으로 좋은 접근 방식이 아닙니다. Razor는 기본적으로 HTML에서 이스케이프되지만 여기서 컨텍스트는 단순히 HTML이 아닙니다.
<script>)따라서 HTML 이스케이프는 잘못된 것입니다. 선택자 또는 JS 문자열 리터럴 컨텍스트에서 특수한 문자 (예 : 점, 백 슬래시, 아포스트로피, 줄 구분 기호 ...)는이 문을 깨뜨립니다.
결과 GetFullHtmlFieldName가 항상 안전한 것으로 가정 할 때이 특정 예에서는 그다지 중요하지 않을 수 있지만 일반적인 경우에는 좋은 가정이 아닙니다.
C # 생성 자바 스크립트 : 약간 투박하고 CSP 사용의 일부 이점을 무너 뜨립니다.
동의합니다. 캐싱을 올바르게 설정하고 페이지 콘텐츠를 생성하는 ASP에서 스크립트를 생성하는 페이지로 정보를 전송하는 것은 일반적으로 고통입니다.
또한 JavaScript 생성이 반드시 그렇게 간단하지는 않습니다. ASP 및 Razor 템플릿은 자동 JS 이스케이프를 제공하지 않습니다. JSON 인코딩은 JSON과 JS (예 : U + 2028 및 U + 2029) 간의 약간의 차이를 제외하고 거의 수행합니다.
숨겨진 양식 필드
보다 일반적으로 DOM에 정보를 넣습니다. 숨겨진 양식 필드는이를 수행하는 한 가지 방법입니다. data-속성은 일반적으로 사용되는 또 다른 속성입니다. 어느 쪽이든 나는 DOM 접근 방식을 강력하게 선호합니다.
숨겨진 양식 필드를 사용할 때 name실제 내부에있는 것처럼 속성을 제거해야 <form>합니다. 일반적으로 JS로 전달하는 데이터를 실제로 제출하고 싶지는 않습니다.
이렇게하면 일반적인 기본 HTML 이스케이프를 사용하여 콘텐츠를 템플릿에 삽입 할 수 있습니다. 더 많은 구조가 필요한 경우 항상 전달할 데이터를 JSON 인코딩 할 수 있습니다. 이 경우 jQuery의 data()도우미가 자동으로 해당 정보를 제공 JSON.parse합니다.
<body data-mcefields="@Json.Encode(GetListOfHtmlFields())">
...
var mce_array = $('body').data('mcefields');
$.each(mce_array, function() {
var element = document.getElementById(this);
$(element).tinymce({ ... });
});
(하지만 ... HTML 편집기를 적용 할 요소를 선택하는 특정 경우에 대해 더 간단한 방법은 ? class="tinymce"와 함께 사용 하고 적용하는 것입니다 $('.tinymce').tinymce(...).)
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다