通过设置header来实现的跨域访问。
app1为数据提供者
app2为数据调用者
app1中添加Api控制器和Api拦截器(Api 随便起的名字,控制器名和拦截器名称要相同,并且要放在同一个包下,拦截自动生效)
目录结构:
控制器:
class ApiController {
def index() { }
def aa(){
println "request.remoteAddr:==="+request.remoteAddr
println "request.remoteHost:==="+request.remoteHost
println "request.remoteUser:==="+request.remoteUser
println "request.remotePort:==="+request.remotePort
println "params:"+params
def res = [flag:true,status:200,params:params]
respond res
}
}
拦截器:
class ApiInterceptor {
boolean before() {
println "before::::=================="+params
header( "Access-Control-Allow-Origin","*")// 这里的*注意一下允许所有人调用"http://local.test" )
header( "Access-Control-Allow-Credentials", "true" )
header( "Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE" )
header( "Access-Control-Max-Age", "3600" )
return true//这里返回true 随后会进入控制器中调用方法,返回false 不进入控制器,直接返回
}
boolean after() { true }
void afterView() {
// no-op
}
}
app2中建一个gsp页面调用:
<!DOCTYPE html>
<html>
<head>
<asset:javascript src="jquery-2.2.0.min.js"/>
<script>
$(function(){
$("#btn1").click(function(){
$('#test').load('http://app1.tch.com:8080/Api/aa.json?name='+$("#name").val());
});
});
</script>
</head>
<body>
<h3 id="test">请点击下面的按钮,通过 jQuery AJAX 改变这段文本。</h3>
name:<input id="name" value="sss"/>
<button id="btn1" type="button">get获得外部的内容</button>
<hr/>
</body>
</html>
页面调用结果:
不建议在页面调用,这种方式相当于将数据暴露给全世界。最好加上认证。