资讯专栏INFORMATION COLUMN

JS+PHP实现登录后自动执行之前的操作

EasonTyler / 586人阅读

摘要:执行操作前判断用户的登录状态,是则执行操作,否则先跳转到登录页面,登录成功后返回页面,页面继续执行之前的操作。进入登录页时获得的必须要记录下来,才能在登录成功后跳转回之前的页面。最后决定选择保存要执行的方法。

问题

用户进入页面A,在页面A上要执行一个操作X。操作X需要用户登录后才能访问,因此系统引导用户到登录页,用户登录后在让用户继续执行操作X。

分析

操作X存在两种情况,1:跳转到一个页面B;2:执行一个操作。

进入页面B的情况,要在页面B的入口位置判断是否用户是否为登录状态,是则进入,否则进入登录页面,登录成功后再进入页面B。假设页面A的URL是是url-a,页面B的url是url-b,登录页面的url是url-l,那么浏览器的地址依次是url-a,url-b,url-l,url-b。因此,系统就是要解决登录模版如何记录url-b,并在成功后进入url-b。

执行一个操作的情况。执行操作前判断用户的登录状态,是则执行操作,否则先跳转到登录页面,登录成功后返回页面A,页面A继续执行之前的操作。这时,登录页要记录页面A,登录成功后返回A,页面A要记录用户的操作和参数,从登录页返回后继续执行。

实现 页面跳转

页面跳转的情况,由页面B负责判断是否要跳转到登录页,如果需要用redirect的方式完成。

header("Location: $loginURL");
exit;

在login页面需要知道是从哪个页面跳转来,并保存,这样登录成功后再跳转回原来的页面。PHP中可以通过$_SERVER["HTTP_REFERER"]获得是从哪个页面进入的的登录页。

$referer = $_SERVER["HTTP_REFERER"];

进入登录页时获得的$referer必须要记录下来,才能在登录成功后跳转回之前的页面。跨调用保存信息有4种方式:1、保存在session中;2、保存在cookie中;3、作为参数放在url中;4、生成页面时,作为页面的隐藏信息。

放在session中,只能通过php获取,因此,登录成功后跳转回原页面的操作只能在php中进行,这样就不能实现通过一个ajax调用验证用户登录信息后,在前端页面直接跳转指定页面。

采用cookie的方式需要前后端共同确定一个约定,用什么代表页面的跳转信息,另外前端需要增加cookie的处理逻辑。这种方式可以同时支持前端或后端进行跳转。

作为参数放在url中可以实现在前端进行跳转,但是会导致url看起来有些怪异,同时还需要考虑url编码的问题。

直接生成在登录页面中(利用页面模版)作为前端参数,这种方式支持在前端进行跳转,需要前后端约定参数的定义。

执行操作

执行操作的情况应该是页面A判断用户是否已经登录,或者根据执行操作X的返回结果,由页面A直接跳转到登录页面,登录界面记录是从哪个页面跳转来的。

header("Location: $loginURL");
exit;

页面A执行跳转到登录页面前,首先记录要执行的操作,例如:操作的名称,这个信息必须可以跨请求访问。操作的相关信息可以通过url、session、cookie传递,或者通过localStorage、sessionStorage保留在客户端。

如果用url指定要执行的操作(用history.pushState替换url),只能携带简单的参数(放在history中是个好方法?没想明白),通用性不好。session和cookie需要向服务器端传数据,而且获取保留的参数并不方便。最后决定选择sessionStorage保存要执行的方法。

跳转到登录界面前保存要执行的操作:

if (window.sessionStorage) {
    var method = JSON.stringify({
        name: "要执行的方法的名称",
        args: [参数1,参数2]
    });
    window.sessionStorage.setItem("pending.method", method);
}

从登录界面跳转回页面,取出要执行的操作并执行:

if (window.sessionStorage) {
    var pendingMethod;
    if (pendingMethod = window.sessionStorage.getItem("pending.method")) {
        window.sessionStorage.removeItem("pending.method");
        pendingMethod = JSON.parse(pendingMethod);
        window[pendingMethod.name].apply($scope, pendingMethod.args || []);
    }
}

总结,采用的方式是通过HTTP_REFERER和cookie记录登录后要跳转的页面,通过sessionStorage记录返回页面后要执行的javascript方法和参数。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/50250.html

相关文章

  • JS+PHP实现登录自动执行之前操作

    摘要:执行操作前判断用户的登录状态,是则执行操作,否则先跳转到登录页面,登录成功后返回页面,页面继续执行之前的操作。进入登录页时获得的必须要记录下来,才能在登录成功后跳转回之前的页面。最后决定选择保存要执行的方法。 问题 用户进入页面A,在页面A上要执行一个操作X。操作X需要用户登录后才能访问,因此系统引导用户到登录页,用户登录后在让用户继续执行操作X。 分析 操作X存在两种情况,1:跳转到...

    iamyoung001 评论0 收藏0
  • JS+PHP实现登录自动执行之前操作

    摘要:执行操作前判断用户的登录状态,是则执行操作,否则先跳转到登录页面,登录成功后返回页面,页面继续执行之前的操作。进入登录页时获得的必须要记录下来,才能在登录成功后跳转回之前的页面。最后决定选择保存要执行的方法。 问题 用户进入页面A,在页面A上要执行一个操作X。操作X需要用户登录后才能访问,因此系统引导用户到登录页,用户登录后在让用户继续执行操作X。 分析 操作X存在两种情况,1:跳转到...

    Eirunye 评论0 收藏0
  • PHP基于laravel框架获取微博数据之一 模拟新浪微博登录

    摘要:模拟登录新浪微博的核心,也是与模拟登录最大的不同,密码加密。已经实现模拟新浪微博登录的功能,之后不再更新。 参考资料: http://www.csuldw.com/2016/11/10/2016-11-10-simulate-sina-login/ http://blog.csdn.net/fly_leopard/article/details/51148904 http://www....

    galois 评论0 收藏0
  • Laravel 上手教程之实现用户注册和登录

    摘要:在文件的标签中加上以下代码新手上路注册登陆上面只是引用了一些简单的的,也没什么难的,不用伤心。 Laravel身为最优雅的PHP框架,很多学习PHP的小伙伴造就对Laravel垂涎欲滴。今天就来实现你的愿望,让我们一起从零开始,利用Laravel实现Web应用最常见的注册和登录功能!所有的课程源码已放在Github上:laravel-start. Race Start ! 首先我们来...

    stormgens 评论0 收藏0
  • Vue-book 2.0 一个移动端简单全栈 web APP

    摘要:本项目是一个简单的全栈项目,前端新手可以拿来练练手。项目实现了一些简单的功能,后台可以对图书进行录入录出扫码或手动,前台显示录入的图书,并且前台注册登录后可以将书的订单发给服务器,并存到服务器。 Vue-book 2.0 Github 地址:https://github.com/percy507/v... 【觉得不错就来个 star 吧 ^_^】 说明(菜鸟请进,大神绕道 ~) 前端...

    wh469012917 评论0 收藏0

发表评论

0条评论

EasonTyler

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<