角度 POST 请求不起作用但 GET 工作正常

Posted 2023-03-04

【中文标题】角度 POST 请求不起作用但 GET 工作正常

【英文标题】：angular POST request not working but GET working fine

【发布时间】：2016-03-09 19:54:23

【问题描述】：

我知道有人问过这个问题，但我尝试了很多方法，但无法完成。

我正在从我的 Angular 应用程序向 laravel 后端 api 发出 GET 和 POST 请求。我能够从 get 请求中获取 json，但我的 POST 请求因 json 数据类型而失败。它适用于

x-www-form-urlencoded

但我无法提取 json 格式的数据。

$http.get('http://api.app.mywebsite.com/users').success(function(data)
    $scope.user = data;
);

$scope.addUser = function(user)
    console.log($scope.user);
    $http(
        method: 'POST',
        url: 'http://api.app.mywebsite.com/users',
        dataType: 'json',
        data: $scope.user,
        headers: 'Content-Type': 'application/json; charset=utf-8' 
    ).then(function(result)
        console.log(result);
    , function(error)
        console.log(error);
    )


$scope.user is posted on form submit.

我得到的错误：-

XMLHttpRequest cannot load http://api.app.mywebsite.com/users. 
Response     to preflight request doesn't pass access control check: 
No 'Access-Control-    Allow-Origin' header is present on the 
requested   resource. Origin 'http://app.mybackend.com' is therefore not     allowed access.

我在 laravel 中的 CORS.php 中间件：-

public function handle($request, Closure $next)

    header("Access-Control-Allow-Origin: *");

    // ALLOW OPTIONS METHOD
    $headers = [
        'Access-Control-Allow-Methods'=> 'POST, GET, OPTIONS, PUT, DELETE',
        'Access-Control-Allow-Headers'=> 'Content-Type, X-Auth-Token, Origin, X-Requested-With, Accept'
    ];
    if($request->getMethod() == "OPTIONS") 
        // The client-side application can set only headers allowed in Access-Control-Allow-Headers
        return \Response::make('OK', 200, $headers);
    

    $response = $next($request);
    foreach($headers as $key => $value)
        $response->header($key, $value);
    return $response;
    return $next($request);

routes.php

Route::group(['middleware' => 'cors'], function()

    Route::resource('users', 'UserController');
);

【问题讨论】：

究竟什么是“不工作”？您是否收到错误消息？请更清楚您的预期和实际发生的情况。

我收到以下错误消息“对预检请求的响应未通过访问控制检查：请求的资源上不存在 'Access-Control-Allow-Origin' 标头。”更新我的问题。

根据浏览器的预检发送了哪些标头？

Accept:*/* Accept-Encoding:gzip, deflate, sdch Accept-Language:en-US,en;q=0.8 Access-Control-Request-Headers:accept, content-type Access- Control-Request-Method:POST Connection:keep-alive Host:api.app.mywebsite.com Origin:app.mybackend.comReferer:app.mybackend.com User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (Khtml , 像壁虎) Chrome/46.0.2490.86 Safari/537.36

【参考方案1】：

更新： http://let-aurn.github.io/laravel-5-cors/

您需要配置您的 http 服务器以允许 cors 类似的问题： How to enable CORS in AngularJs

并且： AngularJS performs an OPTIONS HTTP request for a cross-origin resource

【讨论】：

我的服务器正在为 GET 请求工作，这意味着 CORS 正在工作，所以我假设客户端有一些问题..

还要检查添加的 SO 问题。