API Laravel 5.4とAngular 2の間のエラー500（内部サーバーエラー）

Question

私はAPI Laravelにフォームフォームを投稿すると、コンソールでエラー500（内部サーバーエラー）が発生します。

注：バックエンドAPIはPOSTMANと完全に連携しています。

Laravelで

マイCors.phpは次のとおりです。

namespace App\Http\Middleware; 

use Closure; 

class Cors 
{ 
/** 
* Handle an incoming request. 
* 
* @param \Illuminate\Http\Request $request 
* @param \Closure $next 
* @return mixed 
*/ 
public function handle($request, Closure $next) 
{ 
    return $next($request) 
    ->header('Access-Control-Allow-Origin', '*') 
    ->header('Access-Control-Allow-Credentials','true') 
    ->header('Access-Control-Allow','GET,POST,PUT,PATCH,DELELE,OPTIONS') 
    ->header('Access-Control-Allow-Headers','Content-Type, Authorization,X-XSRF-TOKEN,X-CSRF-TOKEN','CSRF-TOKEN','XSRF-TOKEN'); 
    } 
} 

とregister.component.tsで：

import { Component,OnInit,Input } from '@angular/core'; 
import { Router } from '@angular/router'; 
import { NgForm } from '@angular/forms'; 
import { UserService } from '../../services/user.service'; 

@Component({ 
    styleUrls: ['../../templates/users/register.component.css'], 
    templateUrl: '../../templates/users/register.component.html', 
}) 

export class RegisterComponent { 
title = 'register'; 

constructor(private _router: Router,private UserService: UserService){ 

} 

ngOnInit() { 

} 
onSubmit(form:NgForm){ 
    this.UserService.register(form.value); 
    } 
} 

とuser.service.ts：

import { Injectable } from '@angular/core'; 
import { Http,Response,Headers } from '@angular/http'; 
import 'rxjs/Rx'; 
import { Observable } from 'rxjs'; 


    @Injectable() 
    export class UserService{ 
    constructor(private http: Http){ 

    } 

    register(data : Object){ 
    const body = JSON.stringify({data:data}); 
    const headers = new Headers({'Content-Type':'application/json'}); 
    return this.http.post('http://localhost/etqan/etqan_lara/public/api/user',body,{headers:headers}).subscribe((data2) => console.log(data2)); 
    } 
} 

とレジスタ.component.htmlは：

<!-- Header --> 
    <header> 
    <div class="container"> 
     <div class="intro-text wow fadeInDown animated"> 
      <div class="row"> 
       <div class="col-md-4 col-md-offset-4"> 
        <div class="wrap"> 
         <p class="form-title">مستخدم جديد</p> 
         <form class="login" #f="ngForm" (ngSubmit)="onSubmit(f)"> 
         <input type="text" placeholder="اسم المستخدم" name="username" ngModel /> 
         <input type="text" placeholder="البريد الالكتروني" name="email" ngModel /> 
         <input type="password" placeholder="كلمة المرور" name="password" ngModel /> 
         <input type="password" placeholder="تأكيد كلمة المرور" name="repassword" ngModel /> 
         <input type="submit" value="تسجيل" class="btn btn-success btn-sm" /> 
         </form> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</header> 
<!-- Header End --> 

plsこの問題を解決する必要があります...ありがとうalot

Answer 1

「オブジェクト」を削除すると問題が解決します。ありがとう

register(data){ 
const body = JSON.stringify({data:data}); 
const headers = new Headers({'Content-Type':'application/json'}); 
return this.http.post('http://localhost/etqan/etqan_lara/public/api/user',body,{headers:headers}).subscribe((data2) => console.log(data2)); 
}