2017-07-12 51 views
1

我剛剛從Angular1.6升級的字體 - > 4,我有點堅持與內容安全協議錯誤:Angular4內容安全協議拒絕加載

http://localhost:4200/:1 GET http://localhost:4200/ 404 (Not Found) 
localhost/:1 Refused to load the font 'data:font/woff;base64,d09GRgABAAAAAIt0ABEAAAABQDwAAQABAAAAAAAAAAAAAAAAAAAAACwKGBmIIpVWLACJWGwAUVjI2KwAiNEswkKAwIrswsQAwIrsxEWAwIrWbIEKAZFUkSzCxAEAisA' 
because it violates the following Content Security Policy directive: "default-src 'self'". Note that 'font-src' was not explicitly set, so 'default-src' is used as a fallback. 

就像我什麼都試過了我可以和lemme發佈我的JSON文件呢!像有人可以幫助我瞭解究竟發生了什麼,爲什麼它不工作和其他可能的解決方案?而且,我還沒有用manifest.JSON來嘗試它....我有點騎這個項目,所以任何幫助將非常感謝!

<!doctype html> 
<html lang="en"> 
<head> 
    <meta http-equiv="Content-Security-Policy" content=" 
     default-src 'none'; 
     style-src 'self' 'unsafe-inline'; 
     font-src * data:; 
     " /> 
    <meta charset="utf-8"> 
    <title>Comp</title> 
    <base href="/"> 


    <!-- Latest compiled and minified CSS --> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

    <!-- jQuery library --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

    <!-- Latest compiled JavaScript --> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="icon" type="image/x-icon" href="favicon.ico"> 
</head> 
<body> 
    <app-root></app-root> 
</body> 
</html> 

的package.json:

{ 
    "name": "comp", 
    "version": "0.0.0", 
    "license": "MIT", 
    "scripts": { 
    "ng": "ng", 
    "start": "ng serve && node app.js", 
    "build": "ng build", 
    "test": "ng test", 
    "lint": "ng lint", 
    "e2e": "ng e2e" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/animations": "^4.0.0", 
    "@angular/common": "^4.0.0", 
    "@angular/compiler": "^4.0.0", 
    "@angular/compiler-cli": "^4.2.6", 
    "@angular/core": "^4.0.0", 
    "@angular/forms": "^4.0.0", 
    "@angular/http": "^4.0.0", 
    "@angular/platform-browser": "^4.0.0", 
    "@angular/platform-browser-dynamic": "^4.0.0", 
    "@angular/router": "^4.0.0", 
    "core-js": "^2.4.1", 
    "module": "^1.2.5", 
    "mongodb": "^2.2.30", 
    "mongoose": "^4.11.1", 
    "mongoose-middleware": "^1.0.0", 
    "ng2-dnd": "^4.2.0", 
    "rxjs": "^5.1.0", 
    "zone.js": "^0.8.4" 
    }, 
    "devDependencies": { 
    "@angular/cli": "^1.2.0", 
    "@angular/language-service": "^4.0.0", 
    "@types/jasmine": "~2.5.53", 
    "@types/jasminewd2": "~2.0.2", 
    "@types/mongodb": "^2.2.7", 
    "@types/node": "^8.0.10", 
    "body-parser": "^1.17.2", 
    "codelyzer": "~3.1.2", 
    "jasmine-core": "~2.6.2", 
    "jasmine-spec-reporter": "~4.1.0", 
    "karma": "~1.7.0", 
    "karma-chrome-launcher": "~2.2.0", 
    "karma-cli": "~1.0.1", 
    "karma-coverage-istanbul-reporter": "^1.2.1", 
    "karma-jasmine": "~1.1.0", 
    "karma-jasmine-html-reporter": "^0.2.2", 
    "protractor": "~5.1.2", 
    "ts-node": "~3.2.0", 
    "tslint": "~5.5.0", 
    "typescript": "~2.4.1" 
    } 
} 
+1

聽起來就像您擁有內容安全策略標頭,並且採用比您要使用文檔中元元素設置更嚴格的策略。你不能以這種方式設置一個不太嚴格的政策。您需要改變標題值。請參閱https://stackoverflow.com/questions/42960811/what-value-to-use-for-content-security-policy-meta-for-video-src-blob/42964566#42964566和https://stackoverflow.com/questions/44732431/javascript-create-websocket-connection-refused-content-security/44732470#44732470 – sideshowbarker

+0

任何想法,以找到在這個更嚴格的政策可以在哪裏定義? –

+0

它完全取決於您正在運行的服務器軟件。如果服務器正在運行Apache,它可能位於.htaccess文件中,或者它可能位於系統/etc/apache2/apache2.conf文件中,或位於/ etc/apache2 /目錄中的其他文件中。如果服務器正在運行nginx,它可能位於/etc/nginx/nginx.conf文件或/ etc/nginx /目錄中的其他文件中......等等。 – sideshowbarker

回答

1

大喊答題節目環節以@sideshowbarker誰評論說:

聽起來像你有內容安全,策略標頭更嚴格 政策比你」重新嘗試在 文檔中設置該元素。你不能以這種方式設置一個不太嚴格的政策。你需要 改變標題值。見 stackoverflow.com/questions/42960811/ ...和 stackoverflow.com/questions/44732431/ ...

錯誤已經從一個模塊內部嚴格的CSP出現,所以儘量在你的.ts停用模塊導入這是我所做的文件。

祝你好運!