title: How do I post form data with fetch api?
body: <p>My code:</p>
  
  <pre><code>fetch("api/xxx", {
      body: new FormData(document.getElementById("form")),
      headers: {
          "Content-Type": "application/x-www-form-urlencoded",
          // "Content-Type": "multipart/form-data",
      },
      method: "post",
  }
  </code></pre>
  
  <p>I tried to post my form using fetch api, and the body it sends is like:</p>
  
  <pre><code>-----------------------------114782935826962
  Content-Disposition: form-data; name="email"
  
  test@example.com
  -----------------------------114782935826962
  Content-Disposition: form-data; name="password"
  
  pw
  -----------------------------114782935826962--
  </code></pre>
  
  <p>(I don't know why the number in boundary is changed every time it sends...)</p>
  
  <p>I would like it to send the data with "Content-Type": "application/x-www-form-urlencoded", what should I do? Or if I just have to deal with it, how do I decode the data in my controller?</p>
  
  <hr>
  
  <p>To whom answer my question, I know I can do it with:</p>
  
  <pre><code>fetch("api/xxx", {
      body: "email=test@example.com&amp;password=pw",
      headers: {
          "Content-Type": "application/x-www-form-urlencoded",
      },
      method: "post",
  }
  </code></pre>
  
  <p>What I want is something like $("#form").serialize() in jQuery (w/o using jQuery) or the way to decode mulitpart/form-data in controller. Thanks for your answers though.</p>