Angular CORS Laravel错误--访问控制允许原点

我用Angular开发了一个rest Laravel API

• 拉威尔：->5.7*
• 角度：->8.2.9
• __________角度CLI:8.3.8

该项目由两个文件夹分隔，每个文件夹具有不同的技术

项目完成后，使用IONOS服务器将其投入生产

但我有一个错误：

Access to XMLHttpRequest at 'https://api.alfarim.es/category' from origin 'http://www.alfarim.es' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
app.component.ts:63 

HttpErrorResponse

api.alfarim.es/category:1 Failed to load resource: net::ERR_FAILED

第一个-创建一个子域

我将Laravel项目上传到一个文件夹中

在IONOS中创建子域

创建指向Laravel公用文件夹的子域

修改Angular的全局变量以匹配子域

第二层-中间件 //我们创建了一个中间件

->header('Access-Control-Allow-Origin', '*’)
->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS’);

//我们进入内核

'cors' => \App\Http\Middleware\Cors::class,

//添加到路由

然后做所有的设置

链接：

第三名-水果蛋糕 安装

composer require fruitcake / 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-Methods', 'GET, POST, PUT, DELETE, OPTIONS’);

    }
}

cors.php---config

    'paths' => ['api/*'],

    /*
    * Matches the request method. `[*]` allows all methods.
    */
    'allowed_methods' => ['*'],

    /*
     * Matches the request origin. `[*]` allows all origins.
     */
    'allowed_origins' => ['*'],

    /*
     * Matches the request origin with, similar to `Request::is()`
     */
    'allowed_origins_patterns' => [],

    /*
     * Sets the Access-Control-Allow-Headers response header. `[*]` allows all headers.
     */
    'allowed_headers' => ['*'],

    /*
     * Sets the Access-Control-Expose-Headers response header with these headers.
     */
    'exposed_headers' => [],

    /*
     * Sets the Access-Control-Max-Age response header when > 0.
     */
    'max_age' => 0,

    /*
     * Sets the Access-Control-Allow-Credentials header.
     */
    'supports_credentials' => false,

    $app->configure('cors');
];

路线

Route::group(['middleware' => 'cors'], function(){
    //.....
    Route::post('/api/register/','UserController@register');
    }); 

---

通常，您必须设置服务器以接受Corss。 尝试以这种方式编辑aache配置（在httpd.conf或.htaccess文件中）

标题集访问控制允许原点“*”

要确保配置正确，请使用

apachectl-t

---

然后重新启动apache

响应的HTTP状态代码是什么？您可以使用浏览器devtools中的网络窗格进行检查。如果Chrome没有显示，请使用Firefox中的devtools。是4xx还是5xx错误，而不是200 OK成功响应？

    'paths' => ['api/*'],

    /*
    * Matches the request method. `[*]` allows all methods.
    */
    'allowed_methods' => ['*'],

    /*
     * Matches the request origin. `[*]` allows all origins.
     */
    'allowed_origins' => ['*'],

    /*
     * Matches the request origin with, similar to `Request::is()`
     */
    'allowed_origins_patterns' => [],

    /*
     * Sets the Access-Control-Allow-Headers response header. `[*]` allows all headers.
     */
    'allowed_headers' => ['*'],

    /*
     * Sets the Access-Control-Expose-Headers response header with these headers.
     */
    'exposed_headers' => [],

    /*
     * Sets the Access-Control-Max-Age response header when > 0.
     */
    'max_age' => 0,

    /*
     * Sets the Access-Control-Allow-Credentials header.
     */
    'supports_credentials' => false,

    $app->configure('cors');
];

Route::group(['middleware' => 'cors'], function(){
    //.....
    Route::post('/api/register/','UserController@register');
    });