@ri309189

Are you sure you want to delete the question?

Leaving a resolved question undeleted may help others!

@metehod('PUT')処理がGET処理になってしまう。

Q&A

Closed

解決したいこと

@mthod('PUT')を使用ているのですが、開発者ツールで確認するとGETに変換されてしまうので、変換されないようにしたいです。

該当するソースコード

言語名
LALAVELを使用してHTMLでアプリを作成しています。

viewsファイル
@extends('layouts.app')

@section('css')
<link rel="stylesheet" href="{{ asset('css/profile_edit.css') }}">
@endsection

@section('content')
<div class="container">
    <h1>プロフィール設定</h1>
    <div class="content-form">
        <!-- フォーム開始 -->
        <form method="POST" action="{{ route('profile.update') }}" enctype="multipart/form-data">
            @csrf
            @method('PUT')

            <!-- プロフィール画像 -->
            <div class="form-group">
                <div class="profile-input-wrapper">
                    @if(isset($user) && $user->profile_image)
                        <img src="{{ asset('storage/' . $user->profile_image) }}" alt="プロフィール画像" class="profile-image-preview">
                    @else
                        <div class="profile-placeholder"></div>
                    @endif
                    <!-- カスタムファイルボタン -->
                    <div class="file-select-area">
                        <label for="profile_image" class="custom-file-label">画像を選択する</label>
                        <input type="file" name="profile_image" id="profile_image" class="form-control hidden-file">
                        @error('profile_image')
                            <span class="text-danger">{{ $message }}</span>
                        @enderror
                    </div>
                </div>
            </div>

            <!-- ユーザー名 -->
            <div class="form-group">
                <label for="name">ユーザー名</label>
                <input type="text" name="name" id="name" class="form-control" value="{{ old('name', $user->name ?? '') }}" required>
                @error('name')
                    <span class="text-danger">{{ $message }}</span>
                @enderror
            </div>

            <!-- 郵便番号 -->
            <div class="form-group">
                <label for="postal_code">郵便番号</label>
                <input type="text" name="postal_code" id="postal_code" class="form-control" value="{{ old('postal_code', $user->postal_code ?? '') }}">
                @error('postal_code')
                    <span class="text-danger">{{ $message }}</span>
                @enderror
            </div>

            <!-- 住所 -->
            <div class="form-group">
                <label for="address">住所</label>
                <input type="text" name="address" id="address" class="form-control" value="{{ old('address', $user->address ?? '') }}">
                @error('address')
                    <span class="text-danger">{{ $message }}</span>
                @enderror
            </div>

            <!-- 建物名 -->
            <div class="form-group">
                <label for="building_name">建物名</label>
                <input type="text" name="building_name" id="building_name" class="form-control" value="{{ old('building_name', $user->building_name ?? '') }}">
                @error('building_name')
                    <span class="text-danger">{{ $message }}</span>
                @enderror
            </div>

            <!-- 保存ボタン -->
            <button type="submit" class="btn btn-primary">保存</button>
        </form>
    </div>
</div>
@endsection
routesファイル
Route::get('/profile/edit', [UserController::class, 'editProfile'])->middleware('auth')->name('profile.edit'); // プロフィール設定ページ
Route::put('/profile/update', [UserController::class, 'updateProfile'])->middleware('auth')->name('profile.update'); // プロフィール編集処理
Controllersファイル
/**
     * プロフィール更新処理
     */
   public function updateProfile(UpdateProfileRequest $request)
    {
        Log::info('updateProfile メソッドが呼び出されました。');
        Log::info('HTTPメソッド: ' . $request->method());
        Log::info('受け取ったリクエストデータ: ' . json_encode($request->all()));

        $user = Auth::user();
        $validatedData = $request->validated();

        // プロフィール画像の保存
        if ($request->hasFile('profile_image')) {
            $validatedData['profile_image'] = $request->file('profile_image')->store('profile_images', 'public');
        }

        try {
            // ユーザー情報更新
            $user->update([
                'name' => $validatedData['name'] ?? $user->name,
                'email' => $validatedData['email'] ?? $user->email,
                'profile_image' => $validatedData['profile_image'] ?? $user->profile_image, 
            ]);

            // `addresses` テーブルの更新
            $address = Address::where('user_id', $user->id)->first();

            if ($address) {
                $address->update([
                    'postal_code' => $validatedData['postal_code'] ?? $address->postal_code,
                    'address' => $validatedData['address'] ?? $address->address,
                    'building_name' => $validatedData['building_name'] ?? $address->building_name,
                ]);
            } else {
                Address::create([
                    'user_id' => $user->id,
                    'postal_code' => $validatedData['postal_code'],
                    'address' => $validatedData['address'],
                    'building_name' => $validatedData['building_name'],
                ]);
            }

            Log::info('ユーザー情報と住所情報が正常に更新されました。');
        } catch (\Exception $e) {
            Log::error('情報の更新中にエラーが発生しました: ' . $e->getMessage());
            return redirect()->route('profile.edit')->with('error', 'プロフィールの更新に失敗しました。');
        }

        Log::info('updateProfile 処理が完了しました。');
        return redirect()->route('items.index')->with('success', 'プロフィールが更新されました!');
    }
    // ログインページのビューを返す
    public function showLogin()
    {
        return view('auth.login');
    }

