How to make ajax calls through reverse proxy in elegant way?

Question

I have a project that validates, in Javascript, the structure of a JSON. Here is more or less the structure I had used to rescue the structure asynchronously, as well as what would be the static rescue for a standard structure of condicao_pagmento:

function faz_leitura() {
  let argonautas = JSON.parse(document.getElementById('entrada').value);
  let argonautas_keys = Object.keys(argonautas);
  
  let post_action = () => {
    console.log('pós-ação');
  };
  
  let missing_fetch = argonautas_keys.length;
    let fetch_hit = () => {
        missing_fetch--;
        if (missing_fetch == 0) {
            post_action();
        }
    };
  
  argonautas_keys.forEach(table_name => {
    let xhr = new XMLHttpRequest();
    let ajax_link = "/estrutura/" + table_name + ".json"
    xhr.open("GET", ajax_link);
    
    console.log("ajax " + ajax_link);
    
    xhr.onload = () => {
      console.log("sucesso");
      console.log(xhr.response);
      console.log(xhr.status);
      fetch_hit();
    };
    
    xhr.onerror = () => {
      console.log("falha");
      console.log(xhr.response);
      console.log(xhr.status);
      fetch_hit();
    };
    
    xhr.send();     
  });
}

<a href="/estrutura/condicao_pagamento.json">Link direto teste</a>
<div>
<textarea id="entrada" rows="4" cols="50">
{
  "condicao_pagamento": [
    {
      "cd_cond_pgto": "1",
      "ds_cond_pgto": "marmota"
    }
  ]
}
</textarea>
</div>
<div>
  <button onClick="faz_leitura()">Interpreta</button>
</div>

When I try to do this directly, moving up the project in Tomcat, everything works. When I try to get behind the reverse Apache proxy, AJAX calls don’t work properly, but direct access through the <a href="/estrutura/condicao_pagamento.json"> everything works.

The reverse proxy settings I got from the default Apache Haus. Apache modules I turned on:

LoadModule proxy_module modules/mod_proxy.so
LoadModule proxy_html_module modules/mod_proxy_html.so
LoadModule proxy_http_module modules/mod_proxy_http.so
LoadModule proxy_http2_module modules/mod_proxy_http2.so
LoadModule xml2enc_module modules/mod_xml2enc.so

Configuration of proxy_html_module was the pattern, if I’m not mistaken the signifier is this:

ProxyHTMLLinks  a       href
ProxyHTMLLinks  area        href
ProxyHTMLLinks  link        href
ProxyHTMLLinks  img     src longdesc usemap
ProxyHTMLLinks  object      classid codebase data usemap
ProxyHTMLLinks  q       cite
ProxyHTMLLinks  blockquote  cite
ProxyHTMLLinks  ins     cite
ProxyHTMLLinks  del     cite
ProxyHTMLLinks  form        action
ProxyHTMLLinks  input       src usemap
ProxyHTMLLinks  head        profile
ProxyHTMLLinks  base        href
ProxyHTMLLinks  script      src for

ProxyHTMLEvents onclick ondblclick onmousedown onmouseup \
        onmouseover onmousemove onmouseout onkeypress \
        onkeydown onkeyup onfocus onblur onload \
        onunload onsubmit onreset onselect onchange

Reverse proxy configuration:

ProxyPass /testador-estrutura http://127.0.0.1:8080
ProxyPassReverse /testador-estrutura http://127.0.0.1:8080

<Location /testador-estrutura >
    ProxyPassReverse /
    ProxyHTMLEnable On
    ProxyHTMLURLMap http://127.0.0.1:8080/ /testador-estrutura/
    ProxyHTMLURLMap / /testador-estrutura/
</Location>

In this case, when rendering the page, Apache itself (as configured) interpreted the <a href> and made the necessary replacement to work the test link. Then, when inspecting the element, it shows the following:

<a href="/testador-estrutura/estrutura/condicao_pagamento.json">Link direto teste</a>

However, AJAX calls are not changed and therefore it fails with 404.

Log of calls in Apache:

::1 - - [07/Aug/2018:17:15:17 -0300] "GET /testador-estrutura/ HTTP/1.1" 304 -
::1 - - [07/Aug/2018:17:15:17 -0300] "GET /testador-estrutura/interpreter.js HTTP/1.1" 200 3739
::1 - - [07/Aug/2018:17:15:20 -0300] "GET /estrutura/condicao_pagamento.json HTTP/1.1" 404 244

I solved this problem by creating a basis for AJAX:

<span style="display: none"><a href="/estrutura/" id="ajax-jeitinho"></a></span>

And with the following adjustment in the AJAX call:

function faz_leitura() {
  let argonautas = JSON.parse(document.getElementById('entrada').value);
  let argonautas_keys = Object.keys(argonautas);

  let base_ajax = document.getElementById('ajax-jeitinho').attributes['href'].nodeValue;

  /* ... */

  argonautas_keys.forEach(table_name => {
    let xhr = new XMLHttpRequest();
    let ajax_link = base_ajax + table_name + ".json"
    xhr.open("GET", ajax_link);
    console.log("ajax " + ajax_link);

    /* ... */
  });
}

After this change, these are the Apache logs:

::1 - - [07/Aug/2018:17:20:31 -0300] "GET /testador-estrutura/ HTTP/1.1" 200 1089
::1 - - [07/Aug/2018:17:20:31 -0300] "GET /testador-estrutura/interpreter.js HTTP/1.1" 200 3722
::1 - - [07/Aug/2018:17:20:42 -0300] "GET /testador-estrutura/estrutura/condicao_pagamento.json HTTP/1.1" 200 161

My point is:

• has some more elegant way of doing AJAX through reverse proxy?
• if yes, what changes should I make to make my original server agnostic of the existence of the reverse proxy (without using invisible tags)?