ajax跨域

最新推荐文章于 2025-01-12 15:56:13 发布

_小李哥

最新推荐文章于 2025-01-12 15:56:13 发布

阅读量335

点赞数

CC 4.0 BY-SA版权

分类专栏：练习文章标签： ajax

本文链接：https://blog.youkuaiyun.com/cocoaxian/article/details/70274036

练习专栏收录该内容

92 篇文章

订阅专栏

本文介绍了一种使用JSONP实现跨域请求的方法，并演示了如何在客户端和服务端进行配置以完成跨域请求。包括修改请求参数、设置响应头及调整响应数据格式等关键步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.ajax默认是本域使用的

在这里跨域：http://www.lizixian.cn:6666

请求协议、一级域名、二级域名、顶级域名、端口；有一个不一样就认为是跨域。

<%@ page language="java" pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>验证</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="description" content="This is my page">

<script type="text/javascript" src="js/jquery.js" ></script>
<script type="text/javascript">

jump();

function jump(){
var xhrurl = "http://192.168.1.110/test.do";
$.ajax({
type : "get",
async : false,
url :xhrurl,
cache : false,
dataType : "jsonp",
jsonp: "callbackparam",
jsonpCallback:"jsonpCallbackMe",
success : function(json){
alert("跨域测试成功");
},
error:function(e){
alert("跨域测试失败");
},
});
};
</script>
</head>
<body>
<h3 id= "test" align="center">正在努力跨域测试···</h3>
</body>

</html>

2.服务端响应头添加两句代码

response.addHeader("Access-Control-Allow-Origin", "*");// 允许跨域
response.addHeader("Access-Control-Allow-Methods", "POST,GET"); // 允许的请求类型

3.响应数据应改为jsonp格式，而且在服务器上也要稍微改动下响应数据的格式：

原本的json格式的数据：String outString = "{"Result":”1"}";

转成jsonp格式的数据：String outString = "jsonpCallbackMe({"Result":”1"})";这里的jsonpCallbackMe就是上面ajax请求里的jsonpCallback