公共文件的 Laravel CORS 问题

Question

我正在尝试从 Angular 访问日志文件 URL，但它显示以下错误：

Access to XMLHttpRequest at 'https://myurl.com/storage/rmlogs/MyFileNameDetail.log' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

所有 API 请求都运行良好，错误仅针对文件请求。我的文件存储在

rmlogs

目录中，它位于

storage/app/public/rmlogs

中，它链接到公用文件夹。

API代码库是Laravel，文件存储在

storage

目录中。我可以通过浏览器和 Postman 访问该文件。由于该 URL 是公开可用的，因此它不需要我为其他 API 请求传递的身份验证令牌。

我有

cors.php

配置文件如下：

<?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' => true,

];

并且有一个

Cors.php

中间件，如下所示：

<?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');
    }
}

Answer 1

通过这个博客：

有一些可用的包允许将 CORS 标头添加到从 Laravel API 发送的响应中。他们通过将中间件应用于所有 API 的路由来实现这一点。但是，这种中间件并不适用于公共目录，而公共目录往往是用户头像等资源的存放位置。因此，当这些资源返回给浏览器时，它们没有应用必要的 CORS 标头。

因此您需要使用其他方法应用标头。这可能是使用 HTTP 服务器的配置文件最容易完成的。

你已经标记了这个 apache 所以你可以设置：

Header set Access-Control-Allow-Origin "*"

在你的配置文件中。

例如：

<Location "/storage/rmlogs/">
    Header set Access-Control-Allow-Origin "*"
</Location>

您也可以将

Header

指令放入 a

.htaccess

文件，但不推荐这样做：

如果您有权访问 httpd 主服务器配置文件，则应完全避免使用 .htaccess 文件。使用 .htaccess 文件会降低 Apache http 服务器的速度。可以包含在 .htaccess 文件中的任何指令最好在目录块中设置，因为它具有相同的效果和更好的性能。

如果您使用的是共享主机，您可能别无选择。

Answer 2

您正在访问非标准存储目录中的文件。可能是你的请求没有通过 laravel 过滤，因为它位于一个存储目录中，通常允许直接访问。

在那种情况下，它由网络服务器处理。 这些是在我的安装中通过 htaccess 重写到 laravel 控制器的存储访问规则。

RewriteRule ^storage/cms/.* index.php [L,NC]
RewriteRule ^storage/logs/.* index.php [L,NC]
RewriteRule ^storage/framework/.* index.php [L,NC]
RewriteRule ^storage/temp/protected/.* index.php [L,NC]
RewriteRule ^storage/app/uploads/protected/.* index.php [L,NC]

如您所见，

storage/rmlogs

不是它的一部分，因此如果我尝试访问存储中的 rmlogs 目录，它由网络服务器处理。

为了解决这个问题，如果你在 apache 上运行，你可以制定一个 .htaccess 规则来添加它，或者如果你运行 nginx，则可以制定一个 nginx 指令。

RewriteRule ^storage/rmlogs/.* index.php [L,NC]

Answer 3

任何寻找 apache 解决方案的人，这里是根据 mozilla 自己的文档的最终解决方案。 https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image

<IfModule mod_setenvif.c>
  <IfModule mod_headers.c>
    <FilesMatch "\.(avifs?|bmp|cur|gif|ico|jpe?g|jxl|a?png|svgz?|webp)$">
      SetEnvIf Origin ":" IS_CORS
      Header set Access-Control-Allow-Origin "*" env=IS_CORS
    </FilesMatch>
  </IfModule>
</IfModule>