Html中使用jquery通过Ajax请求WebService接口以及跨域问题解决
<!DOCTYPE html>
<html>
<head>
<title>jQuery Ajax 调用 WebService 示例</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<div id="result"></div>
<script>
// 使用 jQuery 发送 AJAX 请求
$.ajax({
url: 'http://ws.webservice-cross-domain.com/service.php', // WebService 接口 URL
type: 'GET', // 请求方法
dataType: 'jsonp', // 数据类型为 jsonp 以解决跨域问题
jsonpCallback: 'callbackFunction', // 服务器端用于包装响应的函数名
success: function(response) {
// 请求成功后的回调函数
$('#result').text(response.message);
},
error: function(jqXHR, textStatus, errorThrown) {
// 请求失败后的回调函数
$('#result').text('Error: ' + textStatus);
}
});
// 回调函数，需要与服务器端协商
function callbackFunction(data) {
console.log(data);
}
</script>
</body>
</html>这段代码演示了如何使用jQuery的$.ajax方法调用一个跨域的WebService接口。通过指定dataType为jsonp并提供一个jsonpCallback函数，可以解决跨域问题。成功获取响应后，会将响应内容显示在页面的<div id="result"></div>元素中。
评论已关闭