sso接口的调用
之前一直想sso接口已经写好了，登录注册功能是怎么调用的呢？原来在登录注册的jsp页面实现的接口的调用，页面的校验和验证功能在jsp页面即可实现。
注册页面：
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page trimDirectiveWhitespaces="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache,must-revalidate">
<title>注册-个人用户</title>
<link type="text/css" rel="stylesheet" href="/css/regist.personal.css"/>
<link type="text/css" rel="stylesheet" href="/css/passport.base.css"/>
<script type="text/javascript" src="/js/jquery-1.6.4.js"></script>
</head>
<body>
<div class="w" id="logo">
<div>
<a href="http://localhost:8082">
<img src="/images/taotao-logo.gif" alt="淘淘商城" width="170" height="60"/>
</a> <b></b>
</div>
</div> <div class="w" id="regist">
<div class="mt">
<ul class="tab">
<li class="curr">个人用户</li>
</ul>
<div class="extra">
<span>我已经注册，现在就
<a href="/page/login" class="flk13">登录</a>
</span>
</div>
</div>
<div class="mc">
<form id="personRegForm" method="post" onsubmit="return false;">
<div class="form" onselectstart="return false;">
<div class="item" id="select-regName">
<span class="label"><b class="ftx04">*</b>用户名：</span> <div class="fl item-ifo">
<div class="o-intelligent-regName">
<input type="text" id="regName" name="username" class="text" tabindex="1" autoComplete="off"
onpaste="return false;"
value=""
onfocus="if(this.value=='') this.value='';this.style.color='#333'"
onblur="if(this.value=='') {this.value='';this.style.color='#999999'}"/>
<i class="i-name"></i>
<ul id="intelligent-regName" class="hide"></ul>
<label id="regName_succeed" class="blank"></label>
<label id="regName_error" class="hide"></label>
</div>
</div>
</div>
<div id="o-password">
<div class="item">
<span class="label"><b class="ftx04">*</b>请设置密码：</span> <div class="fl item-ifo">
<input type="password" id="pwd" name="password" class="text" tabindex="2"
style="ime-mode:disabled;"
onpaste="return false" autocomplete="off"/>
<i class="i-pass"></i>
<label id="pwd_succeed" class="blank"></label>
<label id="pwd_error"></label>
<span class="clr"></span>
</div>
</div> <div class="item">
<span class="label"><b class="ftx04">*</b>请确认密码：</span> <div class="fl item-ifo">
<input type="password" id="pwdRepeat" name="pwdRepeat" class="text" tabindex="3"
onpaste="return false" autocomplete="off"/>
<i class="i-pass"></i>
<label id="pwdRepeat_succeed" class="blank"></label>
<label id="pwdRepeat_error"></label>
</div>
</div>
<div class="item" id="dphone">
<span class="label"><b class="ftx04">*</b>验证手机：</span> <div class="fl item-ifo">
<input type="text" id="phone" maxlength="11" name="phone"
class="text" tabindex="4"
autocomplete="off" /> <i class="i-phone"></i> <label
id="phone_succeed" class="blank"></label> <label
id="phone_error"></label>
</div>
</div>
</div>
<div class="item item-new">
<span class="label"> </span> <div class="fl item-ifo">
<input type="checkbox" class="checkbox" checked="checked" id="readme"
onclick="agreeonProtocol();">
<label for="protocol">我已阅读并同意<a href="#" class="blue" id="protocol">《淘淘用户注册协议》</a></label>
<span class="clr"></span>
<label id="protocol_error" class="error hide">请接受服务条款</label>
</div>
</div>
<div class="item">
<span class="label"> </span>
<input type="button" class="btn-img btn-regist" id="registsubmit" value="立即注册" tabindex="8"
clstag="regist|keycount|personalreg|07"
onclick="REGISTER.reg();"/>
</div>
</div>
<div class="phone">
<img width="180" height="180" src="/images/phone-bg.jpg">
</div>
<span class="clr"></span>
</form>
</div>
<script type="text/javascript">
var REGISTER={
param:{
//单点登录系统的url
surl:""
},
inputcheck:function(){
//不能为空检查
if ($("#regName").val() == "") {
alert("用户名不能为空");
$("#regName").focus();
return false;
}
if ($("#pwd").val() == "") {
alert("密码不能为空");
$("#pwd").focus();
return false;
}
if ($("#phone").val() == "") {
alert("手机号不能为空");
$("#phone").focus();
return false;
}
//密码检查
if ($("#pwd").val() != $("#pwdRepeat").val()) {
alert("确认密码和密码不一致，请重新输入！");
$("#pwdRepeat").select();
$("#pwdRepeat").focus();
return false;
}
return true;
},
beforeSubmit:function() {
//检查用户是否已经被占用
$.ajax({
//这是校验的接口调用，通过接口中的url来实现的
url : REGISTER.param.surl + "/user/check/"+escape($("#regName").val())+"/1?r=" + Math.random(),
success : function(data) {
if (data.data) {
//检查手机号是否存在
$.ajax({
url : REGISTER.param.surl + "/user/check/"+$("#phone").val()+"/2?r=" + Math.random(),
success : function(data) {
if (data.data) {
REGISTER.doSubmit();
} else {
alert("此手机号已经被注册！");
$("#phone").select();
}
}
});
} else {
alert("此用户名已经被占用，请选择其他用户名");
$("#regName").select();
}
}
}); },
doSubmit:function() {
//这是注册的接口，通过注册接口的URL来实现的调用
$.post("/user/register",$("#personRegForm").serialize(), function(data){
if(data.status == 200){
alert('用户注册成功，请登录！');
REGISTER.login();
} else {
alert("注册失败！");
}
});
},
login:function() {
location.href = "/page/login";
return false;
},
reg:function() {
if (this.inputcheck()) {
this.beforeSubmit();
}
}
};
</script>
</body>
</html>
登录页面
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page trimDirectiveWhitespaces="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>登录淘淘</title>
<link type="text/css" rel="stylesheet" href="/css/login.css"/>
<script type="text/javascript" src="/js/jquery-1.6.4.js"></script>
</head>
<body>
<div class="w">
<div id="logo">
<a href="http://localhost:8082" clstag="passport|keycount|login|01">
<img src="/images/taotao-logo.gif" alt="淘淘" width="170" height="60"/>
</a><b></b>
</div>
</div>
<form id="formlogin" method="post" onsubmit="return false;">
<div class=" w1" id="entry">
<div class="mc " id="bgDiv">
<div id="entry-bg" clstag="passport|keycount|login|02" style="width: 511px; height: 455px; position: absolute; left: -44px; top: -44px; background: url(/images/544a11d3Na5a3d566.png) 0px 0px no-repeat;">
</div>
<div class="form ">
<div class="item fore1">
<span>用户名</span>
<div class="item-ifo">
<input type="text" id="loginname" name="username" class="text" tabindex="1" autocomplete="off"/>
<div class="i-name ico"></div>
<label id="loginname_succeed" class="blank invisible"></label>
<label id="loginname_error" class="hide"><b></b></label>
</div>
</div>
<script type="text/javascript">
setTimeout(function () {
if (!$("#loginname").val()) {
$("#loginname").get(0).focus();
}
}, 0);
</script>
<div id="capslock"><i></i><s></s>键盘大写锁定已打开，请注意大小写</div>
<div class="item fore2">
<span>密码</span>
<div class="item-ifo">
<input type="password" id="nloginpwd" name="password" class="text" tabindex="2" autocomplete="off"/>
<div class="i-pass ico"></div>
<label id="loginpwd_succeed" class="blank invisible"></label>
<label id="loginpwd_error" class="hide"></label>
</div>
</div>
<div class="item login-btn2013">
<input type="button" class="btn-img btn-entry" id="loginsubmit" value="登录" tabindex="8" clstag="passport|keycount|login|06"/>
</div>
</div>
</div>
<div class="free-regist">
<span><a href="/page/register" clstag="passport|keycount|login|08">免费注册>></a></span>
</div>
</div>
</form>
<script type="text/javascript">
var redirectUrl = "${redirect}";
var LOGIN = {
checkInput:function() {
if ($("#loginname").val() == "") {
alert("用户名不能为空");
$("#loginname").focus();
return false;
}
if ($("#nloginpwd").val() == "") {
alert("密码不能为空");
$("#nloginpwd").focus();
return false;
}
return true;
},
doLogin:function() {
//这里是一样的功能，调用登录的接口来实现的
$.post("/user/login", $("#formlogin").serialize(),function(data){
if (data.status == 200) {
alert("登录成功！");
if (redirectUrl == "") {
location.href = "http://localhost:8082";
} else {
location.href = redirectUrl;
}
} else {
alert("登录失败，原因是：" + data.msg);
$("#loginname").select();
}
});
},
login:function() {
if (this.checkInput()) {
this.doLogin();
}
} };
$(function(){
$("#loginsubmit").click(function(){
LOGIN.login();
});
});
</script>
</body>
</html>
sso接口的调用的更多相关文章
- 如何让Java和C++接口互相调用：JNI使用指南
如何让Java和C++接口互相调用:JNI使用指南 转自:http://cn.cocos2d-x.org/article/index?type=cocos2d-x&url=/doc/cocos ...
- 【转】java通用URL接口地址调用方式GET和POST方式
java通用URL接口地址调用方式GET和POST方式,包括建立请求和设置请求头部信息等等......... import java.io.ByteArrayOutputStream; import ...
- 如何记录selenium自动化测试过程中接口的调用信息
上一篇博客,我写了python自动化框架的一些知识和粗浅的看法,在上一篇中我也给自己提出一个需求:如果记录在测试过程中接口的调用情况?提出这个需求,我觉得是有意义的.你在测试过程中肯定会遇到一些莫名其 ...
- 在Winform混合式框架中整合外部API接口的调用
在我们常规的业务处理中,一般内部处理的接口多数都是以数据库相关的,基于混合式开发的Winform开发框架,虽然在客户端调用的时候,一般选择也是基于Web API的调用,不过后端我们可能不仅仅是针对我们 ...
- SAP接口的调用
最近做一个专案用到的SAO接口的调用,用到的上传参数获取回传的IRfcTable,以及以IRfcTable作为参数上传SAP,通过查阅很多资料,发现资料说明的也多是鱼龙混杂,许多没有实现就直接贴在上面 ...
- COM组件 IDispatch 及双接口的调用
转自:http://blog.csdn.net/cnhk1225/article/details/50555647 一.前言 前段时间,由于工作比较忙,没有能及时地写作.其间收到了很多网友的来信询问和 ...
- 【转载】COM 组件设计与应用（十一）—— IDispatch 及双接口的调用
原文:http://vckbase.com/index.php/wv/1236.html 一.前言 前段时间,由于工作比较忙,没有能及时地写作.其间收到了很多网友的来信询问和鼓励,在此一并表示感谢.咳 ...
- 微信接口出现“调用支付jsapi缺少参数appid”
微信接口出现“调用支付jsapi缺少参数appid” 注意:@Html.Raw(ViewBag.wxJsApiParam),//json串ViewBag.wxJsApiParam是一个在后台拼的一个j ...
- C与C++接口相互调用
转载于:http://blog.csdn.net/lincoln_2012/article/details/50801080 项目中经常使用C和C++混合编程,那么,在调用对方接口时,总是不可避免地出 ...
随机推荐
- WebService快速上手
一.WebService是什么? 核心特征:跨语言.跨平台.远程调用[如果是本地系统交互,使用rpc或者com技术就行] soap:HTTP + XML [基于Http的xml格式数据交互] wsdl ...
- 【SP1812】LCS2 - Longest Common Substring II
[SP1812]LCS2 - Longest Common Substring II 题面 洛谷 题解 你首先得会做这题. 然后就其实就很简单了, 你在每一个状态\(i\)打一个标记\(f[i]\)表 ...
- Vue.js动态组件
动态组件: 1.定义: 几个组件放在同一个挂载点下,然后根据父组件的某个变量来决定显示哪个,或者都不显示. 2.动态切换原理: 在挂载点使用<component>标签,然后使用v-bind ...
- C#调用python文件执行
我的电脑环境是使用.net framework4.5.1,如果在调试过程中调不通请注意 我用的是Visual studion 2017,python组件下载地址:http://ironpython.c ...
- Kosaraju算法、Tarjan算法分析及证明--强连通分量的线性算法
一.背景介绍 强连通分量是有向图中的一个子图,在该子图中,所有的节点都可以沿着某条路径访问其他节点.强连通性是一种非常重要的等价抽象,因为它满足 自反性:顶点V和它本身是强连通的 对称性:如果顶点V和 ...
- package.json 中 npm 依赖包版本前的符号的意义
版本的格式 major.minor.patch:主版本号.次版本号.修补版本号 patch:修复bug,兼容老版本 minor:新增功能,兼容老版本 major:新增功能,不兼容老版本 version ...
- muduo网络库学习笔记(四) 通过eventfd实现的事件通知机制
目录 muduo网络库学习笔记(四) 通过eventfd实现的事件通知机制 eventfd的使用 eventfd系统函数 使用示例 EventLoop对eventfd的封装 工作时序 runInLoo ...
- VC++代码上传到VSS上 注意事项
1.删除Debug文件,删除Release 文件2.删掉ncb,opt,clw,aps文件注.opt 工程关于开发环境的参数文件.ncb 无编译浏览文件(no compile browser).当自动 ...
- TeamWork#3,Week5,Release Notes of the Alpha Version
在这里的是一款你时下最不可或缺的一款美妙的产品. “今天哪家外卖便宜?” “今天这家店在哪个网站打折?” “这家店到底哪个菜好吃?” 这些问题你在寝室/办公室每天要问几次?还在为了找一家便宜的外卖店而 ...
- [福大软工] Z班 个人项目自动测试结果
个人项目第二次测试结果[9.16] 注:下表中的成绩满分为25分,正确性测试 共5个,每个3分.效率测试共 2个,每个5分. 根据数据统计分档如下, // 前为档级,后为分数. 参数为50000 0- ...