dart-server / angulardart和CORS的问题

时间:2014-05-28 15:34:37

标签: dart cors angular-dart

我在我的服务器上使用dart,使用angulardart作为我的客户端。我可以通过我的服务器上的http.get请求数据,这工作正常 - 但我无法让POST工作。

服务器:(服务器使用“开始”https://github.com/lvivski/start

//runs at 127.0.0.1:4040:
server.post("/rest/qr").listen((request) {
  addCorsHeaders(request.response);
  request.payload().then((map) {
    print(map);
  }).then((_) {
    request.response.send("ok");
  });
});

客户(角度):

// runs at http://127.0.0.1:3030
final String _codesUrl = "http://127.0.0.1:4040/rest/qr";
_http.post(_codesUrl, JSON.encode(temp.toMap())).then((HttpResponse response) {
  print(response.status);
});

addCorsHeaders:

void addCorsHeaders(Response res) {
    res.header("Access-Control-Allow-Origin", "*, ");
    res.header("Access-Control-Allow-Methods", "POST, GET, OPTIONS");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");}

这是我的代码。正如我已经说过的,http.get从angular到我的服务器确实有效。通过角度http服务发送到我的服务器失败:“请求的资源上没有'Access-Control-Allow-Origin'标头。因此不允许来源'127.0.0.1:3030'。”

我还尝试使用Google Chrome中的高级休息插件向该网址发出POST请求。这些请求确实有效。我是否会错过angulardart POST请求的内容?服务器和客户端在不同的端口上运行。

1 个答案:

答案 0 :(得分:2)

我自己也遇到过这个问题。事实证明,一些CORS请求需要“预检请求”。 GET没有,但POST确实如此。以下文章详细解释了所有这些:

http://www.html5rocks.com/en/tutorials/cors/#toc-adding-cors-support-to-the-server

要点是,对于POST CORS请求,客户端将首先向服务器发送“OPTIONS”请求,询问CORS POST是否正常。这是我之前提到的“预检请求”。你需要抓住它并在你获得POST之前回复它。

我不确定如何使用Start框架回答OPTIONS请求,但是dartlang网站有一个关于如何解决vanilla dart确切问题的教程:

https://www.dartlang.org/docs/tutorials/forms/#handling-options-requests

处理OPTION请求的代码(来自上文):

void handleOptions(HttpRequest req) {
  HttpResponse res = req.response;
  addCorsHeaders(res);
  print('${req.method}: ${req.uri.path}');
  res.statusCode = HttpStatus.NO_CONTENT;
  res.close();
 }