前提・実現したいこと
Laravelのjwt、 nuxtのAuthModeule間の遷移を実現したいです。
Laravelをheroku,Nuxtをnetlifyにでデプロイし、ログイン処理でエラーが発生しました。
ログイン画面で正しいemail,passwordを入力するとtopページへ遷移するのですがそのままです。
一方、間違ったログインをするとバックエンドからのバリデーションによるエラ〜メッセージが返されるのは確認済みですのでログイン後のtokenがうまく処理できてないのではないかと考えられます。
また、デベロッパーツール ではundefindと出力されます。
バックエンド(laravel,heroku)のログ
2020-11-21T01:23:53.686116+00:00 "OPTIONS /api/login HTTP/1.1" 204 - "https://◯◯.netlify.app/" "Mozilla/5.0 2020-11-21T01:23:53.784655+00:00 "GET /api/posts HTTP/1.1" 200 25 "-" "axios/0.20.0 2020-11-21T01:23:53.790208+00:00 [21/Nov/2020:01:23:53 +0000] "GET /api/users HTTP/1.1" 200 357 "-" "axios/0.20.0 2020-11-21T01:23:53.788625+00:00 heroku[router]: at=info method=GET path="/api/posts" host=◯◯.herokuapp.com request_id=◯◯ status=200
いずれの200番代が返却されています。
該当のソースコード
php(AuthControler)
1 public function login(UserLoginRequest $request){ 2 3 if(!$token = auth()->attempt($request->only(['email','password']))){ 4 return response()->json([ 5 'errors' =>[ 6 'email'=>['メールアドレスとパスワードが一致しませんでした。'] 7 ] 8 ],422); 9 } 10 11 return (new UserResource($request->user()))->additional([ 12 'meta' => [ 13 'token' =>$token, 14 ] 15 ]); 16 }
php
1<?php 2 3return [ 4 'paths' => ['api/*'], 5 6 'allowed_origins' => ['https:/〇〇◯.netlify.app'], 7 8 'allowed_origins_patterns' => [], 9 10 'allowed_headers' => ['Content-Type','application/json','Authorization','Accept'], 11 12 'exposed_headers' => [], 13 14 'max_age' => 0, 15 16 'supports_credentials' => true, 17]; 18
nuxt
1methods: { 2 async asyncData({$auth}){ 3 try { 4 const {response} = await this.$auth.loginWith("local",{ 5 data:{ 6 email:this.form.email, 7 password:this.form.password, 8 } 9 }); 10 console.log(response) 11 this.$router.replace({ path: '/' }); 12 } catch (error) { 13 console.log(error.status) 14 } 15 } 16 },
nuxt
1 axios:{ 2 baseURL:"https://◯.herokuapp.com/api", 3 withCredentials: true, 4 }, 5 auth:{ 6 strategies:{ 7 local:{ 8 endpoints:{ 9 login:{ 10 url:'login', 11 method:'post', 12 propertyName:'meta.token' 13 }, 14 user:{ 15 url:'user', 16 method:'get', 17 propertyName:'data' 18 }, 19 logout:{ 20 url:'logout', 21 method:'post', 22 } 23 } 24 } 25 } 26 },
試したこと
laravelのallowed_headers、allowed_originsを設置しました。
デプロイ前はlocalhostで開発していた時(3000,8000)にはcorsエラーは発生しませんでしたがデプロイすると別ドメインになった影響かCorsエラー(error 500)が発生したので設置しました。設置する前では他の処理、ルーティングもerrorとなっていましたが設置することで200番台は返却されるようになりました。(herokuログにて確認済み)
Postmanにてバックエンドに問題ないことは確認済みです。
補足情報(FW/ツールのバージョンなど)
Laravel 6
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。