ErrorException: «Попытка получить свойство не-объекта» при отправке запроса POST из Angular 5 Service в Laravel 5.4 API

Question

Я пытаюсь получить доступ к данным из Laravel API для моего внешнего интерфейса Angular.Чтобы получить необходимые данные, я должен отправить «id» в виде POST на URL, который, в свою очередь, запрашивает базу данных и возвращает результат в виде JSON.ИСПОЛЬЗУЯ POSTMAN и другие инструменты тестирования API, я убедился, что конечная точка работает правильно.Когда я пытаюсь отправить POST-запрос от Angular, я не получаю POST-данные от моего Laravel API, и выдается следующая ошибка:

Обратите внимание, что я удалил фактические URL-адреса из кода

(1/1) ErrorException
Trying to get property of non-object

in ServiceRequestController.php line 209
at HandleExceptions->handleError(8, 'Trying to get property of non-object', '/home/removed_name/public_html/KoiKaam/app/Http/Controllers/ServiceRequestController.php', 209, array('request' => object(Request), 'serviceRequests' => object(Collection), 'id' => null, 'category' => null, 'cats' => object(Collection), 'cat' => null))
in ServiceRequestController.php line 209

Хотя фактический результат, протестированный на POSTMAN и в приложении для Android, должен быть this (снимок экрана с результатом)

Это код угловой службы IЯ использую для получения результатов

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

import { HttpClient, HttpHeaders, HttpResponse } from '@angular/common/http';
import { BuyDeliverRequests } from '../classes/buy-deliver-requests';


const httpOptions = {
  headers: new HttpHeaders({ 'Content-Type': 'application/json' })
};
const httpPostOptions = {
  headers: new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded')
};

@Injectable()
export class BuyDeliverRequestsService {
    private url = 'http://removed_name/KoiKaam/public/api/serviceRequestByCategory'
  constructor(private http: HttpClient) { }


  getBuyDeliverServices(serverResponse: BuyDeliverRequests) {

      return this.http.post(this.url, {id: 1},  httpPostOptions).subscribe(
        data => { serverResponse = data.data; console.log(data); },
        err => console.log(err),
        () => console.log('Successful')
      );
  }
}

Это функция, к которой идет URL / конечная точка, для получения результатов:

 /*this function returns all rows of service request wrt category with their picture paths from service request pictures table
    and bids on that request request*/
    public function showServiceRequestbyCategory(Request $request)
    {
        $serviceRequests = new Collection();
        $id = $request->id; 

        $category = Category::find($id);
        $this->categories->push($category);
        $cats = $this->getChilds($id);
        try{
            foreach ($cats as $cat){
                $srv = $this->getServiceRequest($cat->id); //This is line 209 from the error
                foreach ($srv as $service){
                    $serviceRequests->push($service);
                }
            }

            $response["message"] = "Post Created Successfully";
            $response["error"] = false;
            $response["data"] = $serviceRequests;
            return json_encode($response);
        }
        catch (QueryException $e){
            $response["message"] = $e->errorInfo[2];
            $response["error"] = true;
            $response["sja"] = "2nd";
            return json_encode($response);
        }
    }

Ниже приводится функция, которая вызываетсястрока, в которой ошибка определяется Laravel

private function getServiceRequest($category_id){
    try{
        $serviceRequest = ServiceRequest::where([['category_id','=', $category_id],
            ['in_process_flag', '=', false]])->paginate(5);
        if($serviceRequest){
            return $serviceRequest;
        }
    }
    catch(QueryException $e){

    }
}

Answer 1

После долгих поисков, наконец, указал на проблему и нашел решение

Проблема

Когда Angular 5 отправляет данные через POST, он отправляет их как JSON.Мой контроллер на конце Laravel ожидает данные ФОРМЫ, к которым можно получить доступ как $request->id

Решение

Существует два способа решения этой проблемы.Со стороны Angular или Laravel.

Laravel

Это действительно просто, вместо прямого доступа к $request нам сначала нужно сохранить его в массиве

$data= $request->json()->all();

тогда мы можем использовать $data в качестве ассоциативного массива для извлечения необходимых данных, например, если бы я хотел использовать id , я бы

$id= $data['id'];затем используйте $ id при необходимости

Angular

Сначала нам нужно сериализовать наш объект, в котором хранятся данные, перед отправкой их в бэкэнд Laravel.Для этого у jQuery была своя собственная функция $.param(), но так как мы используем angular, я нашел пользовательскую функцию, которая делает то же самое

formatData(data) {
let returnData = '';
let count = 0;
for (let i in data) {
  if (count == 0) {
    returnData += i + '=' + data[i];
  } else {
    returnData += '&' + i + '=' + data[i];
  }
  count = count + 1;
}
return returnData;
}

, поэтому для отправки данных мне пришлось отредактировать функцию класса Service какследует

getServicesByCategory(category_id: number) {
let data = {id: category_id};
let body = this.formatData(data);
  return this.http.post(this.url, body,  httpPostOptions);
}

нашел эту функцию по другому вопросу здесь