`
denger
  • 浏览: 359243 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

CAS 之 跨域 Ajax 登录实践

企业应用AjaxSSOCASCookie跨域 
阅读更多

因最近经常有时候被一些朋友问到关于 CAS 跨全域下的 Ajax 登录方式实现，正好之前也分析Sina微博的SSO实现，文中也说了 SINA 的 SSO 实际上(或机制)直接使用了 CAS 这个开源项目。于是本文中要说的CAS AJAX登录方式便参考了 SINA 的AJAX登录实现。 关于具体方案，CAS官方上好象没有提供相关说明，倒是有一文说到 Without the Login Screen (详情参见 CAS 之自定义登录页实践)，其具体实现方式甚是麻烦，又是改源码，又是通过JS跳转，又是一堆配置。 当然，虽然如此，但该文中所提到的获取 login tikcet 的方式还是值的参考的，因为无论什么方式登录，前提是必须获取到该ticket才允许登录验证。
     虽然这里所说的主要是针对 CAS，其实具体的实现方式中有些还是值得参考的，如跨域设置 cookie, jsonp + iframe 跨域异步请求、P3P 及 关于 spring webflow 等其它相关的一些信息。

思路
     关于具体的实现思路基本上都是参考了 SINA，所以详细信息可以在 分析Sina微博的SSO实现 看到 或 自己去 firebug 一下 sina micro-blog。


实践
    Environment：
        cas-server-3.4.2.1       http://www.passport.com:8080/cas/
        cas-client-3.1.10         http://www.portal.com:8080/login
   以上域名是方便测试跨域，故修改本机 hosts。

    Step 1:  在首次进入登录时(portal域中/login)，通过 JSONP 从 passport 域中获取 login ticket。
    登录表单:
    
					<form action="http://www.passport.com:8080/cas/login" method="post" onsubmit="return loginValidate();" target="ssoLoginFrame">
						<ul>
							<span class="red" style="height:12px;" id="J_ErrorMsg"></span>

							<li>
								<em>用户名：</em>
								<input name="username" id="J_Username" type="text" autocomplete="off" class="line" style="width: 180px" />
							</li>
							<li>
								<em>密 码：</em>
								<input name="password" type="password"  id="J_Password" class="line" style="width: 180px" />
							</li>

							<li class="mai">
								<em>&nbsp;</em>
								<input type="checkbox" name="rememberMe" id="rememberMe" value="true"/>
								&nbsp;自动登录
								<a href="/retrieve">忘记密码？</a>
							</li>
							<li>
								<em>&nbsp;</em>
								<input type="hidden" name="isajax" value="true" />
								<input type="hidden" name="isframe" value="true" />
								<input type="hidden" name="lt" value="" id="J_LoginTicket">
								<input type="hidden" name="_eventId" value="submit" />
								<input name="" type="submit" value="登录" class="loginbanner" />
							</li>
						</ul>
					</form>
    
$(document).ready(function(){ 
		flushLoginTicket();  // 进入登录页，则获取login ticket，该函数在下面定义。
	});
    关于 cas-server 如何返回 lt ，在 Without the Login Screen 文章中有提到。


    Step 2:  输入用户名密码，提交验证。将表单信息将会被POST提交至 动态的iframe中，定义该登录页面中登录后的处理逻辑。 
	// 登录验证函数, 由 onsubmit 事件触发
	var loginValidate = function(){
		var msg;
		if ($.trim($('#J_Username').val()).length == 0 ){
			msg = "用户名不能为空。";
		} else if ($.trim($('#J_Password').val()).length == 0 ){
			msg = "密码不能为空。";
		}
		if (msg && msg.length > 0) {
			$('#J_ErrorMsg').fadeOut().text(msg).fadeIn();
			return false;
			// Can't request the login ticket.
		} else if ($('#J_LoginTicket').val().length == 0){
			$('#J_ErrorMsg').text('服务器正忙，请稍后再试..');
			return false;
		} else {
			// 验证成功后，动态创建用于提交登录的 iframe
		    $('body').append($('<iframe/>').attr({
		    	style: "display:none;width:0;height:0", 
		    	id: "ssoLoginFrame",
		    	name: "ssoLoginFrame",
		    	src: "javascript:false;"
		    }));
			return true;
		}
	}
	
	// 登录处理回调函数，将由 iframe 中的页同自动回调
	var feedBackUrlCallBack = function (result) {
		customLoginCallBack(result);
		deleteIFrame('#ssoLoginFrame');// 删除用完的iframe,但是一定不要在回调前删除，Firefox可能有问题的
	};

	// 自定义登录回调逻辑
	var customLoginCallBack = function(result){
		// 登录失败，显示错误信息
		if (result.login == 'fails'){
			$('#J_ErrorMsg').fadeOut().text(result.msg).fadeIn();
			// 重新刷新 login ticket
			flushLoginTicket();
		}
		// do more....
	}

	var deleteIFrame = function (iframeName) {
		var iframe = $(iframeName); 
		if (iframe) { // 删除用完的iframe，避免页面刷新或前进、后退时，重复执行该iframe的请求
			iframe.remove()
		}
	};
	
	// 由于一个 login ticket 只允许使用一次, 当每次登录需要调用该函数刷新 lt
	var flushLoginTicket = function(){
		var _services = 'service=' + encodeURIComponent('http://www.portal.com:8080/uc/');
		$.getScript('http://www.passport.com:8080/cas/login?'+_services+'&get-lt=true&n=' 
				+ new Date().getTime(), 
		function(){
			// 将返回的 _loginTicket 变量设置到  input name="lt" 的value中。
			$('#J_LoginTicket').val(_loginTicket);
		});
		// Response Example:
		// var _loginTicket = 'e1s1';
	}
    当点击登录后，则动态创建一个 iframe，并且登录表单提交至该 iframe 中。在下面截图中看以 body 中的变化:



    由于原本的 CAS 登录方式是通过跳转、重定向的方式实现，所以需要对 CAS的Server端进行调整，使其同时支持 Ajax 方式登录。


    Step 3:  调整 CAS Server端，使其适应 Iframe 方式登录，并使其支持回调。
    打开 login-webflow.xml，找到 <action-state id="generateServiceTicket"> 的 Flow-Action 配置项: 
<!--当执行到该 action 的时候，表示已经登录成功，将生成 ST(Service Ticket)。-->	
<action-state id="generateServiceTicket">
	<evaluate expression="generateServiceTicketAction" />
        <!--当生成 ST 成功后，则进入登录成功页，新增 loginResponse Action 处理项，判断是否是 ajax/iframe 登录 -->
		<!-- <transition on="success" to="warn" /> -->
		<transition on="success" to="loginResponse" />
		<!--<transition on="error" to="viewLoginForm" />-->
        <!-- 可能生成 service ticket 失败，同样，也是进入 loginResponse -->
		<transition on="error" to="loginResponse" />
		<transition on="gateway" to="redirect" />
	</action-state>
    再新增 loginResponse Action配置项： 
	<action-state id="loginResponse">
		<evaluate expression="ajaxLoginServiceTicketAction" />
		<!--非ajax/iframe方式登录，采取原流程处理 -->
		<transition on="success" to="warn" />
		<transition on="error" to="viewLoginForm" />
		<!-- 反之，则进入 viewAjaxLoginView 页面 -->
		<transition on="local" to="viewAjaxLoginView" />
	</action-state>
   再调整，当验证失败后，也需要判断是否是 iframe/ajax登录：
	<action-state id="realSubmit">
		<evaluate
			expression="authenticationViaFormAction.submit(flowRequestContext, flowScope.credentials, messageContext)" />
		<transition on="warn" to="warn" />
		<transition on="success" to="sendTicketGrantingTicket" />
		<!--将 to="viewLoginForm" 修改为 to="loginResponse" -->               
		<transition on="error" to="loginResponse" />
	</action-state>

还需要配置 viewAjaxLoginView 的 state:    
<end-state id="viewAjaxLoginView" view="viewAjaxLoginView" />
   
     接着，再定义 ajaxLoginServiceTicketAction Bean 吧，直接在 cas-servlet.xml 声明该 bean:
     
<bean id="ajaxLoginServiceTicketAction" class="com.unknow.cas.server.web.AjaxLoginServiceTicketAction"/>
    
package com.haha.cas.server.web;

import javax.servlet.http.HttpServletRequest;

import org.apache.commons.lang.BooleanUtils;
import org.apache.commons.lang.StringUtils;
import org.jasig.cas.authentication.principal.Service;
import org.jasig.cas.web.support.WebUtils;
import org.springframework.webflow.action.AbstractAction;
import org.springframework.webflow.execution.Event;
import org.springframework.webflow.execution.RequestContext;

public final class AjaxLoginServiceTicketAction extends AbstractAction {
	
	// The default call back function name.
	protected static final String J_CALLBACK = "feedBackUrlCallBack";

    protected Event doExecute(final RequestContext context) {
        HttpServletRequest request = WebUtils.getHttpServletRequest(context);
        Event event = context.getCurrentEvent();
        boolean isAjax = BooleanUtils.toBoolean(request.getParameter("isajax"));
        
        if (!isAjax){  // 非 ajax/iframe 方式登录，返回当前 event.
        	return event;
        }
    	boolean isLoginSuccess;
    	// Login Successful.
    	if ("success".equals(event.getId())){ //是否登录成功
    		final Service service = WebUtils.getService(context);
            final String serviceTicket = WebUtils.getServiceTicketFromRequestScope(context);
            if (service != null){  //设置登录成功之后 跳转的地址
            	request.setAttribute("service", service.getId());
            }
            request.setAttribute("ticket", serviceTicket);
            isLoginSuccess = true;
    	} else { // Login Fails..
    		isLoginSuccess = false;
    	}

        boolean isFrame = BooleanUtils.toBoolean(request.getParameter("isframe"));
        String callback = request.getParameter("callback");
        if(StringUtils.isEmpty(callback)){ // 如果未转入 callback 参数，则采用默认 callback 函数名
        	callback = J_CALLBACK;
        }
        if(isFrame){ // 如果采用了 iframe ，则 concat 其 parent 。
        	callback = "parent.".concat(callback);
        }
        request.setAttribute("isFrame", isFrame);
        request.setAttribute("callback", callback);
        request.setAttribute("isLogin", isLoginSuccess);
        
        return new Event(this, "local"); // 转入 ajaxLogin.jsp 页面
    }
}
最后，再定义一下 view 的页面地址吧，修改 default_views.properties，添加: 
viewAjaxLoginView.(class)=org.springframework.web.servlet.view.JstlView
viewAjaxLoginView.url=/WEB-INF/view/jsp/custom/ui/ajaxLogin.jsp
    可见，spring webflow 的可扩展性是相当的强，在 login flow 中增加一个业务逻辑，极其方便。
    OK，再是 ajaxLogin.jsp 的代码，从 request attributes 中获取到  ST, Service 等参数信息:
    
<%@ page contentType="text/html; charset=UTF-8"%>
<html>
	<head>
		<title>正在登录....</title>
	</head>
	<body>
		<script type="text/javascript">
			<%
				Boolean isFrame = (Boolean)request.getAttribute("isFrame");
				Boolean isLogin = (Boolean)request.getAttribute("isLogin");
				// 登录成功
				if(isLogin){
					if(isFrame){%>
						parent.location.replace('${service}?ticket=${ticket}')
					<%} else{%>
						location.replace('${service}?ticket=${ticket}')
					<%}
				}
			%>
			// 回调
			${callback}({'login':${isLogin ? '"success"': '"fails"'}, 'msg': ${isLogin ? '""': '"用户名或密码错误！"'}})
		</script>
	</body>
</html>
    以上 jsp 将是在 iframe 中执行，看到这个 JSP 后，再回头看看 最上面 login 页面中 js 就很清楚了。
    OK，至此，已经完成所有工作，下面测试一把，通过使用 Firbug 看看其处理情况。


    Step 4:  测试，当登录失败后，是否在 www.portal.com:8080/login 页中显示www.passport.com:8080/cas/ 中返回过来的 error message; 当登录成功后，是否能进入登录成功后跳转的地址(www.portal.com:8080/uc/index)：
    进入 http://www.portal.com:8080/login页：
   
    可以看到，马上就会去向 passport 中请求 login ticket，也就是调用上面定义的函数  flushLoginTicket() :

    OK,  随便输入用户名密码，提交登录，测试时，我先把删除 iframe 代码注释：
   

可以看到，该 iframe 中输入出一段 js ，用于 callback  portal/login 页中的 feedBackUrlCallBack 函数，并且将错误信息页给该函数，从而实现登录结果的传递。最终效果如下：

另外，上面说到 login ticket 只能使用一次，所以当登录失败后，会马上再次获取 login ticket.

接下来，再测试一下登录OK的情况：


可以看到，后面的 callback 实际上调用不调用已经没什么关系了，因为在之前已经进行了跳转。


相关


  • 大小: 27.1 KB
  • 大小: 17 KB
  • 大小: 84.5 KB
  • 大小: 29 KB
  • 大小: 48.6 KB
  • 大小: 57.5 KB
分享到：
| Python实用技巧-成为Pythoner必经之路
评论
25 楼 honglei0412 2015-02-27  
viewRedirectToRequestor.jsp 里面的内容是什么 ？您上面写得那些配置信息，是跑不起来的，不知道您有没有测试过
24 楼 honglei0412 2015-02-27  
AjaxLoginServiceTicketAction  死活不执行么 ，能给个案例不
23 楼 hapic89 2014-12-16  
这个ajaxLoginServiceTicketAction类没有执行呢，我直接在cas服务端执行cas/login这个请求，也没停在ajaxLoginServiceTicketAction中的断点处，请问楼主，这是什么原因，webflow中的配置看了一遍，没找到什么原因呢，甚是捉急
22 楼 denger 2014-05-29  
felon527 写道
楼主在吗，ajaxaction没执行。

看看 Flow 配置是否正确！
21 楼 felon527 2014-05-26  
楼主在吗，ajaxaction没执行。
20 楼 kangaroo_xin 2012-12-21  
2.0 需要两个关键参数：loginTicket 和 flowExecutionKey

var _loginTicket = '${loginTicket }';
var _flowExecutionKey = '${flowExecutionKey }'


在最后一步，用户名密码正确的情况下，iframe内部执行window.location.replace 跳转，可以正常跳转。

但是如果失败的情况，执行

// 回调
parent.feedBackUrlCallBack({'login':"fails", 'msg': "用户名或密码错误！"})

由于跨域，就会报错了，请问这个如何解决呢，想用jsonp来解决的，后来发现不能post提交。

19 楼 javaeyelogin 2012-12-05  
iframe没有跨域，浏览器没有提示受限？
18 楼 ghdqlz 2012-09-18  


    var _services = 'service=' + encodeURIComponent('http://www.portal.com:8080/uc/'); 
    $.getScript('http://www.passport.com:8080/cas/login?'+_services+'&get-lt=true&n='  


    // Response Example: 
    // var _loginTicket = 'e1s1'; 


在使用cas-server-3.5.0时，$.getScript('http://www.passport.com:8080/cas/login...这个调用，会有死循环。
是这一部分程序本身就有问题，还是由于CAS版本升级导致的？
这一步是关键步骤啊，过不了，后面的都没法走。。。
17 楼 soflytanny 2012-07-24  
soflytanny 写道
兄台，反复看了你的示例，感觉只看到你获取IT的过程，却没看明白登陆的流程，
我自己按你提供的思路写个获取IT的方法，登陆时用了form提交，结果遇到跨域访问不了cooke，cas始终返回统一认证首页的问题。
如方便，可否请兄弟共享一个这个示例的源码,小弟感激不尽，并愿意将后面自己的心得贴出来。  伊妹儿：soflytanny@gmail.com  ,再次感激!


上面说错了，是只看到登陆的过程，没看到获取IT的过程，
你的 AjaxLoginServiceTicketAction 并没有判断get-it参数，也没有返回loginTicket,这句代码： final String serviceTicket = WebUtils.getServiceTicketFromRequestScope(context);    返回的是登陆成功后的serviceTicket并不是登陆用的it，  小弟愚钝，望赐教！
16 楼 soflytanny 2012-07-24  
兄台，反复看了你的示例，感觉只看到你获取IT的过程，却没看明白登陆的流程，
我自己按你提供的思路写个获取IT的方法，登陆时用了form提交，结果遇到跨域访问不了cooke，cas始终返回统一认证首页的问题。
如方便，可否请兄弟共享一个这个示例的源码,小弟感激不尽，并愿意将后面自己的心得贴出来。  伊妹儿：soflytanny@gmail.com  ,再次感激!
15 楼 axiang_2898 2012-04-21  
// 登录验证函数, 由 onsubmit 事件触发 
var loginValidate = function(){ 
    var msg; 
    if ($.trim($('#J_Username').val()).length == 0 ){ 
        msg = "用户名不能为空。"; 
    } else if ($.trim($('#J_Password').val()).length == 0 ){ 
        msg = "密码不能为空。"; 
    } 
    if (msg && msg.length > 0) { 
        $('#J_ErrorMsg').fadeOut().text(msg).fadeIn(); 
        return false; 
        // Can't request the login ticket. 
    } else if ($('#J_LoginTicket').val().length == 0){ 
        $('#J_ErrorMsg').text('服务器正忙，请稍后再试..'); 
        return false; 
    } else {
        // 验证成功后，动态创建用于提交登录的 iframe 
        $('body').append($('<iframe/>').attr({ 
            style: "display:none;width:0;height:0",  
            id: "ssoLoginFrame", 
            name: "ssoLoginFrame", 
            src: "javascript:false;" 
        })); 
        return true; 
    } 
} 
 
// 登录处理回调函数，将由 iframe 中的页同自动回调 
var feedBackUrlCallBack = function (result) {
alert(result);
    customLoginCallBack(result); 
    deleteIFrame('#ssoLoginFrame');// 删除用完的iframe,但是一定不要在回调前删除，Firefox可能有问题的 
}; 
 
// 自定义登录回调逻辑 
var customLoginCallBack = function(result){
    // 登录失败，显示错误信息 
    if (result.login == 'fails'){ 
        $('#J_ErrorMsg').fadeOut().text(result.msg).fadeIn(); 
        // 重新刷新 login ticket 
        flushLoginTicket(); 
    } 
    // do more.... 
} 
 
var deleteIFrame = function (iframeName) { 
    var iframe = $(iframeName);  
    if (iframe) { // 删除用完的iframe，避免页面刷新或前进、后退时，重复执行该iframe的请求 
        iframe.remove() 
    } 
}; 

// 由于一个 login ticket 只允许使用一次, 当每次登录需要调用该函数刷新 lt 
var flushLoginTicket = function(){
//var _loginTicket = 'e1s1'; 
    var _services = 'service=' + encodeURIComponent('www.google.com');
    var url='http://localhost:8080/cas/login?'+_services+'&get-lt=true&n='  
            + new Date().getTime();
    //alert(url);
    $.getScript(url,
    function(data){
    var _loginTicket=(data.split("<input type=\"hidden\" name=\"lt\" value=")[1]).substr(1,10).split("\" />")[0];
        // 将返回的 _loginTicket 变量设置到  input name="lt" 的value中。 
        $('#J_LoginTicket').val(_loginTicket);       
    });
    // Response Example: 
    // var _loginTicket = 'e1s1'; 
}

上面的写法应该没有错。好像feedBackUrlCallBack 方法没有执行啊？哪里没有配置对？？
14 楼 denger 2012-04-20  
axiang_2898 写道
我使用：http://localhost:8080/portal/login.jsp来测试可以吗？你的js里面的方法:

flushLoginTicket

里面的$('#J_LoginTicket').val(_loginTicket);

其中_loginTicket的变量没有？是不是你写错了！

麻烦你先去了解一下 jsonp吧。
13 楼 axiang_2898 2012-04-20  
我使用：http://localhost:8080/portal/login.jsp来测试可以吗？你的js里面的方法:

flushLoginTicket

里面的$('#J_LoginTicket').val(_loginTicket);

其中_loginTicket的变量没有？是不是你写错了！
12 楼 denger 2012-03-14  
有问题可以 email 我: denger.it # gmail.com
11 楼 wotodoo 2012-03-09  
获取login ticket,登录都没有问题
但是发现在cas登录不论成功或失败后，callback调用不到login页面的feedBackUrlCallBack函数，firebug下报Permission denied to access property feedBackUrlCallBack错误
10 楼 liuzhen7655 2011-10-19  
实际运行了吗？
9 楼 mominet 2011-09-15  
denger 写道
kinsou 写道
login ticket  如何获取。会跳到登陆页面的！

如何获取 lt，请参考：http://denger.iteye.com/blog/809170


我也同样的情况，搞了三天了还没解决。
8 楼 denger 2011-08-17  
kinsou 写道
login ticket  如何获取。会跳到登陆页面的！

如何获取 lt，请参考：http://denger.iteye.com/blog/809170
7 楼 kinsou 2011-08-17  
login ticket  如何获取。会跳到登陆页面的！
6 楼 denger 2011-08-04  
vagrant1984 写道
denger 写道
vagrant1984 写道
cas和spring security2怎么结合比较好呢？一直找不到更好的办法。

Is simple, click this link: https://wiki.jasig.org/display/CASC/Using+the+CAS+Client+3.1+with+Spring+Security


看到了，这个是基于spring security 3的，我们是使用的spring security 2，呵呵。

我们已经集成成功了，但是怎样才能用到你这边提到的ajax登录呢？


按照这个文章一步步做就行了，很多人按照上面步骤都已经实现了。有什么问题可以与我交流.
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    decision(修正ajax error)

    在集成过程中，可能出现的Ajax错误可能涉及到跨域请求（CORS）问题，或者是服务器返回的JSON数据格式不正确，导致前端无法解析。修正这些错误可能需要调整服务器端的响应头设置，或者检查前端的Ajax请求代码，确保...

    详解iframe跨域的几种常用方法(小结)

    解决iframe跨域的方法之一是通过设置document.domain的值。document.domain属性获取或设置当前文档的原始域部分。通过设置相同的域值，可以绕过同源策略的限制。例如，将document.domain设置为一级域名“***”，a...

    axios 处理 302 状态码的解决方法

    这段代码会在每个请求中添加一个`X-Requested-With`头，标识这是一个Ajax请求，并设置一个响应拦截器，当收到401状态码时，将页面重定向至登录页。 在后端，例如使用Flask框架，我们可以编写中间件或装饰器来检查...

    Php多域名登陆

    4. **跨域资源共享(CORS)**: 如果需要通过Ajax进行跨域登录操作，需要启用CORS，允许相关域名间的API请求。 5. **单点登录(Single Sign-On, SSO)**: 若系统复杂，可考虑采用SSO技术，如CAS（Central Authentication...

    sso单点登录

    在SSO场景下，AjaxAnyWhere可能被用来无刷新地处理登录状态，比如在用户登录后自动更新页面内容，或者在用户访问受保护资源时，通过Ajax请求验证用户身份。 6. **SSODemo**：这个文件可能是一个示例项目，展示了...

    CAS:plugin.dj的自定义头像脚本

    9. **跨域资源共享（CORS）**：如果CAS服务器与前端应用不在同一个域下，需要配置CORS策略以允许JavaScript进行跨域请求。 10. **错误处理**：良好的错误处理机制能提供友好的用户体验，JavaScript会捕获并处理可能...

    自己写的测试小页面客户端

    4. 客户端与服务器端通信：了解AJAX、Fetch API等异步请求技术，处理跨域问题。 5. 测试策略和自动化测试：编写测试用例，利用Mocha、Jest等工具进行单元测试和集成测试。 6. Web安全：理解CSRF（跨站请求伪造）、...

    java品优购项目实战视频教程

    13.使用CAS实现单点登录 14.使用CORS实现跨域 15.使用twitter的snowflake算法实现分布式ID生成器 16.实现微信扫码支付 17.完成电商秒杀解决方案 18.使用SpringTask实现任务调度 19.使用MavenProfilel实现开发与生产...

    java技术点

    15. **跨域Ajax**：CORS，jsonp技术。 16. **数据库连接池**：如C3P0，Druid。 17. **ORM实体填充**：自动将数据库结果转换为Java对象。 18. **分页查询**：根据数据库方言生成SQL。 19. **钓鱼网站检测**：URL验证...

    jeesite后台框架

    授权模块，支持CAS单点登录，简单properties配置即可，不用再写很多的xml。 支持多数据源，简单properties配置即可实现，为了安全性吧，暂不提供界面维护数据源，不存数据库。 数据表主键优化，如分类科目表，采用有...

    sso：java单点登录

    Java SSO（Single Sign-On）单点登录是一种身份验证机制，允许用户在多个应用系统间进行无缝登录，只需要一次认证即可访问所有系统。这个技术在企业级应用中非常常见，提高了用户体验并增强了安全性。在Java环境中...

    仓鼠

    1. **前端交互**：JavaScript通常用于构建用户界面，处理登录表单，以及与服务器进行异步通信（AJAX）。它可以监听登录事件，当用户成功验证后，发送会话令牌到其他需要认证的应用。 2. **OAuth2或OpenID Connect**...

Magicbox
Global site tag (gtag.js) - Google Analytics