開発者ツールで確認した際の画像です。↓
image.png

自分で試したこと

  • nginxのdefault.confファイルにPUT, DELETE メソッドを許可の記述を追加。
server {
    listen 80;
    index index.php index.html;
    server_name localhost;

    root /var/www/public;

    location / {
    try_files $uri $uri/ /index.php$is_args$args;


    PUT, DELETE メソッドを許可の記述を追加!
    limit_except GET POST PUT DELETE {
        allow all;
        }
    }
  • VerifyCsrfToken.phpファイルでCSRF チェックを除外
class VerifyCsrfToken extends Middleware
{
    /**
     * The URIs that should be excluded from CSRF verification.
     *
     * @var array<int, string>
     */
    protected $except = [
    //'profile/update', // ← CSRF チェックを除外をためしました!
    'profile/update'
    ];
}

長々と書き込んでしまい申し訳ありません。
これ以外の対処方法が思い浮かばないので知恵をおかしいただけると幸いです。
よろしくお願いいたします。

1 likes

5Answer

Comments

  1. @ri309189

    Questioner

    回答いただきありがとうございます。
    質問した際に載せてませんでした。

    内POSTに設定しています。 @csrf @method('PUT') このように設定しています💦
  2. @ri309189 生成結果のhtml上では form の method属性は POST で <input name="_method" value="PUT" /> が追加で生成されていますでしょうか?

Comments

  1. それは POST を 別のメソッドとしてルーティング上で考慮する為の仕組みであって、form で GET / POST 以外のメソッドを送る機能ではないのでは……?(元々 form は GET / POST 以外対応しなかった筈ですが

  2. ログからすると、そのルーティング側が それを考慮して サーバーサイドで メソッドの判定をして上書きしているのでは……?
    Rails の link_to も同じと書いてあるので そっちの実装もそういうことですし。

    ※ form 要素は GET / POST しかできないので

  3. なるほど。ブラウザーではなく、ルーティング側の仕組みですね。勉強になりました。

質問本文の コード部分を編集して マークダウンを適用してください。特定文字が装飾として機能してしまって見づらいです

1Like

Comments

  1. @ri309189

    Questioner

    資料まで載せていただきありがとうございます💦
    編集させていただきます。

既に回答があるようにformタグを確認する必要があると思います。

ドキュメントからの引用を記載しておきますので、役に立てば幸いです。

ドキュメントからの引用

Since HTML forms can't make PUT, PATCH, or DELETE requests, you will need to add a hidden _method field to spoof these HTTP verbs. The @method Blade directive can create this field for you:

<form action="/foo/bar" method="POST">
    @method('PUT')
 
    ...
</form>

1Like

Comments

  1. @ri309189

    Questioner

    回答いただきありがとうございます。
    すみません、載せていませんでした。

    @csrf @method('PUT') これで設定してます💦 お手数お掛けしてすみません。
  2. ありがとうございます。

    知りたかったのは <form> タグの方です。
    すでに回答がありますが、<form>はGETかPOSTしかなく、PUTはパラメータを使って擬似的に行ってるものになります。
    なのでGETになるということは<form>タグにmethod属性が設定さておらず、デフォルトのGETになっている可能性が疑われました。

    他の可能性としては、別のイベントがトリガーされていることは考えられます。例えば<form>タグが複数ある場合です。
    <form>をどのようにsubmitさせ、それを開発者ツールでどのように確認されているかがわかれば、もう少し詳しい状況がつかめるかもしれません。

  3. @ri309189

    Questioner

    ありがとうございます。

    のsubmitに関する箇所と、開発者ツールの表示を添付して更新させていただきました。

    長くなってしまい読みづらくて申し訳ございません💦

  4. なるほど、GETリクエストはバリデーションエラーでフォームに戻った時のリクエストのことだったのですね。
    フレームワークやnginxのアクセスログを確認するのが良かったかもしれないですね。
    ひとまず解決したようで良かったです。

  5. @ri309189

    Questioner

    承知しました💦
    フレームワークとnginxのアクセスログを確認するようにします!

エラー原因を解決しました💦
自分で設定したリクエストファイルでバリデーションにひかかって、このような問題がおきていました。
自分でバリデーション設定していたにも関わらず、その画面にはバリデーション内容のinputタグを設定しておらず、バリデーションにひかかっていました。

初歩的なミスで皆さんのお時間を取らせてしまい、大変申し訳ありませんでした。💦

1Like

Your answer might help someone💌