在Liferay框架中，当进行第三方单点登录（SSO）过来时,添加一个加载动画，以改善用户体验

在Liferay框架中，当实现第三方单点登录（SSO）并等待用户从外部系统授权完成时，为了提升用户体验，可以添加一个加载动画。通常的做法是在用户点击登录按钮后，显示一个CSS样式控制的动态图标或者轮播图，表示系统正在处理登录请求。这可以通过JavaScript在后台异步操作时更新页面状态来完成：

1. 首先，在前端HTML结构中，创建一个`<div>`元素用于展示加载动画，例如：

<div id="sso-loading" class="loader-container">
  <img src="/static/images/loader.gif" alt="Loading...">
</div>

2. 使用CSS定义`.loader-container`的样式，使其在页面上可见并且位置合适。

3. JavaScript方面，可以在用户的登录请求发送后，立即隐藏原始的登录表单，并显示加载动画：

document.getElementById('login-form').style.display = 'none';
document.getElementById('sso-loading').style.display = 'block';

4. 当登录验证成功或失败时，再相应地隐藏加载动画并处理后续流程，如显示错误消息或跳转到目标页面。

5. 对于异步操作，你可以监听服务器返回的状态码或者事件，比如Liferay API提供的回调函数。