Jsonp

用户5927264

发布于 2019-08-01 10:12:57

7690

发布于 2019-08-01 10:12:57

文章被收录于专栏：OSChinaOSChina

1、当用户登录成功后，在cookie中有token信息。

2、从cookie中取token根据token查询用户信息。

3、把用户名展示到首页。

方案一：在Controller中取cookie中的token数据，调用sso服务查询用户信息。

方案二：当页面加载完成后使用js取token的数据，使用ajax请求查询用户信息。

问题：服务接口在sso系统中。Sso.e3.com(localhost:8088)，在首页显示用户名称，首页的域名是www.e3.com(localhost:8082)，使用ajax请求跨域了。

Js不可以跨域请求数据。

什么是跨域：

1、域名不同

2、域名相同端口不同。

解决js的跨域问题可以使用jsonp。

Jsonp不是新技术，跨域的解决方案。使用js的特性绕过跨域请求。Js可以跨域加载js文件。

js代码

$.ajax({
			url : "http://localhost:8088/user/token/" + _ticket,
			dataType : "jsonp",
			type : "GET",
			success : function(data){
				if(data.status == 200){
					var username = data.data.username;
					var html = username;
					$("#loginbar").html(html);
				}
			}
		});

后台代码

package com.shi.sso.controller;

import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.MediaType;
import org.springframework.http.converter.json.MappingJacksonValue;
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.ResponseBody;

import com.shi.sso.service.TokenService;
import com.shi.util.AJAXResult;
import com.shi.util.JsonUtils;

/**
 * 
 * @author: SHF
 * @date: 2018年3月29日 下午8:09:24
 * @Description:
 */
@Controller
public class TokenController {

	@Autowired
	private TokenService tokenService;
	
	/**
	 * 把结果封装成一个jsonp数据
	 * @param token
	 * @param callback jsonp函数名
	 * @return
	 * @throws Exception
	 * "application/json;charset=utf-8"
	 */
	
	
	/* ---------方法一----------  */
	/*@RequestMapping(value="/user/token/{token}",produces=MediaType.APPLICATION_JSON_UTF8_VALUE)
	@ResponseBody
	private String getUserByToken(@PathVariable String token,String callback) throws Exception{
		AJAXResult result= tokenService.getUserByToken(token);
		//在相应之前，判断是否为jsonp请求
		if(StringUtils.isNotBlank(callback)){
			//把结果封装成一个js语句响应
			return callback+"("+JsonUtils.objectToJson(result)+");";
		}
		return JsonUtils.objectToJson(result);
	}*/
	
	/* ---------方法二----------  */
	@RequestMapping(value="/user/token/{token}")
	@ResponseBody
	private Object getUserByToken(@PathVariable String token,String callback) throws Exception{
		AJAXResult result= tokenService.getUserByToken(token);
		//在相应之前，判断是否为jsonp请求
		if(StringUtils.isNotBlank(callback)){
			//把结果封装成一个js语句响应
			MappingJacksonValue mappingJacksonValue=new MappingJacksonValue(result);
			mappingJacksonValue.setJsonpFunction(callback);
			return mappingJacksonValue;
		}
		return result;
	}
	
}

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

如有侵权请联系 cloudcommunity@tencent.com 删除

网络安全