これまで ajax通信には jQery 使ってたけど、axios にでajax通信するようになって少しハマったのでメモ
request.xhr? とは?
リクエストが XMLHttpRequest(いわゆるajax通信)
かどうか判定するメソッド。
リクエストがajaxかどうかで処理を分岐させる時によく使う。
ハマったこと
今回 axios でajax通信を行なった時に request.xhr?
が false
を返してきた。
原因
request.xhr?
のコードは以下のように定義されている
def xml_http_request?
get_header("HTTP_X_REQUESTED_WITH") =~ /XMLHttpRequest/i
end
alias :xhr? :xml_http_request?
やってることはすごく単純で HTTP_X_REQUESTED_WITHヘッダー
にXMLHttpRequest
が含まれているかどうかを見てるだけ。
対して
axios.get('/hogehoge')
のようにajax通信を行なってもHTTP_X_REQUESTED_WITHヘッダー
はつかない。
よってrequest.xhr?
が必ず false を返す。
どうすれば良いか
単純にHTTP_X_REQUESTED_WITHヘッダー
を明示的に指定すれば良い。
こんな感じ
axios.get('/hogehoge', headers: {'X-Requested-With': 'XMLHttpRequest'})