Angular post 方法 php

Question

我一整天都在尝试 post 从 angular 到 php 的数据，但我觉得很卡。这是我来自 angular 控制器的方法：

function submit() {      
        var JSONObject = {
             "name":$rootScope.name,
             "surname":$rootScope.surname,
             "email":$rootScope.email,
             "review":$rootScope.review
        };
        debugger;
        var Results = UniversalService.PostReview(JSONObject);
    }

然后转到 UniversalService，我的 $http.post 方法是：

function PostReview(JSONObject) {
        debugger;
        $http.post('http://localhost:8000/creation', JSONObject).then();
        debugger;
    }

在必须将数据发送到 php 之前一切顺利（我的网络 api 服务使用 Lumen 框架）

在我的 DatabaseController.php 中，我希望收到我的 json 对象（我是初学者，所以我希望那是我失败的地方）

public function created(Request $request)
{
    $inputJSON = file_get_contents('php://input');
    $input= json_decode( $inputJSON, TRUE ); //convert JSON into array

    print_r(json_encode($input));
   /* $user=[
        'name'=>$request->input('name'),
        'surname'=>$request->input('surname'),
        'email'=>$request->input('email'),
        'review'=>$request->input('review'),
    ];
    $time=$this->getTime();*/
 //  return DatabaseModel::newUser($user);

}

在routes.php

$app->post('/creation', [ 'as'=>'creation','uses'=> 'DatabaseController@created']);

出于绝望，我在这里同时使用了 get 和 post，但我似乎根本无法正确使用它。同样在 routes.php 中，我启用了 header('Access-Control-Allow-Origin: *');我不确定我是否必须在 angular 方面这样做（以及如何）。

我得到的是一堆错误

但是 postman 似乎可以工作，我在那里有额外的功能，当我输入：http://localhost:8000/creation 到 postman 我得到 json 对象和时间的 null来自我在 creation()

中调用的另一个函数

Answer 1

我相信您被 chrome 中的 OPTIONS pre-flight 请求抓住了。请注意，在控制台中，它抱怨的是您的 "OPTIONS" 请求，而不是 POST 本身。在没有看到您的服务器代码的情况下，这里有一个如何处理它的示例，以及需要在您对 OPTIONS pre-flight.

的响应中出现的 headers

// respond to preflights
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
  // return only the headers and not the content
  if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']){
    header('Access-Control-Allow-Origin: *');
    header('Access-Control-Allow-Headers: X-Requested-With');
  }
  exit;
}

可以在此处找到更详尽的解释（以及我从何处获取代码片段）：https://remysharp.com/2011/04/21/getting-cors-working

Answer 2

今天与其他三个程序员一起解决了我的问题。正如@jheimbouch 所说，问题是 Angular 将 OPTIONS 方法发送到 php 服务。所述的另一个问题是cors。我们的解决方案是：在 /bootstrap/app.php 中我们添加了： $app->middleware(['Cors' => App\Http\Middleware\CorsMiddleware::class]);

然后在 /Http/Midleware 添加文件 CorsMiddleware.php 解决了我所有的问题：

<?php

命名空间App\Http\Middleware；

使用闭包；使用 Illuminate\Http\Response;

class CorsMiddleware {

protected $settings = [
            'origin' => '*',    // Wide Open!
            'allowMethods' => 'GET,HEAD,PUT,POST,DELETE,PATCH,OPTIONS'];

protected function setOrigin($req, $rsp)
{
    $origin = $this->settings['origin'];
    if (is_callable($origin))
    {
        // Call origin callback with request origin
        $origin = call_user_func($origin, $req->header("Origin"));
    }
    $rsp->header('Access-Control-Allow-Origin', $origin);
}

protected function setExposeHeaders($req, $rsp)
{
    if (isset($this->settings->exposeHeaders))
    {
        $exposeHeaders = $this->settings->exposeHeaders;

        if (is_array($exposeHeaders))
        $exposeHeaders = implode(", ", $exposeHeaders);

        $rsp->header('Access-Control-Expose-Headers', $exposeHeaders);
    }
}

protected function setMaxAge($req, $rsp)
{
    if (isset($this->settings['maxAge']))
    $rsp->header('Access-Control-Max-Age', $this->settings['maxAge']);
}

protected function setAllowCredentials($req, $rsp)
{
    if (isset($this->settings['allowCredentials']) && $this->settings['allowCredentials'] === True)
    $rsp->header('Access-Control-Allow-Credentials', 'true');
}

protected function setAllowMethods($req, $rsp)
{
    if (isset($this->settings['allowMethods']))
    {
        $allowMethods = $this->settings['allowMethods'];

        if (is_array($allowMethods))
        $allowMethods = implode(", ", $allowMethods);

        $rsp->header('Access-Control-Allow-Methods', $allowMethods);
    }
}

protected function setAllowHeaders($req, $rsp)
{
    if (isset($this->settings['allowHeaders']))
    {
        $allowHeaders = $this->settings['allowHeaders'];

        if (is_array($allowHeaders))
        $allowHeaders = implode(", ", $allowHeaders);

    }
    else // Otherwise, use request headers
    {
        $allowHeaders = $req->header("Access-Control-Request-Headers");
    }

    if (isset($allowHeaders))
    $rsp->header('Access-Control-Allow-Headers', $allowHeaders);

}

protected function setCorsHeaders($req, $rsp)
{
    // http://www.html5rocks.com/static/images/cors_server_flowchart.png
    // Pre-flight
    if ($req->isMethod('OPTIONS'))
    {
        $this->setOrigin($req, $rsp);
        $this->setMaxAge($req, $rsp);
        $this->setAllowCredentials($req, $rsp);
        $this->setAllowMethods($req, $rsp);
        $this->setAllowHeaders($req, $rsp);
    }
    else
    {
        $this->setOrigin($req, $rsp);
        $this->setExposeHeaders($req, $rsp);
        $this->setAllowCredentials($req, $rsp);
    }
}

/**
 * Handle an incoming request.
 *
 * @param  \Illuminate\Http\Request  $request
 * @param  \Closure  $next
 * @return mixed
 */
public function handle($request, Closure $next) {

    if ($request->isMethod('OPTIONS')) {
        $response = new Response("", 200);
    }
    else {
        $response = $next($request);
    }

    $this->setCorsHeaders($request, $response);

    return $response;
}}

希望这会对某人有所帮助，因为我花了很长时间才完成这一切！无论如何，非常感谢所有提供帮助的人:)

Angular post 方法 php

Angular post method to php

php

angularjs

lumen