質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.92%

会員登録ができない(axios.postでフォーム送信)

解決済

回答 2

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 1,149

popc

score 9

前提・実現したいこと

Laravelで会員登録&ログインを実装しようとしています。
プロジェクトは下記コマンドで作成しました。

composer create-project --prefer-dist laravel/laravel

Vue.jsを使用しており、axios.postでフォームのデータを送っています。
RegisterController.phpでValidator,createなどが実行されているようです。(Laravel初心者なので詳しくはわかっていません…)

発生している問題・エラーメッセージ

フォームのデータがDBに登録されません。バリデーションもききません。
エラーも出ずログも吐き出されず、そのまま…です。

該当のソースコード

register.vue(必要なところ以外省略しています)

  data () {
    return {
      registerForm:{
        name:'',
        user_id:'',
        email: '',
        password: '',
        password_confirmation:''
      }
    }
  },
  methods: {
    async register() {
      // authストアのresigterアクションを呼び出す
      await this.$store.dispatch('auth/register', this.registerForm)

      if (this.apiStatus) {
        // トップページに移動する
        this.$router.push('/')
      }
    },
  },

auth.js(必要なところ以外省略しています)

const actions = {
  async register(context, data) {
    const response = await axios.post('/api/register', data)
  }
}

routes/api.php(必要なところ以外省略しています)

Route::post('/register', 'Auth\RegisterController@register')->name('register');

RegisterController.php

<?php

namespace App\Http\Controllers\Auth;

use App\User;
use App\Http\Controllers\Controller;
use Illuminate\Support\Facades\Hash;
use Illuminate\Support\Facades\Validator;
use Illuminate\Foundation\Auth\RegistersUsers;
use Illuminate\Http\Request;

class RegisterController extends Controller
{

    use RegistersUsers;

    protected $redirectTo = '/home';

    public function __construct()
    {
        $this->middleware('guest');
    }

    protected function validator(array $data)
    {
        return Validator::make($data, [
            'name' => ['required', 'string', 'max:255'],
            'email' => ['string', 'email', 'max:255'],
            'user_id' => ['required', 'string', 'max:20', 'unique:users'],
            'password' => ['required', 'string', 'confirmed'],
        ]);
    }

    protected function create(array $data)
    {
        return User::create([
            'name' => $data['name'],
            'email' => $data['email'],
            'user_id' => $data['user_id'],
            'password' => Hash::make($data['password']),
        ]);
    }

    // ★ メソッド追加
    protected function registered(Request $request, $user){
        return $user;
    }
}

補足情報

Laravel 5.8.28
php 7.3.0
vagrantでローカルサーバーをたちあげています。
DB mysql

auth.jsでaxios.post('/api/register', data)するまでのデータはconsole.logで確認できており、dataの中に入力データは入っています。
Controllerでデータを確認する方法がわからず、行き詰まっております。

一度会員登録が正常にできて、その後完成までたどりついた後に
会員登録だけができないことに気がつきました。
最初に成功したときに登録した会員情報でログインすることはでき、別で実装した記事追加や記事の修正などもできるので、
DBへの接続はできています。
他に必要な情報があればつけたしていきます。何卒よろしくお願いいたします。

追記

開発者ツールのNetworkで、registerのステータスコードが302になっていることに気づきました。
Status Code: 302 Found
下記と同じような状況なのかなと思ったのですが、いまいち原因と解決策がわからずでした・・・。
https://laracasts.com/discuss/channels/laravel/status-302-when-submitting-form

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

check解決した方法

+1

自己解決しました。

原因は、ミドルウェアの下記部分でした。

app/Http/Middleware/RedirectIfAuthenticated.php

    public function handle($request, Closure $next, $guard = null)
    {
        if (Auth::guard($guard)->check()) {
            // return redirect('/home');
            return redirect()->route('user');
        }
        return $next($request);
    }

そもそもこのユーザー登録を実装するにあたって参考にしたのがこのサイトで、
https://www.hypertextcandy.com/vue-laravel-tutorial-authentication-part-4/

return redirect()->route('user');


の部分もそれにならってやっていました・・・が

この参考サイトの場合、「ログインしてない状態」でユーザー登録ページにアクセスすることが前提でした。
ですが私が作っていたのはユーザー登録できるのは管理者のみというのが前提で、「ログインしてる状態&ユーザーは管理者」というのが条件になってました。
ですので、製作過程でregisterとloginをvue側のコンポーネントを分けて、ログインしてる状態でregister/にアクセスするようにしました。(この段階ですでにミドルウェアの役割も、ファイルを触ったことも忘れておりました…)
そのため「ログインしてる状態でregisterにアクセス」という状況になってしまい、ミドルウェアが反応してリダイレクト処理され、302が返ってくるということになっていたようです。

ですので、とりあえず
return redirect()->route('user');
をコメントアウト(リダイレクト処理をなしに)することでユーザー登録はできるようになりました。
「ユーザー登録できるのは管理者のみ」の実装はこれからすることになるので、最終的にこの部分は変わるかもしれませんが、とりあえずこの問題は解決しましたので閉めさせていただきます。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/04/10 13:50

    同じサイトを参考にして、同じところでつまづいていました。
    とても助かりました。

    キャンセル

  • 2020/04/10 16:55

    コメントありがとうございます。
    お役に立てたようでよかったです。

    キャンセル

0

Controllerでデータを確認する方法がわからず

AjaxなどでPure PHPの場合で確認するのもケースとしては同じかと思いますが、
ログ出力してください。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/10/21 20:17

    ログは、
    storage/logs/のなかに「laravel-2019-10-20.log」のようなファイル名で出力されています。
    (今日は21日ですがなぜか20日で出ていました)
    ログインやログアウトで試したものはこちらに出力されました。

    キャンセル

  • 2019/10/21 20:21

    ではやはり当該処理を通ってないようですね。
    ログのファイル名についてはタイムゾーンがAsia/Tokyoではないのだと思います。

    キャンセル

  • 2019/10/21 20:29

    ありがとうございます。タイムゾーンをAsia/Tokyoにしたら現在の日時になりました。
    そのようですね…。いろいろと助言いただきありがとうございます。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.92%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る