Laravel CORS策略阻止网络图像在flutter web中显示

iswrvxsc  于 12个月前  发布在  Flutter
关注(0)|答案(2)|浏览(94)

我是一个flutter开发者,我使用laravel框架作为后端,当我试图在实时模式下加载网络图像时,我得到以下错误:

Access to XMLHttpRequest at 'https://haya.stop-ea.com/storage/car-brands/Chevrolet.png' from origin 'https://admin.stop-ea.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

字符串
我试了很多在谷歌上找到的解决方案,但都不起作用。请问我能得到帮助吗?

beq87vna

beq87vna1#

当您在开发/本地运行代码时,您将始终从服务器使用的同一IP请求。这使得CORS请求工作(因为它不是跨域的)。
要允许本地主机外部的客户端使用您的API,您必须在Web服务器中处理cors头,或者将Illuminate\Http\Middleware\HandleCors中间件添加到app/Http/Kernel.php$middleware阵列。
HandleCors中间件将添加所需的CORS标头,从而允许客户端按预期使用API。
现在,当涉及到CORS时,您可能实际上想要限制您希望允许访问站点的来源,因此Laravel为中间件提供了如下配置:
config/cors.php

<?php
return [
    'paths' => [],
    'allowed_methods' => ['*'],
    'allowed_origins' => ['*'],
    'allowed_origins_patterns' => [],
    'allowed_headers' => ['*'],
    'exposed_headers' => [],
    'max_age' => 0,
    'supports_credentials' => false,
];

字符串
有几个重要的设置你可能想改变。例如,没有supports_credentials设置为true,很多客户端将无法发送任何Auth头到你的API(你可能想)。
paths数组也可能是您希望填充的路径,您实际上希望公开激活的cors头。
所以,简而言之(如果默认配置足够的话),你所要做的就是添加HandleCors中间件:
App/Http/kernel.php

...
protected $middleware = [
    ...
    HandleCors::class,
];
...


或者,作为替代,到中间件组(例如,如果它只用于api)。
值得注意的是,CORS是在客户端处理的。所以并不是所有的客户端(尽管大多数浏览器)都关心它们。这意味着CORS不是限制访问API的好方法,这是由Authz和Authn完成的。Cors基本上只是客户端的安全设置。

vlurs2pr

vlurs2pr2#

安装此packagecomposer require fruitcake/laravel-cors
要允许所有路由使用CORS,请在app/Http/Kernel.php类的$middleware属性的顶部添加HandleCors中间件:

protected $middleware = [
  \Fruitcake\Cors\HandleCors::class,
    // ...
];

字符串

相关问题