带有分组前缀的 nuxt 的 Laravel 7 cors 问题答案

【问题标题】：Laravel 7 cors problem for nuxt with grouped prefix带有分组前缀的 nuxt 的 Laravel 7 cors 问题
【发布时间】：2020-12-05 04:37:16
【问题描述】：

nuxt 和 laravel 7 Route::group 的新手

更新在这里打开了一个问题：

https://github.com/fruitcake/laravel-cors/issues/487

我的 laravel 和 cors 包版本：

- "fruitcake/laravel-cors": "^2.0",
- "laravel/framework": "^7.24",

我的 Api 路由

Route::group(['prefix' => 'auth', 'namespace' => 'Auth'], function () {
    Route::post('signin', 'SignInController');
    Route::get('me', 'MeController');
    Route::post('signout', 'SignOutController');
});

Route::group(['prefix' => 'snippets', 'namespace' => 'Snippets'], function () {
    Route::post('', 'SnippetController@store');
    Route::get('{snippet:uuid}', 'SnippetController@show');
});

auth 路由有效，但 sn-p 无效。

我的cors是这样的：

<?php

return [

    /*
    |--------------------------------------------------------------------------
    | Cross-Origin Resource Sharing (CORS) Configuration
    |--------------------------------------------------------------------------
    |
    | Here you may configure your settings for cross-origin resource sharing
    | or "CORS". This determines what cross-origin operations may execute
    | in web browsers. You are free to adjust these settings as needed.
    |
    | To learn more: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
    |
    */

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

    'allowed_methods' => ['*'],

    'allowed_origins' => ['http://localhost:3000'],

    'allowed_origins_patterns' => ['*'],

    'allowed_headers' => ['*'],

    'exposed_headers' => [],

    'max_age' => 0,

    'supports_credentials' => false,

];

我也试过了

<?php

return [

    /*
    |--------------------------------------------------------------------------
    | Cross-Origin Resource Sharing (CORS) Configuration
    |--------------------------------------------------------------------------
    |
    | Here you may configure your settings for cross-origin resource sharing
    | or "CORS". This determines what cross-origin operations may execute
    | in web browsers. You are free to adjust these settings as needed.
    |
    | To learn more: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
    |
    */

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

    'allowed_methods' => ['*'],

    'allowed_origins' => ['*'],

    'allowed_origins_patterns' => ['*'],

    'allowed_headers' => ['*'],

    'exposed_headers' => [],

    'max_age' => 0,

    'supports_credentials' => false,

];

在每次重试之前，我都使用了php artisan config:cache 命令。

Cors 错误

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:8000/api/snippets. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

这个请求http://localhost:8000/api/snippets/ 在邮递员中可以正常工作，但在 nuxt 中不行，我得到了 cors 错误。

谁能告诉我这里发生了什么？

谢谢

【问题讨论】：

标签： laravel cors nuxt.js

【解决方案1】：

在 laravel 中使用 dd 或任何 log 函数都会影响 cors。

这是来自官网https://github.com/fruitcake/laravel-cors#echodie的引用

回声/死亡如果您在代码中使用 echo()、dd()、die()、exit()、dump() 等，您将中断中间件流程。在标头之前发送输出时，无法添加 CORS。当脚本在 CORS 中间件完成之前退出时，不会添加 CORS 标头。始终返回正确的响应或抛出异常。

此代码将使其工作：

public function store(Request $request)
    {
        $snippet = $request->user()->snippets()->create();

        return fractal()
            ->item($snippet)
            ->transformWith(new SnippetTransformer)
            ->toArray();
    }

【讨论】：