1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Laravel vue.js axios 500 (Internal Server Error) の解決方法

Last updated at Posted at 2021-01-10

##はじめに
この記事では

Laravel vue.js axiosを使って開発しているときに

500 (Internal Server Error)

のエラーに遭遇してどこで処理が止まっているのかを調べるデバック方法をまとめました。

##デバック方法

① command + option + I キーで もしくは 右クリックで「検証」ツールを開く

② consoleタブを押し,500 (Internal Server Error) が出ていることを確認する
スクリーンショット 2021-01-10 17.23.10.png

③ Networkタブを押し, 「all」の項目を押すと現在そのページで使われているファイルを確認することができます
スクリーンショット 2021-01-10 17.23.53.png

④ ファイル名を選択すると 「message」のところにエラーメッセージが出力されています。
スクリーンショット 2021-01-10 17.24.25.png

今回はidが渡っていなかったので修正したら処理が通るようになりました。

【補足】
[【Vue.js】Vuejsをchromeブラウザでデバッグする方法]
(https://qiita.com/nonkapibara/items/8b587013b6b817d6dfc4)

chromeでVue.js Devtoolsをインストールします。

スクリーンショット 2021-01-10 18.27.41.png

データの受け渡し、処理の流れを確認することができます。

##おわりに
エラーが出て分からなくなることがありますが、
どこまで処理が走っているのか
どこで処理が止まっているのか
デバックをすることで、処理の流れを把握することができます。

1
0
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?