Using a Location header in Fetch response

  fetch, http-headers, javascript, php

I’m using a fetch request and I want to detect a location header in the response so that I can react differently depending on if there is a location header as follows:


  fetch(request)
  .then(response => {
    for(var keyValPair of response.headers.entries())
    {
      alert(keyValPair[0]);
      if(keyValPair[0] === 'Location')
      {
        alert('TRYING TO RELOCATE');
        window.location.replace(keyValPair[1]);
        return;
      }
    }
    if(response.ok)
    {
      return response.text();
    }
    else
    {
      document.getElementById(targetBlock).innerHTML = 'ERROR! ERROR! There has been an ERROR!'
    }
  })
  .then(removeBlock('alertMessageBlock'))
  .then(function(text){document.getElementById(targetBlock).innerHTML = text;})
  .catch(error => console.log('There was an error:', error))
}

The php file it’s fetching is as follows:

<?php
require __DIR__ . '/../../private_templates/Template/varsConstants.php';
require_once __DIR__ . '/../../private_templates/Modules/functions.php';
require __DIR__ . '/../../private_templates/Modules/dbConnection.php';
require_once __DIR__ . '/../../private_templates/Modules/DatabaseTable.php';
require_once __DIR__ . '/../../private_templates/Modules/Authentication.php';
require_once __DIR__ . '/../../private_templates/Modules/memberClass.php';

if (!isset($alertMessage))
{
  $alertMessage = [];
}
$membersTable = new DatabaseTable($dbc, 'member', 'memberID');
$authentication = new Authentication($dbc, $membersTable, 'email', 'pass');
if ($authentication->isLoggedIn())
{
?>
<form data-targetBlock="adminMembers" class="fetchForm" action="<?=ADDRESS ?>/MAINhubs/privateHub.php" method="post">
  <fieldset>
    <legend>Search for Members By:</legend>
    <label for="searchType">Choose Search Parameter:</label>
    <select name = "searchType">
      <option value = "none" selected>Choose parameter to search by</option>
      <option value = "registrationDate">Registration Date</option>
      <option value = "firstName">First Name</option>
      <option value = "lastName">Last Name</option>
      <option value = "email">Email</option>
      <option value = "company">Company</option>
      <option value = "city">City</option>
      <option value = "region">Region</option>
      <option value = "country">Country</option>
    </select>
    <button type="submit" name="formTarget" value="adminMembersSearch">Load Members Search Form</button>
  </fieldset>
</form>
<div id="adminMembers">
</div>
<?php
}
else
{
  header('Access-Control-Expose-Headers: Location');
  header('Location: ' . ADDRESS);
}
require_once __DIR__ . '/../../private_templates/Sections/alertMessageBlock.php';
?>

The fetch works fine and the location header works fine, but my intercepting the header is not working where I want the whole window to redirect to the location instead of inserting it into the targetBlock.
I feel like I need to expose the location header, but I don’t know how to do that… Any help?

Source: Ask PHP

LEAVE A COMMENT