$http.post没有在AngularJS工作[重复]

Question

我试图提出一个$http.post请求，但我有以下错误：

XMLHttpRequest无法加载https://mipage.com/examplephp.请求标头字段Content-Type不允许访问控制允许标头在飞行前响应。

如果我将$http.post更改为$http.get请求，则服务器响应将使用JSON，因此。。我认为这不是CORS的问题。我还在爱奥尼亚项目中放置了一个代理。

这是我的功能：

function obtenerSesion() {
        debugger;
        return $http.post(iniciarSesionUrl,
                 {params: {username: 'prueba123',password: 'prueba123'}}).then(function(response) {
            canchas = response.data;        
            return canchas;
        })
        .catch(generarError);
    }

但不是。我在服务器上硬编码了数据所以...问题出在Angular JS上

你能帮我解决我的问题吗？谢谢

Answer 1

向其发送POST请求的服务器需要在其响应中包含Access Control Allow标头。将它们放入客户端无效。

由服务器指定是否接受跨源请求，因此客户端无法自行决定是否允许CORS。

这里用这个帖子解释

Answer 2

XMLHttpRequest无法加载https://mipage.com/examplephp.请求标头字段Content-Type不允许访问控制允许标头在飞行前响应。

如果我将$http.post更改为$http.get请求，则服务器响应将使用JSON，因此。。我认为这不是CORS的问题。我还在爱奥尼亚项目中放置了一个代理。

说明：

当您从$HTTP.GET（）发出HTTP GET请求，并传递参数对象时，这些参数会附加到querystring中，并且由于请求没有消息体，httpProvider会删除请求的内容类型标头。

因此，querystring中的$http.get参数：

username=prueba123&password=prueba123

否则，对于从$HTTP.POST（）传递params对象的HTTP POST请求，它们将在json中解析并插入请求的消息体中，然后httpProvider添加HTTP请求头内容类型：application/json。

因此，请求消息正文中的$http.post参数：

{"username":"prueba123","password":"prueba123"}

这是由角型http提供商的默认transformRequest函数完成的

不知何故，您违反了CORS策略，然后您必须配置api web服务器或api后端来处理违反CORS策略的情况，特别是您的错误是由于访问控制请求标头响应字段中缺少内容类型引起的。

可能的解决方案（针对您的具体情况）

如果您正在使用ionic framework从本地运行应用程序，则需要配置ionic.config.json文件，并添加一个与托管应用程序的地址和端口相同的代理，这样您就不会违反CORS策略。

例如：

    {
  "name": "example project",
  "app_id": "11ffxxxx",
   //etc etc..
  "proxies": [
    {
      "path": "/api",
      "proxyUrl": "http://192.168.1.152:9083/api"
    }
  ]
}

最后，在angular应用程序中，当从本地运行时，您需要正确配置apiendpoint：

function obtenerSesion() {
        debugger;
        return $http.post("/api",
                 {params: {username: 'prueba123',password: 'prueba123'}}).then(function(response) {
            canchas = response.data;        
            return canchas;
        })
        .catch(generarError);
    }

我建议您通过使用javascript任务运行程序（gulp、grunt）来自动化此过程