一、实现用户模块跳转

1、需求说明

说明:当用户点击登录/注册按钮时需要跳转到指定的页面中.

url地址1.:http://www.jt.com/user/register.html
url地址2: http://www.jt.com/user/login.html

2、编辑UserController

package com.jt.controller;import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;@Controller     //需要进行页面跳转
@RequestMapping("/user")
public class UserController {/*** 实现用户模块页面跳转* url1: http://www.jt.com/user/login.html     页面:login.jsp* url2: http://www.jt.com/user/register.html  页面:register.jsp* 要求:实现通用页面跳转* restFul方式: 1.动态获取url中的参数,之后实现通用的跳转.*/@RequestMapping("/{moduleName}")public String module(@PathVariable String moduleName){return moduleName;}
}

3、页面效果展现

4、JT-SSO项目创建

4.1、创建项目

4.2、添加继承/依赖/插件

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><artifactId>jt-sso</artifactId><!--默认的打包方式就是jar  不写也没有关系--><packaging>jar</packaging><parent><artifactId>jt</artifactId><groupId>com.jt</groupId><version>1.0-SNAPSHOT</version></parent><!--2.添加依赖信息--><dependencies><!--依赖实质依赖的是jar包文件--><dependency><groupId>com.jt</groupId><artifactId>jt-common</artifactId><version>1.0-SNAPSHOT</version></dependency></dependencies><!--3.添加插件--><build><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId></plugin></plugins></build>
</project>

4.3、编辑User的POJO对象

@TableName("tb_user")
@Data
@Accessors(chain = true)
public class User extends BasePojo{@TableId(type = IdType.AUTO)//设定主键自增private Long id;            //用户ID号private String username;    //用户名private String password;    //密码 需要md5加密private String phone;       //电话号码private String email;       //暂时使用电话代替邮箱
}

5、测试JT-SSO项目

用户通过sso.jt.com/findUserAll 获取user表中的信息 json返回
代码结构如下:

5.1、编辑UserController

package com.jt.controller;import com.jt.pojo.User;
import com.jt.service.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;import java.util.List;@RestController
public class UserController {@Autowiredprivate UserService userService;/*** 完成测试按钮* 1.url地址 :findUserAll* 2.参数信息: null* 3.返回值结果: List<User>**/@RequestMapping("/findUserAll")public List<User> findUserAll(){return userService.findUserAll();}
}

5.2、编辑UserService

package com.jt.service;import com.jt.mapper.UserMapper;
import com.jt.pojo.User;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;import java.util.List;@Service
public class UserServiceImpl implements UserService{@Autowiredprivate UserMapper userMapper;@Overridepublic List<User> findUserAll() {return userMapper.selectList(null);}
}

5.3、修改nginx配置

二、跨域实现

1、跨域访问测试

1.1、同域测试

