콘텐츠 보안 정책:페이지 설정이 리소스 로드를 차단했습니다.

콘텐츠 보안 정책:페이지 설정이 리소스 로드를 차단했습니다.

페이지 로드에서 캡차를 사용하고 있는데 보안상의 이유로 차단되고 있습니다.

저는 이 문제에 직면해 있습니다.

콘텐츠 보안 정책:페이지 설정이 로드를 차단했습니다.의 재능이 있는.http://www.google.com/recaptcha/api.js?onload=myCallBack&render=explicit("script-src http://test.com:8080 'cisco-src' 'cisco-eval')"

나는 다음 자바스크립트와 메타태그를 사용해 왔습니다.

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
<script src="http://www.google.com/recaptcha/api.js?onload=myCallBack&render=explicit" async defer></script>

자신의 사이트(자체)에서만 스크립트를 로드할 수 있다고 말씀하셨습니다.그런 다음 다른 사이트(www.google.com )에서 스크립트를 로드하려고 했지만 이를 제한했기 때문에 로드할 수 없습니다.이것이 콘텐츠 보안 정책(CSP)의 핵심입니다.

첫 번째 줄을 다음으로 변경할 수 있습니다.

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval' http://www.google.com">

또는 CSP에 대해 자세히 알아볼 때까지 해당 줄을 완전히 제거할 수도 있습니다.어쨌든 현재 CSP는 상당히 느슨합니다(허용).unsafe-inline,unsafe-eval그리고 adefault-src의*), 그래서 그것은 아마도 너무 많은 가치를 더하지 않을 것입니다, 솔직히.

내 ASP로.Visual Studio 2019에서 실행 중인 NET Core Angular 프로젝트에서 Firefox 콘솔에 다음 오류 메시지가 표시되는 경우가 있습니다.

콘텐츠 보안 정책:페이지 설정이 인라인("default-src")에서 리소스 로드를 차단했습니다.

Chrome에서 오류 메시지는 대신 다음과 같습니다.

리소스를 로드하지 못했습니다. 서버가 404() 상태로 응답했습니다.

저의 경우에는 컨텐츠 보안 정책과는 아무런 관련이 없으며, 오히려 제가 보기에는 TypeScript 오류의 결과일 뿐입니다.

IDE 출력 창에서 다음과 같은 TypeScript 오류를 확인합니다.

> ERROR in src/app/shared/models/person.model.ts(8,20): error TS2304: Cannot find name 'bool'.
>
> i ｢wdm｣: Failed to compile.

_{참고: 이 질문은 이 오류 메시지에 대한 Google의 첫 번째 결과이기 때문입니다.}

저도 비슷한 오류 유형이 있었습니다.먼저 코드에 메타 태그를 추가하려고 했지만 작동하지 않았습니다.

nginx 웹 서버에서 실행할 외부 코드를 차단할 수 있는 보안 설정이 있을 수 있다는 것을 알게 되었습니다.

# Security directives
server_tokens off;
add_header X-Frame-Options SAMEORIGIN;
add_header X-Content-Type-Options nosniff;
add_header X-XSS-Protection "1; mode=block";
add_header Content-Security-Policy "default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'  https://ajax.googleapis.com  https://ssl.google-analytics.com https://assets.zendesk.com https://connect.facebook.net; img-src 'self' https://ssl.google-analytics.com https://s-static.ak.facebook.com https://assets.zendesk.com; style-src 'self' 'unsafe-inline' https://assets.zendesk.com; font-src 'self' https://fonts.gstatic.com  https://themes.googleusercontent.com; frame-src https://player.vimeo.com https://assets.zendesk.com https://www.facebook.com https://s-static.ak.facebook.com https://tautt.zendesk.com; object-src 'none'";

[내용] - [보안] - [정책]을 선택합니다.원본 참조를 추가해야 할 수도 있습니다.

다음 헤더를 사용하여 필요한 모든 사이트를 허용했습니다.

header("Content-Security-Policy: default-src *; style-src 'self' 'unsafe-inline'; font-src 'self' data:; script-src 'self' 'unsafe-inline' 'unsafe-eval' stackexchange.com");                    

nginx 지시어에 추가

http {
    # ...
    add_header Content-Security-Policy "
default-src 'self' myDomain.com *.myDomain.com;
script-src 'self' myDomain.com *.myDomain.com 'unsafe-inline' tagmanager.google.com www.googletagmanager.com *.googletagmanager.com www.google-analytics.com ssl.google-analytics.com;
style-src 'self' myDomain.com *.myDomain.com 'unsafe-inline' tagmanager.google.com fonts.googleapis.com www.googletagmanager.com *.google-analytics.com *.googletagmanager.com;
img-src 'self' myDomain.com *.myDomain.com 'unsafe-inline' ssl.gstatic.com www.gstatic.com www.google-analytics.com;
font-src 'self' myDomain.com *.myDomain.com 'unsafe-inline' fonts.gstatic.com data;
connect-src 'self' myDomain.com *.myDomain.com 'unsafe-inline' *.google-analytics.com *.analytics.google.com *.googletagmanager.com ww.google-analytics.com;
";


    # ...


}

그러나 그것은 생산을 위한 개발 목적을 위해 반드시 모두 제거합니다.'unsafe-inline's

저는 URL을 잘못 부르고 있었습니다.

내 경우 익스프레스 서버의 기능은 다음과 같습니다.

app.use('/graphql', expressGraphQL({
  schema: schema,
  graphiql: true
}))

http://localhost:http/wasing에서 이 오류가 발생했습니다. http://localhost:http/graphql이어야 합니다.

htaccess에서 코드를 추가하여 수정할 수 있습니다.

<IfModule mod_headers.c>
    # Feature-Policy
    Header set Feature-Policy "microphone 'none'"
    # Referrer-Policy
    Header set Referrer-Policy "same-origin"
    # Content-Security-Policy   
    Header set Content-Security-Policy "script-src 'self' 'unsafe-inline' 'unsafe-eval' e.g. https://ajax.googleapis.com https://ssif1.globalsign.com https://malsup.github.io https://seal.globalsign.com https://www.googletagmanager.com https://www.google.com https://www.gstatic.com https://assets.zendesk.com https://chimpstatic.com https://cdn.ywxi.net https://static.hotjar.com https://maxcdn.bootstrapcdn.com https://www.google-analytics.com https://static.zdassets.com https://connect.facebook.net https://script.hotjar.com https://*.livechatinc.com; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://cdnjs.cloudflare.com https://ajax.googleapis.com;"
    # X-XSS-Protection
    Header set X-XSS-Protection "1; mode=block"
</IfModule>

전용디버깅 전용!!
이것은 모든 사이트에서 브라우저를 취약하게 만들기 때문에 꼭 필요한 경우에만 일시적으로 수행하십시오!

브라우저에서 사용하지 않도록 설정할 수 있습니다.

파이어폭스

형about:config에서 Firefox 파일을 .security.csp.enable으로 설정합니다.false.

크롬

장을설수있다니라는 할 수 .Disable Content-Security-PolicyCSP를 사용하지 않도록 설정합니다.

언급URL : https://stackoverflow.com/questions/37298608/content-security-policy-the-pages-settings-blocked-the-loading-of-a-resource