代码之家  ›  专栏  ›  技术社区  ›  fermoga

Laravel API不允许我的前端使用React和Redux进行访问

  •  0
  • fermoga  · 技术社区  · 6 年前

    我的API是用Laravel version 5.6构建的,我的前端使用与Redux反应。我在尝试连接到API时遇到CORs问题。

    加载失败 http://127.0.0.1:8000/api/login :对飞行前请求的响应未通过访问控制检查:请求的资源上不存在“访问控制允许源”头。起源' http://localhost:3000 因此不允许访问。如果不透明响应满足您的需要,请将请求的模式设置为“no cors”,以便在禁用cors的情况下获取资源。

    我试着应用我找到的解决方案。我有我的 Cors 中间件类:

    public function handle($request, Closure $next)
    {
        return $next($request)
            ->header("Access-Control-Allow-Origin", "http://localhost:3000") // Already tried with *
            ->header("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE")
            ->header("Access-Control-Allow-Headers", "Content-Type, Authorization");
    }
    

    以及 Kernel.php :

    protected $middlewareGroups = [
        ...,
        'api' => [
            ...
            'cors'
        ],
    ];
    
    protected $routeMiddleware = [
        ...
        'cors' => \App\Http\Middleware\Cors::class
    ];
    

    路线:

    Route::post("/login", "Api\UserController@login");
    Route::post("/register", "Api\UserController@register");
    
    Route::prefix("users")->group(function () {
        Route::middleware("auth:api")->group(function () {
            Route::get("me", "Api\UserController@details");
        });
    });
    

    以及行动:

    export function login(data) {
      return dispatch => {
        return dispatch({
          [RSAA]: {
            endpoint: "http://127.0.0.1:8000/api/login",
            method: "POST",
            headers: {
              "Content-Type": "application/json",
            },
            body: JSON.stringify(data),
            types: [LOGIN, LOGIN_SUCCESS, LOGIN_FAILURE]
          }
        })
      }
    }
    

    在请求的头中,我可以看到已发送的CORs方法。那么缺少什么呢?

    enter image description here

    3 回复  |  直到 6 年前
        1
  •  0
  •   Usman Jdn    6 年前

    使用此包 https://github.com/barryvdh/laravel-cors 它解决了你的球衣问题

        2
  •  0
  •   CodeZombie    6 年前

    在服务器上部署带有不可知设置的react应用程序后,我遇到了同样的问题 laravel-cors 没有帮助我。我配置了 .htaccess 我的服务器如下:

    Header always set Access-Control-Allow-Origin "*"
    Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"
    Header always set Access-Control-Max-Age "1000"
    Header always set Access-Control-Allow-Headers "x-requested-with, Content-Type, origin, authorization, accept, client-security-token"  
    
        3
  •  0
  •   Umang Patel    6 年前

    请将下面的行放在您的路由文件的顶部,即 api.php接口 . 它将解决CORS的问题。

    use Illuminate\Http\Request;
    
    header('Access-Control-Allow-Origin: *');
    //Access-Control-Allow-Origin: *
    header('Access-Control-Allow-Methods:  POST, GET, OPTIONS, PUT, DELETE');
    header('Access-Control-Allow-Headers:  Content-Type, X-Auth-Token, Origin, Authorization');