AngularJS：POST数据到外部REST API [英] AngularJS: POST Data to External REST API

问题描述

我有一个基本的AngularJS服务的设置，像这样：

I have a basic AngularJS service setup like so:

app.factory('User', function($resource) {
return $resource('http://api.mysite.com/user/:action:id/:attr', {}, {
    history: {
        method: 'GET',
        params: {
            attr: 'history'
        }
    },
    update: {
        method: 'POST',
        params: {
            name: 'test'
        }
    }
});
});

和我使用它是这样的：

User.history({id: 'testID'}, function(data) {
    console.log('got history');
    console.log(data);
});
User.update({id: 'me'}, function(data) {
    console.log('updated');
    console.log(data);
});

问题一： User.update（），尽管有设置为POST方法，不断发送选项作为请求方法

Problem one: User.update(), despite having the method set to POST, keeps sending OPTIONS as the request method.

虽然Chrome浏览器开发工具报告的请求头访问控制请求-方法：POST发送以及（不知道这意味着什么）

Though Chrome Dev tools reports the request header Access-Control-Request-Method:POST is sent as well (Not sure if that means anything).

问题二：我不断收到与CORS一个错误，尽管有这些报头中的API code设置：

Problem two: I keep getting an error with CORS, despite having these headers set in the API code:

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS");

这个问题只虽然显示出来，如果​​做一个非GET请求。

This problem only shows up though if making a non-GET request.

什么是可以处理这个正确的方法是什么？我也看着JSONP，但是这是一个RESTful API，我不知道如何解决的问题，只有获得支持。

What's the proper way to be handling this? I've also looked into JSONP, but with this being a RESTful api, I'm not sure how to get around the problems with only GET support.

推荐答案

您两个问题其实是一个问题。 OPTIONS请求是CORS过程的一部分。对于POST请求，浏览器首先发送一个OPTIONS调用，如果是好的执行它的服务器响应。

Your two problems are actually one problem. The OPTIONS request is part of the CORS process. For POST requests, the browser first sends an OPTIONS call, and the server responds if it is okay to execute it.

如果OPTIONS请求失败，角/ Chrome会显示在控制台的原因。例如：

If the OPTIONS request fails, Angular / Chrome shows you the reason in the console. For example:

OPTIONS https://*** Request header field Content-Type is not allowed by Access-Control-Allow-Headers. angular.min.js:106

XMLHttpRequest cannot load https://***. Request header field Content-Type is not allowed by Access-Control-Allow-Headers. 

您可能必须在服务器上设置访问控制，允许接头，太：

You probably have to set Access-Control-Allow Headers on the server, too:

header('Access-Control-Allow-Headers: Content-Type, x-xsrf-token')

X-xrsf令牌是角，以prevent CSRF。您可能需要增加更多的报头，取决于你从客户端发送的内容。

x-xrsf-token is for angular' to prevent CSRF. You may have to add more headers, depending on what you send from the client.

下面是CORS很好的指导作用：<一href=\"https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS\">https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS

Here is a very good guide on CORS: https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS

这篇关于AngularJS：POST数据到外部REST API的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！