Cors 在 Laravel 6 和 vue js 2 中不起作用答案

【问题标题】：Cors is not working in Laravel 6 and vue js 2Cors 在 Laravel 6 和 vue js 2 中不起作用
【发布时间】：2020-06-16 15:47:00
【问题描述】：

我尝试了许多来自 stackoverflow 和 youtube 的解决方案，但我的问题没有解决。我认为我为 cors 制作中间件的方法是正确的，也许我在代码中犯了错误。请检查以下代码。我正在尝试调用 Outlook 日历并尝试使用社交媒体登录，但我遇到了同样的错误

跨域请求被阻止：同源策略不允许在

读取远程资源

代码在这里。

http->middleware->Cors中的Cors中间件函数

public function handle($request, Closure $next)
{
    return $next($request)
        ->header('Access-Control-Allow-Origin',"*")
        ->header('Access-Control-Allow-Methods',"PUT,DELETE,POST,GET,OPTIONS")
        ->header('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type, X-Token-Auth, Authorization');
}

"在全局中间件下的内核文件中添加了这些行"

 \App\Http\Middleware\Cors::class,

web.php 中的路由

 Route::get('/outlook-callback', 'IntegrationsController@outlook_callback');
 Route::get('/azure-signin', 'IntegrationsController@signin');

IntegrationsController 中的我的函数

public function signin()
{ 
    //var_dump(config('values.OAUTH_APP_ID'));
    // Initialize the OAuth client
    $oauthClient = new \League\OAuth2\Client\Provider\GenericProvider([
      'clientId'                => config('values.OAUTH_APP_ID'),
      'clientSecret'            => config('values.OAUTH_APP_PASSWORD'),
      'redirectUri'             => config('values.OAUTH_REDIRECT_URI'),
      'urlAuthorize'            => config('values.OAUTH_AUTHORITY').config('values.OAUTH_AUTHORIZE_ENDPOINT'),
      'urlAccessToken'          => config('values.OAUTH_AUTHORITY').config('values.OAUTH_TOKEN_ENDPOINT'),
      'urlResourceOwnerDetails' => '',
      'scopes'                  => config('values.OAUTH_SCOPES')
    ]);
    // echo "<pre>";
    // print_r($oauthClient);
    // echo "</pre>";
    $authUrl = $oauthClient->getAuthorizationUrl();
    //print_r($authUrl);

    // Save client state so we can validate in callback
    session(['oauthState' => $oauthClient->getState()]);

    // Redirect to AAD signin page
    return redirect()->away($authUrl);
     // return response()->json(['status' =>'success','message'=>'auth url','authUrlData'=>$authUrl],200);
}

回调函数是

 public function outlook_callback(Request $request)
{ 
   print_r($request);
}

【问题讨论】：

标签： php laravel vuejs2 cors

【解决方案1】：

试试这个

Route::get('/outlook-callback', 'IntegrationsController@outlook_callback')->middleware('Cors');
Route::get('/azure-signin', 'IntegrationsController@signin')->middleware('Cors');

【讨论】：

我尝试了您的解决方案，但现在我收到此错误“目标类 [Cors] 不存在。”我在 http->middleware->Cors 中有一个文件，并且在下面的 routeMiddleware 内核文件中也提到了 "'cors' => \App\Http\Middleware\Cors::class,"

【解决方案2】：

当我尝试了所有可能的解决方案时，我发现但没有任何效果。我通过执行以下操作解决了我的问题。

我没有重定向到 laravel 控制器中的其他 url，因为这样做我给出了问题中提到的错误。

我返回重定向 url 以响应 axios 请求..然后我使用了

window.location =  response.data.authUrlData // authUrlData is the redirect url.

我不知道这是正确的方法，但这是我摆脱 CORS 错误的唯一方法。

所以我想分享一下我的答案，也许它会以某种方式帮助某人。

【讨论】：