分析:
1.浏览器地址: http://manage.jt.com/test.html
2.ajax请求地址: http://manage.jt.com/test.json
结论:
当浏览器地址与ajax请求的地址(协议://域名:端口)相同时可以实现正常的业务调用.

<script type="text/javascript" src="http://manage.jt.com/js/jquery-easyui-1.4.1/jquery.min.js"></script><!--引入类库之后,执行js代码-->
<script type="text/javascript"><!--让整个页面加载完成之后执行js-->$(function(){$.get("http://manage.jt.com/test.json",function(data){alert(data.name);})})
</script>

1.2、跨域测试

分析:
1.浏览器地址: http://www.jt.com/test.html
2.ajax请求地址: http://manage.jt.com/test.json
结论:
如果请求地址(协议://域名:端口)不相同则导致请求调用失败

2、浏览器-同源策略说明

说明: 浏览器规定发起ajax时如果请求协议/域名/端口号如果3者有一个与当前的浏览器的地址不相同时,则违反了同源策略的规定.则浏览器不予解析返回值.

跨域问题: 违反同源策略的规定就是跨域请求.

三、跨域方式

1、跨域1-JSONP

1.1、JSONP跨域原理

1、利用javascrpit中的src属性实现跨域请求.
2、自定义回调函数 function callback(xxxx);
3、将返回值结果进行特殊的格式封装 callback(json);
4、由于利用src属性进行调用所以只能支持get请求类型.

封装返回值:

hello({"id":"1","name":"tom"})

页面js编辑

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>测试JSON跨域问题</title>   <script type="text/javascript">/*JS是解释执行的语言  *//*定义回调函数  */function hello(data){alert(data.name);}</script><!--该json一直保存到浏览器中等待调用,但是没有函数名称无法调用  --><script type="text/javascript" src="http://manage.jt.com/test.json"></script><script type="text/javascript" src="http://manage.jt.com/js/jquery-easyui-1.4.1/jquery.min.js"></script>
</head>
<body><h1>JS跨域问题</h1>
</body>
</html>

1.2、JSONP

JSONP(JSON with Padding)是JSON的一种“使用模式”，可用于解决主流浏览器的跨域数据访问的问题。由于同源策略，一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通，而是HTML 的。

1.3、JSONP优化

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JSONP测试</title>
<script type="text/javascript" src="http://manage.jt.com/js/jquery-easyui-1.4.1/jquery.min.js"></script>
<script type="text/javascript">$(function(){alert("测试访问开始!!!!!")$.ajax({url:"http://manage.jt.com/web/testJSONP",type:"get",             //jsonp只能支持get请求dataType:"jsonp",       //dataType表示返回值类型jsonp: "callback",    //指定参数名称jsonpCallback: "hello",  //指定回调函数名称success:function (data){   //data经过jQuery封装返回就是json串console.log(data);}});  })
</script>
</head>
<body><h1>JSON跨域请求测试</h1>
</body>
</html>

1.4、编辑后端Controller

package com.jt.web.controller;import com.jt.pojo.ItemDesc;
import com.jt.util.ObjectMapperUtil;
import jdk.nashorn.internal.runtime.regexp.JoniRegExp;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;@RestController
public class JSONPController {/*** 实现JSONP跨域请求* url地址: http://manage.jt.com/web/testJSONP?callback=xxxxxx* 参数:    暂时没有可以不接* 返回值:  callback(JSON);*/@RequestMapping("/web/testJSONP")public String testJSONP(String callback){ItemDesc itemDesc = new ItemDesc();itemDesc.setItemId(1000L).setItemDesc("JSONP测试!!!");String json = ObjectMapperUtil.toJSON(itemDesc);return callback+"("+json+")";}
}

1.5、控制台输出

1.6、JSONPObject说明

    @RequestMapping("/web/testJSONP")public JSONPObject testJSONP(String callback){ItemDesc itemDesc = new ItemDesc();itemDesc.setItemId(1000L).setItemDesc("JSONP测试!!!");return new JSONPObject(callback, itemDesc);}

2、cors跨域方式

2.1、cors调用原理

2.2、实现cors调用

package com.jt.config;import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration  //标识我是一个配置类
public class CorsConfig implements WebMvcConfigurer {//在后端 配置cors允许访问的策略@Overridepublic void addCorsMappings(CorsRegistry registry) {registry.addMapping("/**").allowedMethods("GET","POST") //定义允许跨域的请求类型.allowedOrigins("*")           //任意网址都可以访问.allowCredentials(true) //是否允许携带cookie.maxAge(1800);                 //设定请求长链接超时时间.}
}

2.3、cors调用响应头解析

2.4、cors跨域测试

JSON数据格式

2.5、关于跨域的总结

1.jsonp
jsonp本质利用javaScript中的src属性的get请求实现的跨域.
返回值必须经过特殊的格式封装.
2.cors
添加在响应头中信息.指定哪些服务器允许访问.

四、实现用户数据校验

1、业务需求

当用户在注册时,如果输入用户名,则应该向jt-sso单点登录系统发起请求,校验用户数据是否存在.
如果存在则提示用户.

2、业务接口文档说明

3、前端JS分析

1.url分析

2.检索JS代码

3. JS分析

            $.ajax({url : "http://sso.jt.com/user/check/"+escape(pin)+"/1?r=" + Math.random(),dataType : "jsonp",success : function(data) {checkpin = data.data?"1":"0";if(data.status == 200){if (!data.data) {validateSettings.succeed.run(option);namestate = true;}else {validateSettings.error.run(option, "该用户名已占用！");namestate = false;}}else{validateSettings.error.run(option, "服务器正忙,请稍后!");namestate = false;}}});

4、编辑JT-SSO UserController

    /*** 业务说明: jt-web服务器获取jt-sso数据 JSONP跨域请求* url地址: http://sso.jt.com/user/check/{param}/{type}* 参数:    param: 需要校验的数据   type:校验的类型* 返回值:  SysResult对象* 真实的返回值: callback(SysResult的JSON)*/@RequestMapping("/check/{param}/{type}")public JSONPObject checkUser(@PathVariable String param,@PathVariable Integer type,String callback){//true 表示数据存在     false 表示数据可以使用boolean flag = userService.checkUser(param,type);SysResult.success(flag);return new JSONPObject(callback, SysResult.success(flag));}

5、编辑JT-SSO UserService

    /*** 判断依据:  根据用户名查询 如果结果>0 用户已存在.* @param param* @param type* @return*/@Overridepublic boolean checkUser(String param, Integer type) {//1.需要将type类型转化为 具体字段信息  1=username  2=phone  3=emailString column = columnMap.get(type);QueryWrapper<User> queryWrapper = new QueryWrapper<>();queryWrapper.eq(column, param);Integer count = userMapper.selectCount(queryWrapper);return  count > 0 ? true :false;}

6、页面效果展现

用户模块跳转、sso单点登录、跨域访问相关推荐

SSO单点登录跨域跨服务器
单点登录系统总结关于登录一.登录 1.当用户点击登录的时候,把当前页面的url用参数传递到登录页面 2.用户成功登录,生成token,保存到redis中(service层),key为token,v ...
java单点登录跨域_深入浅出让你理解跨域与SSO单点登录原理与技术
原标题:深入浅出让你理解跨域与SSO单点登录原理与技术一:SSO体系结构 SSO SSO英文全称Single Sign On,单点登录.SSO是在多个应用系统中,用户只需要登录一次就可以访问所有相互 ...
一篇了解SSO单点登录
SSO基础文章目录 SSO基础 1.什么是单点登录? 2.回顾普通系统登录 3.多系统登录的问题与解决? 3.1.Session不共享问题 XXL-SSO框架基础入门 1.什么是XXL-SSO 2. ...
cas跨域单点登录原理_CAS实现SSO单点登录原理
1. CAS 简介 1.1. What is CAS ? CAS ( Central Authentication Service ) 是 Yale 大学发起的一个企业级的.开源的项目,旨 ...
SSO单点登录、跨域重定向、跨域设置Cookie、京东单点登录实例分析
最近在研究SSO单点登录技术,其中有一种就是通过js的跨域设置cookie来达到单点登录目的的,下面就已京东商城为例来解释下跨域设置cookie的过程涉及的关键知识点: 1.jQuery ajax跨 ...
php跨域单点登录,SSO单点登录、跨域重定向、跨域设置Cookie、京东单点登录实例分析...
SSO单点登录技术,其中有一种就是通过js的跨域设置cookie来达到单点登录目的的,下面就已京东商城为例来解释下跨域设置cookie的过程涉及的关键知识点: 1. 跨域redirect实例: te ...
SSO单点登录之跨域问题
第一次写博客,与大家共勉. 这里用到的原理其实非常简单,将cookie存在一个公共的站点的页面上就可以了,这里我们管那个站点叫主站S. 先说说所谓的跨域环境1:a.xxx.com需要跟b.xxx.c ...
usmssosetup 单点登录被禁用_如何解决SSO单点登录跳转异常问题
应用出现访问异常,很大可能是由于网络设备出现故障或者设备关联验证过程中出现了问题造成的.但是在部分情况下,对系统程序的设置也会成为造成异常现象的原因所在.正如本案例所介绍的单点跳转异常情况. 3.1 ...
thinkphp限制单点用户登录_php的sso单点登录实现方法
本文实例讲述了php的sso单点登录实现方法.分享给大家供大家参考.具体分析如下: 这里详细讲到了几点: 1.点击登录跳转到SSO登录页面并带上当前应用的callback地址 2.登录成功后生成COO ...

用户模块跳转、sso单点登录、跨域访问