JavaScriptの非同期送信の送信先の指定

解決したいこと

JavaScriptでXMLHttpRequest を用いてPOST形式でMessageモデルのcontentカラムにフォームデータを送信したいが、pathパラメータの表現方法がわからないので送信先を指定できない。

全体像

メッセージを送信するためのルーム選択後、メッセージの送信機能を非同期で行う。

補足情報

URI Pattern: /rooms/:room_id/messages

コード

html
1 <%= form_with url: room_messages_path(@room.id), method: :POST, id: "send-form", local: true do |f| %>
2    <%= f.text_area :content, id: "send-input", placeholder: "type a message or time" %>
3    <%= f.submit '送信', class: "submit", id: "submit" %>
4  <% end %>

controller
1 def create
2    @room = Room.find(params[:room_id])
3    message = Message.create(message_params)
4    render json: message 
5  end

javascript
1function sendMessage() {
2  const submit = document.getElementById('submit');
3  submit.addEventListener('click', (e) => {
4    console.log('success ajax')
5    const formData = new FormData(document.getElementById('send-form'));
6    const XHR = new XMLHttpRequest();
7    const url = location.pathname
8    XHR.open("POST", url, true); 
9    XHR.responseType = 'json';
10    XHR.send(formData);
11    XHR.onload = () => {  // 204 no contentエラーが返ってくる
12      if (XHR.status != 200) {
13        alert(`Error ${XHR.status}: ${XHR.statusText}`);
14        return null;
15      }
16      const message = XHR.response.post;
17      const list = document.getElementById("list");
18      const formText = document.getElementById("send-input");
19      const HTML =`
20          <div class="message">
21            <div class="information">
22              <div class="message-info">
23                <p class="info-user">${message.user.username}</p>
24                <p class="info-date">${message.created_at}</p>
25              </div>
26             
27            </div>
28            <div class="message-content">
29              ${safe_join(message.content.split("\n"), tag(br))}
30            </div>
31          </div>`;
32      list.insertAdjacentHTML("afterend", HTML);
33      formText.value = "";
34    };
35    e.preventDefault();
36  });
37}
38
39window.addEventListener('load', sendMessage)

###　自分で調べたこと
googleで「js 非同期通信送信先 pathパラメータ」や「js pathパラメータ　取得方法」などと調べましたがqueryパラメータの取得方法は出てきたりするのですが、pathパラメータに関することが出てこなかったり、jQueryに関することがでてきたりして望むものを調べることができませんでした。