laravelでルーティングが設定されているにも拘らず、404エラーが発生する

Question

laravel 6.8

現在フォームに入力するとdbから検索候補をdatalistとして、表示する機能を作成していますが、ルーティングが設定されているにも拘らず404エラーが出てしまってうまくいきません。
一応postでも試したのですが、やはり404エラーが出てしまいます。
どなたかご助言頂けませんでしょうか。

ルーティング

Route::get('/', 'WordController@index')->name('words.index');
Route::resource('/words', 'WordController')->except(['index']);
Route::prefix('/words')->name('words.')->group(function () {
    Route::get('/', 'WordController@search')->name('search');
    Route::get('/autocomplete', 'WordController@autocomplete')->name('autocomplete');
    Route::get('/perfect', 'WordController@perfect')->name('perfect');
    Route::get('/pertial', 'WordController@pertial')->name('pertial');
});

php artisan route:listの結果
| GET|HEAD | words/autocomplete | words.autocomplete | App\Http\Controllers\WordController@autocomplete | web

ビュー

　　　<search-form
      endpoint="{{ route('words.autocomplete') }}"
     　name="word">
       </search-form>

コントローラー

    public function autocomplete(Request $request)
    {
        $words = Word::where('word', 'LIKE', "$request->word%")
                    ->orWhere('read', 'LIKE', "$request->word%")
                    ->limit(10)
                    ->orderBy('created_at', 'desc')->get();
        return response()->json($words);
    }

コンポーネント

<template>
    <div class="col-12">
        <i class="fas fa-search" aria-hidden="true"></i>
        <input
        type="text"
        autocomplete="on"
        list="word-list"
        placeholder="Search"
        name="word"
        class="form-control form-control-sm ml-3 w-75"
        aria-label="Search"
        v-model="searchForm"
        @input="getSuggestionList"
        >
        <datalist id="word-list">
            <option 
            v-for="result in results"
            :key="result.id"
            :value="result.word"
            />
        </datalist>
        <div>
            <div class="custom-control custom-radio custom-control-inline p-5">
                <input type="radio" class="custom-control-input" id="type-0" name="type" value="0" checked>
                <label class="custom-control-label" for="type-0">完全一致</label>
            </div>
            <div class="custom-control custom-radio custom-control-inline p-5">
                <input type="radio" class="custom-control-input" id="type-1" name="type" value="1">
                <label class="custom-control-label" for="type-1">部分一致</label>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    props: {
        endpoint:{
            type: String,
        },
    },
    data() {
        return {
            results: [],
            searchForm: '',
        };
    },
    methods: {
        getSuggestionList() {
            this.results = [];
            if (this.searchForm.length > 0) {
                axios.get(this.endpoint, {
                         word: this.searchForm,
                    })
                    .then(Response => {
                        this.results = Response.data;
                        console.log(Response.data);
                    })
                    .catch(error => {
                        console.log(error);
                    });
            }
        }
    },
}
</script>

Comments

[yuki84web]

Laravelアプリケーションの実行URLと、指定しているルーティングのURLの相対パスから、有効なURLであるか分かりますか？

[_takenoko]

http://localhost/words/autocompleteでアクセスした場合not foundとなります。
フォームのあるurlはhttp://localhostです。
質問の解釈が間違っていたら申し訳ございません。
ルーティングのwords/autocompleteのautocomplete部分を削除すると、ルーティングが見つからないとなってしまいます。
ビュー側で名前付きルートを{{ route('') }}と指定してあげればweb.phpの指定されたアクションメソッドが走ると認識しているのですが、違うのでしょうか？

[mix-peach]

URLが、words　で始まるルート設定を、
記述順通りに全て（word/autocomplete も含めて）ご提示いただくことは可能ですか？

[_takenoko]

返信が遅くなってしまい、申し訳ございません。
wordsにかかわる全てのルーティングを追記いたしました。

Answer 1

resourceが悪さをしているのではないでしょうか？

Route::resource('/words', 'WordController')->except(['index']);

getで「/words/{word}」のようなルーティングが出来て、そこで引っかかるような気がします。
Route::resourceをweb.phpの最終行に移動させるとアクセス出来るようになるのではないでしょうか。

Comments

[_takenoko]

仰る通りresourceルートを最後にすることで結果が返ってくるようになりました。
引数に$word無くても引っかかってしまうんですね...。
勉強になりました。
ありがとうございました。

Answer 2

先頭のスラッシュを取ってみると、どうでしょうか

Route::get('words/autocomplete', 'WordController@autocomplete')->name('words.autocomplete');

Comments

[_takenoko]

変わらず404エラーが出てしまいます...。

[yuki84web]

Route::get('/', 'WordController@search')->name('search');
これをグループの中の一番下に持ってくるとどうですか？

[_takenoko]

同じく404です。

[yuki84web]

他のルーティングを一時的に削除してみて、該当のURLのみが使える状態に出来ますか？

[_takenoko]

他のルーティング削除した結果アクセスできるようになりました。
ありがとうございました。

[yuki84web]

順次元の状態に戻していき、原因になっているルーティングが判明したら、（他の方も回答されていますが）それを移動したり、他の設定方法を検討してみてください。