cordova – 拒绝连接到设备的API（内容安全策略）

我正在使用Visual Studio的Apache Cordova工具。

当我用Ripple构build应用程序时，一切都很好。 但是，当我build立到我的Android设备，应用程序拒绝连接到我的外部API。

这是JavaScript控制台日志中的错误：

拒绝连接到“ http://XXX.herokuapp.com/api/posts/0/5 ”，因为它违反了以下内容安全策略指令：“default- src'self'data ：gap： https：// ssl。 gstatic.com'unsafe -eval'“。

请注意，“connect-src”没有明确设置，因此“default-src”被用作后备。

和：

错误：无法执行“XMLHttpRequest”上的“打开”：拒绝连接到“http：// XXX”。 herokuapp。 COM / API /帖/ 0 / 5'

我的API是用Node.js构build和expression的。 在我的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"> 

任何想法可能是什么问题？

Answer 1

从错误消息。 你在JS中调用Ajax Request。 但是你只在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，这会设置允许所有内容（加载脚本/ CSS内容，Ajax请求等）的默认策略。 所以元标签应该是这样的：

 <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 *"> 

有关内容安全策略的详细信息，请参阅内容安全策略参考 。