axios では xhr? が効かない

自分用メモ。

axiosはAjaxで通信するときに、リクエストヘッダーにX-Requested-Withを付けません。

参照: https://github.com/axios/axios/issues/1322

なので、Railsのxhr?メソッドは偽になります。

if request.xhr?
 # axiosだと効かない
end

xhr?メソッドを使いたければ、JavaScript側でaxiosのヘッダーにX-Requested-Withを追加する設定が必要です。

Axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

あるいは、Rails側でX-Requested-Withがなくても動くようにします。

if params[:format] == 'json'
 # Ajaxの場合の処理
end