Fix/modernize website log in that queries another site for authentication

First, please look at https://staging.upstatetoday.com/letmein

I have inherited a very old log in mechanism that has begun to not work lately – Firefox refuses to log users in, other browsers can be iffy, too. The site is wordpress, but the login is a different server (paywall).

Correct behavior is: insert username and password, click login button, page refreshes and sends user to the homepage if authentication is valid; alert drops that the username/password is incorrect if invalid.

This only seems to happen corectly in Chrome on the desktop, and sometimes in Edge. Firefox just refreshes the page. There are no js errors.

The login button is supposed to call a JS function that stores the current url (not needed in this implementation) then calls a function (in the wordpress functions.php file) that queries a separate site with the username and password and receives an XML response. That response is evaluated for a Yes and the user is allowed in or not, based on that xml response. If the user is allowed, the JS function returns the user to the page where they last were. If they are not allowed, the JS function alerts with bad user or pass msg.

Anyone can go to any post or page, but the single.php template is modified to check for authentication. If they are authenticated, they see the post. If not, they see a notice to subscribe or log in.

But, There’s more going on in the code that is not needed (?) and I think there is unnecessary duplication of the process.

You can see the dialog at the link on top. Please ignore the styling (coming later).

I have moved code, tried snippets, php sessions, but nothing is working in Firefox at all, and with no error messages, I do not know how to proceed.

This is the code for the login dialog:

<?php if(!isset($_SESSION['auth']) ) { ?>
    <a href="https://seneca.newzware.com/ss70v2/seneca/common/template.jsp?" target="new">Forgot user name/password? Click Here</a> 

    <form>
    <div class="form-group">
        <label for="pwd">User name:</label>
        <input type="text"  autocomplete="user-name" class="form-control" id="user-name" placeholder="Enter user name" style="width:200px; margin-bottom:5px;"/></div>
        
    <div class="form-group">
        <label for="pwd">Password:</label>
            <input type="password" autocomplete="current-password" class="form-control" id="pwd" placeholder="Enter password" style="width: 200px;margin-bottom:5px;"/> <button type="submit" class="btn btn-primary" id="sub-sign-in" style="color:blue;font-size:1.0em">Log in to Upstate Today</button>  </div>
    </form>
        <a href="https://seneca.newzware.com/ss70v2/seneca/common/template.jsp?#v3-registration-div" target="new"><button class="btn btn-default">Register or Renew Subscription </button> </a> 

<?php } else { ?>   
"<script type="text/javascript">   
    function Redirect() 
    {  
        window.location="https://staging.upstatetoday.com"; 
    } 
    document.write("You will be redirected to the homepage in 5 seconds"); 
    setTimeout('Redirect()', 5000);   
</script>"
<?php } ?>

This is the js that is called by “sub-sign-in” :

jQuery(document).ready(function( $ ){
  var pageURL = $(location).attr("href");
    localStorage.setItem("page_url", pageURL);
  console.log('ready');
  $('#sub-sign-in').click(function(){
    console.log('enter');
      var user_name=$('#user-name').val();
      var password=$('#pwd').val();
    $.ajax({
      type: "POST",
      url: '/wp-admin/admin-ajax.php',
      data: ({
        action: "check_address",
        name: user_name,
        pass:password
      }),
      success: function (response){
        console.log(response);
        var pg_url = localStorage.getItem("page_url");
        if(response == 'Yes0'){
         window.location.replace(pg_url);
        }
        else{
        alert('wrong username or password');
        }
      },
    error: function(error){
    console.log(error);
    }
    });
  });
});

This is the code from the child theme functions.php



function register_my_session()
{
  if( !session_id() )
  {
    session_start();
      }
}

add_action('init', 'register_my_session');

  /*     session_write_close(); */


function check_address()
{
$name = $_POST["name"];
$password = $_POST["pass"];
/*$edition = $_POST["edition"];
$subdate = $_POST["subscriptiondate"]*/
$response = wp_remote_get( 'https://seneca.newzware.com/authentication/auth70_xml.jsp?site=seneca&login_id='.$name.'&password='.$password);
$xml = simplexml_load_string($response['body']);
$isValid = (string) $xml->authenticated;
if(!session_id()) {
session_start();
}
if($isValid == 'Yes'){
$_SESSION['auth'] = '1';
}
echo $isValid;


}
add_action( 'wp_ajax_check_address', 'check_address' );
add_action( 'wp_ajax_nopriv_check_address', 'check_address' );
add_action( 'wp_enqueue_scripts', 'hello_elementor_child_enqueue_scripts', 20 );

function wpb_widgets_init() {
 
    register_sidebar( array(
        'name'          => 'Custom Header Widget Area',
        'id'            => 'newzware-widget',
        'before_widget' => '<div class="newzware-widget">',
        'after_widget'  => '</div>',
        'before_title'  => '<h2 class="newzware-title">',
        'after_title'   => '</h2>',
    ) );
 
}
add_action( 'widgets_init', 'wpb_widgets_init' );

This is the single post content that includes whether the user can read that post or not (ie, is authenticated):


<?php
/**
 * The template for displaying singular post-types: posts, pages and user-defined custom post types.
 *
 * @package HelloElementor
 */

if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly.
}
?>


<?php
while ( have_posts() ) :
    the_post();
    ?>

<main id="content" <?php post_class( 'site-main' ); ?> role="main">
    <?php if ( apply_filters( 'hello_elementor_page_title', true ) ) : ?>
        <header class="page-header">
            <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
        </header>
    <?php endif; ?>
    <!-- Newzware Protection Code -->   
    
    <?php
        $key = 'Free Story';
        $themeta = get_post_meta($post->ID, $key, TRUE);
        if($themeta != '') {
        $free_story = 1; 
        }
    ?>

    <?php if($_SESSION['auth'] == '1' OR current_user_can( 'read_post' ) OR $free_story == '1' ) { ?>   
    
    <!-- end part 1Newzware Protection Code --> 
    
    <div class="page-content">
        <?php the_content(); ?>
        
    <!-- beginpart 2 Newzware Protection Code -->       
<?php } else { ?>

<div class='ifsub-panel'> <div class='ifsubpanel-heading' style='background:#2318A4; color:#fff; text-align:center;'><b>Subscribe To The Journal</b></div><div class='ifsubpanel-body'>  <p style='text-align:center'>
If you are already registered with <a href="https://upstatetoday.com">UpstateToday.com</a>, please click the LOGIN button in the upper left corner of this window to log in and continue reading.<br><br>
            
If you'd like to subscribe,<br>
<a href='https://seneca.newzware.com/ss70v2/seneca/common/template.jsp?nwmodule=nonsubscribers&nwpage=nonsubstart'><b class="text-danger"> Please click here for options. We'd love for you to join our family.</b></a></p>
</div></div>
        

    
    <?php } ?>
    
    
    <!-- End Newzware Protection Code -->       
        <div class="post-tags">
            <?php the_tags( '<span class="tag-links">' . __( 'Tagged ', 'hello-elementor' ), null, '</span>' ); ?>
        </div>
        <?php wp_link_pages(); ?>
    </div>

    <?php comments_template(); ?>
</main>

    <?php
endwhile;

I want to make this work reliably in desktop and mobile browsers. I’d love to have a user tap a login button, go to a page with the dialog, log in, then return to the home page.

Thanks for your time and pointers.