Javascript: как использовать «глобальную переменную» для двух разных html-страниц?

Я использую 2 разных html, и оба используют один и тот же файл Javascript.

Файл Javascript делает это

var problem;

function login() {
    const login = document.getElementById('login');

    const nome = document.getElementById('lnome');
    const pass = document.getElementById('lpass');

    const item = {
        Username: nome.value.trim(),
        Password: pass.value.trim()
    };
  fetch(uri, {
    method: 'POST',
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(item)
  })
    .then(response => response.json())
    .then((res) => {
      problem = res; //HERE need to put into the 'problem' the value of the res
      window.location.href = url_1; // This calls index_2.html
    })
    .catch(error => console.error('Unable to Login.', error));
}

Приведенный выше код используется в index_1.html.

$(function () {
    var $users_A = $('#users_A');
        $.ajax({
            url: uri_1,
            type: 'GET',
            dataType: 'json',
            beforeSend: function (request) {
                request.setRequestHeader("Authorization", 'Bearer ' + problem);
            },
            success: function (data) {
                $users_A.append('<h4>PROBLEM RESOLVED</h4>');
            },
            error: function (xhr, textStatus, errorThrown) {
                console.info('Error in Operation');
                $users_A.append('<h4>DON'T WORK</h4>');
            }
        });
    });

Приведенный выше код используется в index_2.html.

Когда я запускаю программу, проблема с переменной не содержит информации в «res», поэтому она становится неопределенной, как мне решить эту проблему?

Любой ответ приветствуется