![](/img/trans.png)
[英]Cordova error: Refused to execute inline script because it violates the following Content Security Policy directive
[英]Cordova - Refused to connect to api from device (Content Security Policy)
我正在使用Visual Studio的Apache Cordova工具。
當我使用Ripple構建應用程序時,一切都很好。 但是,當我將其構建到我的android設備上時,該應用程序拒絕連接到我的外部API。
這是JavaScript控制台日志中的錯誤:
拒絕連接到“ http://XXX.herokuapp.com/api/posts/0/5 ”,因為它違反了以下內容安全策略指令:“ default- src'self '數據:gap: https:// ssl。 gstatic.com “不安全評估””。
請注意,未明確設置“ connect-src”,因此將“ default-src”用作后備。
和:
錯誤:無法在“ XMLHttpRequest”上執行“打開”:拒絕連接到“ http:// XXX”。 herokuapp。 COM / API /帖/ 0 / 5'
我的API使用Node.js構建並表達。 我的server.js中有Access-Control-Allow-Headers,但是在我的設備上仍然無法使用。
Server.js:
//'use strict';
var express = require('express'); // call express
var app = express(); // define our app using express
var bodyParser = require('body-parser');
var methodOverride = require('method-override');
var router = express.Router();
var fs = require('fs');
var path = require('path');
app.use(bodyParser.json()); // parse application/json
app.use(bodyParser.json({ type: 'application/vnd.api+json' })); // parse application/vnd.api+json as json
app.use(bodyParser.urlencoded({ extended: true })); // parse application/x-www-form-urlencoded
app.use(methodOverride('X-HTTP-Method-Override')); // override with the X-HTTP-Method-Override header in the request. simulate DELETE/PUT
app.use(express.static(__dirname + '/www'));
// middleware to use for all requests
app.use(function (req, res, next) {
console.log('in middleware');
res.setHeader('Access-Control-Allow-Origin', '*');//allowing ripple's localhost get access to node's localhost(5432).
console.log(req.header);
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
res.setHeader('Access-Control-Allow-Headers',"X-Requested-With,Content-Type");
//res.setHeader('Access-Control-Allow-Credentials', true);
// Pass to next layer of middleware
next();
});
require('./app/routes')(app); // pass our application into our routes -- must
app.use('/api', router);//put this line beofre passing app to routes.js for it to take effect.
var port = process.env.PORT || 8080;
app.listen(port, function() {
console.log("Listening on " + port);
});
exports = module.exports = app; // expose app
我也嘗試過將meta標簽添加到我的index.html文件中,但沒有成功。
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval' http://localhost:8080 http://XXX.herokuapp.com">
任何想法可能是什么問題?
從錯誤消息。 您正在JS中調用Ajax請求。 但是您只在script-src
之后添加了http://XXX.herokuapp.com
,這僅允許加載腳本內容。 為了允許Ajax請求,需要在connect-src
之后添加http://XXX.herokuapp.com
,如下所示:
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; connect-src 'self' http://XXX.herokuapp.com; style-src 'self' 'unsafe-inline'; media-src *">
或者,您可以在default-src
之后添加URL,該URL設置了允許所有內容的默認策略(加載腳本/ CSS內容,Ajax請求等)。 因此meta標簽應如下所示:
<meta http-equiv="Content-Security-Policy" content="default-src 'self' http://XXX.herokuapp.com data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
有關內容安全策略的詳細信息,請參閱《 內容安全策略參考》 。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.