#はじめに
はい皆の衆よくお聞き
初心者様による
初心者でもできるエラー殺し講座を始める
よく聞かないと死にます
#背景
前回、ancestryとjQueryで多階層型カテゴリの入力フォームを段階的に表示させてみたを投稿するためにサンプルを作ったのですが、さすが初心者。
サンプルを作り終える間に多大なエラーを出しては修正し、修正しては出ししていました。
今回はそのエラーから「404 NotFound」を切り出して、どのように解決していったかを記事にしていきます。
#今回取り扱うエラーについて
404 (Not Found)
HTTP 404、またはエラーメッセージ Not Found(「未検出」「見つかりません」の意)は、HTTPステータスコードの一つ。 クライアントがサーバに接続できたものの、クライアントの要求に該当するもの (ウェブページ等) をサーバが見つけられなかったことを示すもの。(wikipediaより抜粋)
#第一の404 (Not Found)
まず、「js書くべし」で以下のjsを書きました。
$(function() {
function buildHTML(result){
var html =
`<option value= ${result.id}>${result.name}</option>`
return html
}
$("#parent").on("change",function(){
var int = document.getElementById("parent").value
if(int == 0){
$('#child').remove();
$('#item_category_id').remove();
}else{
$.ajax({
url: "categories/",
type: 'GET',
dataType: 'json',
data: {id: int}
})
.done(function(categories) {
var insertHTML = `<select name="child" id="child">
<option value=0>---</option>`;
$.each(categories, function(i, category) {
insertHTML += buildHTML(category)
});
insertHTML += `</select>`
if($('#child').length){
$('#child').replaceWith(insertHTML);
$('#item_category_id').remove();
} else {
$('.items__child').append(insertHTML);
};
})
.fail(function() {
});
};
});
})
はい、もーなんか既に分かる人には分かりますね。
###原因
原因はこれでした。
url: "categories/",
以下のように変更しました。
url: "categories/",
=> url: "/categories",
####気付いたきっかけ
ターミナルを見た時に以下のようになっていました。
Started GET "/items/categories/?id=1" for ::1 at 2020-03-14 15:17:23 +0900 ActionController::RoutingError (No route matches [GET] "/items/categories"):
?なんでitemにネストしたurlになってるの?
ということで、ネストしないようにurl修正しました。
#第二の404 (Not Found)
しかし、再度親の選択フォームを変更するとエラーになります。
今度のターミナルエラーはこれ。
Started GET "/categories?id=1" for ::1 at 2020-03-14 15:36:36 +0900 ActionController::RoutingError (No route matches [GET] "/categories"):
###原因
ただのroutingの設定忘れでした。
Rails.application.routes.draw do
root "items#new"
resources :items ,only: [:index,:new,:create]
end
修正します。
Rails.application.routes.draw do
root "items#new"
resources :items ,only: [:index,:new,:create]
resources :categories ,only: :index
end
#第三の404 (Not Found)
しかし、再度親の選択フォームを変更するとエラーになります。
ターミナルエラーはこれ。
Started GET "/categories?id=1" for ::1 at 2020-03-14 15:45:21 +0900 ActionController::RoutingError (uninitialized constant CategoriesController):
###原因
categories_controller.rbが無い・・・だと?
ちゃんとあるじゃ・・・ある・・・あ?
class CategoryController < ApplicationController
def index
@categories = Category.where(ancestry: params[:id])
respond_to do |format|
format.json
end
end
end
・・・controller作る時に単数形にしてますね・・・。
消して作り直します。
$ rails d controller category
$ rails g controller categories
class CategoriesController < ApplicationController
def index
@categories = Category.where(ancestry: params[:id])
respond_to do |format|
format.json
end
end
end
#今回の教訓
①エラーが出たらターミナルをよく見よう。
②routingはちゃんとやっておこう。
③controllerは複数形で作ろう。
今回は以上です。