Angular 6 Laravel 5.6 показывает методы 405 при использовании httpOptions в вызове службы

Я намерен создать объект (фактически объекты внутри объекта) в Angular и отправить его с помощью служб, чтобы Laravel API мог принимать данные и обрабатывать то же самое (вставлять данные, отправленные Angular). Я успешно сгенерировал объекты внутри объекта. См. Журнал консоли, как показано ниже:

{"request":{"data":"DeTurgVx6Oyh0is0TZMJncHHJh6JBevZbgW1XL2s1uvXk7qKKMRlJ6FJ1AYAiNSxHlA0JLO9pyQgYFBWQHnliOPVHsaFtsVZ8emmsSS7MOfKBP6x2CZqCMWegRMdoaV9TJxKSEsKhD48frwiOwwD4GKChYiX0HfZKp5Wm6aQCOSuXC7HyXb+KZjbhWsmispUhz21FBf0T6NWaPmOgf/eWtMgCu2hPYj7IyrGLEmt8QwmCn79VTDmNnAeM7zecXqg/TPu1wqoYrBXq8IHUQ9+CA= = ","salt":"YWRnaHJ0eXVwb2Vxd2VkZg= = "}}

Теперь я хочу отправить данные через службы, чтобы Laravel мог это принять. Чтобы сделать то же самое, я сделал следующее. В этом случае данные отправляются с помощью метода post, однако данные не вставляются в базу данных, поскольку я думал, что не передал Content-Type': 'application/json с услугами в качестве опции.

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { environment } from '../environments/environment';
import { User } from '../app/shared/models/user.model'; 
export class RegistrationService {
private rootUrl = environment.api;
private httpOptions: any;
constructor(private http: HttpClient) {
    this.httpOptions = {
        headers: new HttpHeaders({ 'Content-Type': 'application/json'})
    };
}
registerUser(form){
  var formValues = JSON.stringify(form);
  return this.http.post(this.rootUrl+'register', formValues);
}

Итак, чтобы исправить вышесказанное, я подключил this.httpOptions с вызовом api внутри службы, как показано ниже, но он показывает мне 405 method not allowed.

return this.http.post(this.rootUrl+'register', formValues, this.httpOptions);

Чтобы решить эту проблему, я приложил приведенный ниже код - Laravel index.php, однако это не решает проблему.

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

Может кто подскажет, как я могу решить проблему?

Это маршрутweb.php в Laravel:

$router->get('/', function () use ($router) {
    return $router->app->version();
});
$router->group([
    'prefix' => 'api',
    'middleware' => ['XSS'],
    ], 
function () use ($router) {
  $router->post('register', ['uses' => 'UserController@register']);
});

Ниже приведен API, вызываемый при отображении метода 405:

Request URL: http://localhost/projectName/api/register Request Method: OPTIONS Status Code: 405 Method Not Allowed Remote Address: [::1]:80 Referrer Policy: no-referrer-when-downgrade

Вот заголовок ответа:

Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Origin, Content-Type, Accept, Authorization, X-Request-With
Access-Control-Allow-Methods: GET, POST, OPTIONS
Access-Control-Allow-Origin: *
Allow: POST
Cache-Control: no-cache, private
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8
Date: Tue, 08 Jan 2019 05:16:44 GMT
Keep-Alive: timeout=5, max=100
Server: Apache/2.4.18 (Ubuntu)
Transfer-Encoding: chunked

Покажите нам маршрут, по которому вы пытаетесь добраться до POST.

DevK 08.01.2019 06:06

Код маршрута @devk вставлен в мой запрос. Пожалуйста, проверьте.

Niladri Banerjee - Uttarpara 08.01.2019 06:09

Когда вы отправляете запрос из своего приложения Angular, можете ли вы проверить, на какой URL он отправляется, и вставить его сюда?

DevK 08.01.2019 06:14

@devk Изменил мой запрос. Пожалуйста, проверьте вызывающий URL внизу.

Niladri Banerjee - Uttarpara 08.01.2019 06:22

@devk Я предоставил вам неверную информацию. Я использую web.php для маршрута.

Niladri Banerjee - Uttarpara 08.01.2019 07:20
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
1
5
153
0

Другие вопросы по теме