title: How do I make an AJAX POST request with parameters to a PHP backend?
body: <p>This is an update to a previous question marked as a duplicate (<a href="https://stackoverflow.com/questions/62764217/how-do-i-send-an-ajax-post-request-with-parameters-to-php">How do I send an AJAX POST request with parameters to PHP?</a>)</p>
  <p>I am sending an AJAX request to a PHP backend.</p>
  <p>The Javascript functions to make and receive the request:</p>
  <pre><code>var httpRequest;
  
  function makeRequest(){
      httpRequest = new XMLHttpRequest();
  
      httpRequest.onreadystatechange = receiveResponse;
      httpRequest.open(&quot;POST&quot;, &quot;ajax_handler.php&quot;, true);
      httpRequest.setRequestHeader('Content-Type', 'application/json');
      httpRequest.send(JSON.stringify({key:&quot;value&quot;}));
  }
  
  function receiveResponse() {
      if (httpRequest.readyState === XMLHttpRequest.DONE) {
          if (httpRequest.status === 200) {
              console.log(httpRequest.responseText);
          }
      }
  }
  </code></pre>
  <p>The PHP backend <code>ajax_handler.php</code> to process the request:</p>
  <pre><code>&lt;?php
      $data = file_get_contents('php://input');
      echo $data;
  ?&gt;
  </code></pre>
  <p>My original post was marked as a duplicate of <a href="https://stackoverflow.com/questions/18866571/receive-json-post-with-php">this question</a>.  That page has no clear examples, though I was able to infer that I should use <code>file_get_contents('php://input')</code> instead of <code>$_POST</code> in the PHP backend, as shown.</p>
  <p>Using the code shown, <code>console.log(httpRequest.responseText)</code> in the receiving function logs <code>{&quot;key&quot;:&quot;value&quot;}</code> to the console.  If I try to interpret this as an array in the PHP backend, however, with</p>
  <pre><code>&lt;?php
      $data = file_get_contents('php://input');
      echo $data[&quot;key&quot;];
  ?&gt;
  </code></pre>
  <p>the response logs <code>{</code> to the console instead of the expected <code>value</code>.</p>
  <p>In addition to the use of <code>'php://input'</code>, several responses in the <a href="https://stackoverflow.com/questions/18866571/receive-json-post-with-php">linked duplicate</a> also use the <code>json_decode()</code> function in the PHP backend.</p>
  <p>If I include this function in the backend, however, as</p>
  <pre><code>&lt;?php
      $data = json_decode(file_get_contents('php://input'));
      echo $data;
  ?&gt;
  </code></pre>
  <p>The entire AJAX call breaks.  It was set to trigger on a window click, but after including <code>json_decode()</code>, nothing happens on a window click, nothing is returned from the call, and nothing is logged to the console.</p>
  <p>Without an example, it's hard for me to tell if I'm doing the AJAX cycle wrong, or if there's a different problem somewhere else in my code.  So please, for the love of all that is holy, <strong>will someone please post or link me to a self-contained example showing how to make, process, and receive an AJAX call with parameters to a PHP backend?</strong>  It's incomprehensible that this doesn't already exists somewhere on the internet, but I've been searching and asking for days, and I can't find a single example anywhere.  This is without jQuery.</p>
  <p>Thank you in advance.</p>