ajax跨域请求

最新推荐文章于 2022-11-13 21:08:49 发布

Be Patient K

最新推荐文章于 2022-11-13 21:08:49 发布

阅读量467

点赞数

分类专栏： Javascript

本文链接：https://blog.csdn.net/zz210891470/article/details/73658133

版权

Javascript 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

比较通用的有如下两种方式，一种是从服务器端下手，另一种则是从客户端的角度出发。二者各有利弊，具体要使用哪种方式还需要具体的分析。

服务器设置响应头
服务器代理
客户端采用脚本回调机制。

方式一 Access-Control-Allow-Origin

Access-Control-Allow-Origin 关键字只有在服务器端进行设置才
会生效。

如果知道客户端的域名或者请求的固定路径，则最好是不使用通配符的方式，来进一步保证安全性。如果不确定，那就是用*通配符好了。

Response.AddHeader("Access-Control-Allow-Origin", "*");

方式二 jsonp方式

JSONP（JSON with Padding） HTML页面中script标签内容跨域跨域加载，对于script的src属性对应的内容，浏览器总是会对其进行加载

在服务器端组装出客户端预置好的json数据，通过回调的方式传回给客户端。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ajax 测试</title>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.0.js" type="text/javascript"></script>
</head>
<body>
<input type="text" name="talk" id="talk">
<input type="button" value="Test" id="btn">
<div id="content"></div>
<script type="text/javascript">

function jsonpcallback(result) {
    for(var i in result) {
        alert(i+":"+result[i]);
    }
 }
 var JSONP = document.createElement("script");
 JSONP.type='text/javascript';
 JSONP.src='http://192.168.1.125:8080/logtest/log?callback=jsonpcallback';
 document.getElementsByTagName('head')[0].appendChild(JSONP);


</script>

</body>
</html>

上面是用原生的js请求，用jquery ajax请求直接的话

$.ajax({
             url: "http://" + ipPort + "/user/getUser",
             type: 'GET',
             dataType: 'jsonp',
             jsonp: 'callback',                                
             success: function (data) {
                   alert('success:'+data);
             },
             fail: function () {
                   alert('fail');
             }
});

服务器端：

package logtest;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.log4j.Logger;


public class LogServlet extends HttpServlet {
	/**
	 * 
	 */
	private static final long serialVersionUID = 1L;
	Logger log = Logger.getLogger(LogServlet.class);

	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		//跨域请求方式一
        //  resp.setHeader("Access-Control-Allow-Origin", "*");
		//跨域请求方式二
		String callback = req.getParameter("callback");
		resp.getWriter().print(callback+"({\"result\":\"succe\"})");
		
	}


}

Be Patient K

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ajax跨域请求

比较通用的有如下两种方式，一种是从服务器端下手，另一种则是从客户端的角度出发。二者各有利弊，具体要使用哪种方式还需要具体的分析。服务器设置响应头服务器代理客户端采用脚本回调机制。方式一 Access-Control-Allow-OriginAccess-Control-Allow-Origin 关键字只有在服务器端进行设置才会生效。如果
复制链接

扫一扫