原理是这样的:(让自己的AJAX执行自己的程序,我只是触发了它的事件。)A服务器有处理页面ajax+asp(做为接口,可加权限防问),B服务器现在要在自已的网站进行跨域(A服务器)取值。可以这样只要A服务器有这样一个接口(可加权限防问),这样就可以做从A服务器获取到内容。
原理图如下
步骤一:(testAJAX.js)放在A服务器上的
function G(id){if(typeof(id)=="string"){return document.getElementById(id);}return id;}
var id = G("testScript").innerHTML;
//alert(scriptArgs);
function login(id){
$.ajax({
type: "POST",
url: "testAJAX.asp",
data: "id=" + id,
beforeSend: function(){
$("#confirm").text("正在读取中,请稍候...");//#confirm为显示内容的DIV ID
},
success: function(msg){
if(msg !== ""){
//alert(msg);
var str=msg;
$("#confirm").html(msg);//查询出来的内容
}else {
$("#confirm").text("暂无记录");
}
}
});
}
login(id);
步骤二:(testAJAX.asp)也是放在A服务器上的
<%
Function checkStr(Chkstr)
dim Str:Str=Chkstr
if isnull(Str) then
checkStr = ""
exit Function
else
Str=replace(Str,"'","")
Str=replace(Str,";","")
Str=replace(Str,"--","")
checkStr=Str
end if
End Function
'过滤SQL非法字符并格式化html代码
function Replace_Text(fString)
if isnull(fString) then
Replace_Text=""
exit function
else
fString=trim(fString)
fString=replace(fString,"'","''")
fString=replace(fString,";",";")
fString=replace(fString,"--","—")
fString=server.htmlencode(fString)
Replace_Text=fString
end if
end function
id=Replace_Text(checkStr(request("id")))
response.Write(id)
%>
步骤三:(test.html)是放在B服务器上的调用(也可以放在本地测试IIS中运行)
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>如何在自己网站跨域(ajax)</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>
function G(id){return document.getElementById(id)}
function LoadJS( id, fileUrl,values)
{
var scriptTag = G( id );
if(G(id)!=null)
{
G(id).parentNode.removeChild(G(id))
}
var oScript= document.createElement("script");
oScript.id = id;
oScript.type = "text/javascript";
oScript.src=fileUrl ;
oScript.text=values;
G("script").appendChild(oScript);
}
</script>
</head>
<body>
<div id="confirm"></div><!-- 显示ajax返回的值 -->
<div id="script" style="display:none"></div><!-- 显示js的容器 -->
<script>
function show()
{
values=G("textvalue").value;
LoadJS("testScript","http://www.ok22.org/download/testAJAX.js",values);//http://www.ok22.org/download/testAJAX.js为A服务器的处理JS
}
</script>
<textarea id="textvalue" cols="30" rows="10"></textarea><br />
<input type="button" value="执行显示" onClick="show();">
</body>
</html>
大家有什么问题或技术上的想法可以在此与大家分享,也可以加入前端爱好者QQ群(141999928)一起学习进步:
【幸凡前端技术交流群】
如果您觉得本文的内容对您的学习有所帮助,捐赠与共勉,支付宝(左)或微信(右)