Railsのルーティングで日本語文字をパラメータとして渡したい

Question

概要

フロントのjsからバックのRails APIを叩いて、データを取得しようと試みています。
この場合、パラメーターとなる名前（日本語）がパーセントにエンコードされるので、Rails側でパラメーターとなる”パフェ”を受け取ることができなく、以下のエラーが出ます。

No route matches [GET] "/api/food/%E3%83%99%E3%83%B3%E3%83%81%E3%83%97%E3%83%AC%E3%82%B9"

axios.get("/api/food/パフェ")

#routes.rb
namespace :api, format: 'json' do
 get '/food/:name' => 'food#item'
end

#food.controller
def item
 @item = Food.find_by(name: params[:name])
end

自分で捻り出した解決方法

1. rails側でパーセントをデコードして受け取る→やり方がわからないし、前段階でルーティングエラーになる
2. axiosでリクエスト投げる時に、エンコードさせない→無理

全く方法が浮かびません...。
ご教授いただけますでしょうか...!よろしくお願い申し上げます。

Answer 1

実際にやっていただいているのでおわかりだと思うのですが、ルーティングで日本語を含めないほうがいいと思います。

一つのやり方として、パラメータとなる値はurlのクエリパラメータとして渡す方法があります。

「クエリパラメータ」というのは、http://gaforum.jp/?s=gaiqのように、URLの末尾に?s=gaiqのようにサーバーにわたしたいパラメータを付け加える情報です。
この値はサーバー側で取得できるので、今回のように検索したい文字列などを渡すときに便利です。

axiosであれば、このように書くとクエリパラメータを指定できます。
axiosのパラメータ指定方法まとめ - Qiita

axios.get('/api/food?name=パフェ');

Railsでは、ルーティングからnameを削除して、

# routes.rb
namespace :api, format: 'json' do
 get '/food' => 'food#item'
end

コントローラーでは今まで通りparams[:name]で取得できます。
Rails APIのURLにクエリパラメータを含める:KeruuWeb

# foods_controller.rb

def item
 @item = Food.find_by(name: params[:name])
end

Comments

[kotarofunyu]

shgktshruch様

できました！！
こんなにご丁寧な回答をいただけて、おまけに解決もできて、大変嬉しいです！
本当にありがとうございます

[shgtkshruch]

解決できてよかったです！