提交表单后，网页 UI 不会在刷新时更新答案

【问题标题】：Webpage UI not updating on refresh after form submission提交表单后，网页 UI 不会在刷新时更新
【发布时间】：2017-09-02 08:49:19
【问题描述】：

我正在创建一个可以从任何页面登录的网络应用程序。为了实现这一点，我使用了登录表单的模式。成功登录后，我希望用户留在同一页面上。这是我的登录验证脚本。

$.ajax({
    dataType: "json",
    type: "POST",
    data: {
        login: true,
        email: cleanScripts($('#username').val()),
        password: cleanScripts($('#password').val())
    },
    url: "plugins/validator.php",
    success: function () {
        location.reload();
    },
    error: function () {
        $('.error').show();
    }
});

在标题模板（我有登录按钮的地方）上，我检查用户是否已登录并更新 html 代码，如下所示

if (!isset($_SESSION['userIdMain']))
   echo '<li>
            <a href="#" onclick="showLoginForm();">
              <i class="dashicons dashicons-lock"></i>
              <span>LOGIN/SIGN UP</span>
            </a>
        </li>';
else echo '<span>Hi, ' . $_SESSION["userName"] . '</span>';

页眉模板包含在页面中使用

<?php include 'templates/header.php' ?>

理想情况下，成功登录后，页面应该刷新，而不是登录/注册按钮，它应该显示登录用户的名称。但是用户界面没有更新。即使成功登录，页面也会显示 LOGIN/SIGNUP 按钮。

当我导航到其他页面时，它按预期工作。执行登录的页面的 UI 未更新。知道为什么会这样吗？

谢谢

【问题讨论】：

您确定验证器正在写入 $_SESSION 吗？
是的。当我导航到另一个页面时，它工作得很好。说，我从联系页面登录。刷新时，联系人页面未更新。当我进入常见问题页面时，它的工作和用户界面正在更新。
好的，验证器正在运行，但页面没有刷新。你能确认success() {} 正在执行吗？也许可以输入控制台登录来检查它
我刚刚意识到您说页面令人耳目一新，我的错误。也许它是从浏览器的缓存中返回的。尝试使用附加到 url 的随机 get 参数重新加载页面，以强制从服务器正确重新加载
即使我认为它与缓存有关。但是我应该如何让它在没有任何参数的情况下工作。我见过很多网站在没有任何额外参数的情况下正确地做到了这一点

标签： javascript php jquery html login

【解决方案1】：

似乎Ajax成功后下面的代码不起作用。

success: function () {
    location.reload();
},

试试下面的代码怎么样

success: function () {
    window.location.href=window.location.href;
},

如果上述方法也不起作用，请告知出现此问题时使用的浏览器吗？

【讨论】：

Ajax 代码正在运行，页面正在刷新。我正在使用 chrome 最新版本
@KaleshKaladharan 顺便说一句，你试过 [window.location.href=window.location.href;] 吗？这有帮助吗？

【解决方案2】：

也许下面的代码是被chrome缓存系统缓存的，它认为php从未改变过，也没有发出php请求。

success: function () {
    location.reload();
},

试试下面的代码，它会在不考虑资源是否被改变的情况下获取服务器资源。

success: function () {
    location.reload(true);
},

希望能给你一些帮助。

force-a-reload-of-page-in-chrome-using-javascript-no-cache

根据上面的文章，结果如下：

在 IE 和 FF 上我发现以下代码运行良好；

window.location.reload(true);

但它不适用于 Chrome 或 Safari。

所以看起来有两种解决方案，如下所示。

改用 IE 或 FireFox

尝试上面链接文章中提示的代码

success: function () {
     $.ajax({
         url: window.location.href,
         headers: {
             "Pragma": "no-cache",
             "Expires": -1,
             "Cache-Control": "no-cache"
         }
     }).done(function () {
         window.location.reload(true);
     });
},

【讨论】：

这没有帮助
在Web服务器中确认一下关于catch的设置如何
您能详细说明一下吗？我不明白。抱歉，我是 php 和网页方面的新手
那会告诉web服务器在这个问题期间使用的吗？估计是apache吧？（网页开发中常用apache+php）
@KaleshKaladharan 我已经编辑了这个答案，请检查它是否能给你一些帮助。

【解决方案3】：

问题与 session_start(); 有关。 session_start() 必须在每个页面上调用。我的模板文件顶部有 session_start()，所以它成功写入 $_SESSION 变量。

这就是它的样子。

主文件

<?php
//Header contains login forms

include_once 'templates/header.php';

// All the other codes

$var = $_SESSION['loginData'];

include_once 'templates/footer.php';
?>

头文件

<?php

session_start();

$_SESSION['loginData']=$_POST['loginId'];
?>

即使从头文件调用 session_start()，它也不能在主文件中使用。 session_start() 必须在每个需要访问 $_SESSION 的文件上调用。

【讨论】：