通过 angular http post 将 json 数据发送到 laravel 控制器答案

【问题标题】：Send json data via angular http post to laravel controller通过 angular http post 将 json 数据发送到 laravel 控制器
【发布时间】：2019-04-12 17:36:30
【问题描述】：

我是 laravel 和 angular 的新手。我试图将一些数据从服务发送到 laravel 控制器中的函数。这是我的 laravel 代码：

public function authenticate(Request $request){
    file_put_contents('test.txt','run');

    header("Access-Control-Allow-Origin: *");
    header('Access-Control-Allow-Methods: GET, POST, DELETE, PUT, OPTIONS');
    header('Access-Control-Allow-Headers: Origin, Content-Type, Accept, Authorization, X-Request-With');
    header('Access-Control-Allow-Credentials: true');

    $name=$request->input('name');
    $password=$request->input('password');
    $message='Not Found';

    $user=User::where(['name'=>$name])->first();
    if($user->checkPasswordAttribute($password)){
        $message='Found';
    }
    return response()->json([
        'message' => $message,
    ]);
}

这是我通过 json 的角度服务代码：

login(user: User): Observable<User> {
return this.http.post<User>(this.usersUrl, user, httpOptions).pipe(
  tap( _ => this.log('fetched user')),
  catchError(this.handleError<User>(`getUser`))
);

}

使用这个 HttpHeaders：

const httpOptions = {  headers: new HttpHeaders({ 'Content-Type':  'application/json' })};

上面的代码什么都不发送，甚至不运行我为测试添加的 file_put_content。但是当我在 Angular 服务中使用 formData 作为下面的代码时，一切正常并运行我的后端代码。

login(user: User): Observable<User> {
const postData = new FormData();
postData.append('name', user.name);
postData.append('password', user.password);
return this.http.post<User>(this.usersUrl, postData).pipe(
  tap( _ => this.log('fetched user')),
  catchError(this.handleError<User>(`getUser`))
);

}

有人可以给我建议吗？

【问题讨论】：

首先，您是否在“storage/logs/*”中检查了您的logs，实际问题是什么。
谢谢你，我检查了日志并显示此错误消息“从源 'localhost:4200' 访问 XMLHttpRequest 已被 CORS 策略阻止：对预检请求的响应没有” t 通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。”。所以我使用这个网站tekina.info/cors-problem-laravel-angular 它解决了我的问题

标签： json angular laravel http post

【解决方案1】：

这将解码 http 请求 json 有效负载。

$data = json_decode($request->getContent(), true);

【讨论】：