jquery跨域ajax访问方法

3 篇文章 0 订阅
3 篇文章 0 订阅

较少的情况下我们的前端页面不在服务器上,比如把页面做成app的界面,那么这时候访问服务器交流数据的话就需要用跨域ajax的方法解决了,而jquery就能简单方便的实现,当然目前暂时只支持get方法。那么下面来看代码:

<script typet="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script>
  $.ajax(
          {
            type:'get',
            url : 'http://www.aaa.com/index.php?a=1&b=2',
            dataType : 'jsonp',
            jsonp: "jsoncallback",
            success  : function(data) {

            },
            error : function() {

            }
          }
  );
</script>

代码很好理解,首先引用jquery,可以下载jquery最新版,放在目录里引用,也可以用公共连接,比如百度就有,网址在这:http://cdn.code.baidu.com/,找到jquery的链接考进来就行。

接着type设置数据传输方法,一般用get。

url里写你服务器上控制器或者api的地址,要传递的参数也写在里面,比如我这里就传了个值为1的参数a,和值为2的参数b。

jsonp是我们跨域访问的方法,照着打就行。

下面是返回的结果,服务器上的控制器或api会往data里放数据再传回来,然后你就可以对该数据data进行操作。success中写返回成功的操作,error中写返回失败的操作

服务器上代码是这样的:

把要返回页面的数据放在$data中,执行下面代码

echo $_GET['jsoncallback'] . "(".json_encode($data).")";

就可以咯~

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
跨域是指浏览器限制了由一个域名下的网页向另一个域名下的服务器发送请求的行为。这是为了保护用户的隐私和安全而设立的安全策略。然而,在某些情况下,我们可能需要在前端使用jQueryajax方法发送跨域请求。为了解决这个问题,可以使用JSONP或CORS进行跨域请求。 JSONP(JSON with Padding)是通过在请求中添加一个回调函数的方式来实现跨域请求的。回调函数会将服务端返回的数据包裹在函数中,从而解决了跨域问题。通过设置dataType为"jsonp",可以告诉jQuery使用JSONP来发送跨域请求。例如: ```javascript $.ajax({ url: "http://example.com/api/data", dataType: "jsonp", success: function(response) { console.log(response); } }); ``` CORS(Cross-Origin Resource Sharing)是一种更为现代化的跨域请求解决方案。通过在服务端设置响应头中的Access-Control-Allow-Origin字段,允许指定的域名来访问资源。如果服务端允许跨域请求,那么在前端使用jQueryajax方法发送请求时,就不再会受到浏览器的限制。例如: ```javascript $.ajax({ url: "http://example.com/api/data", type: "GET", success: function(response) { console.log(response); } }); ``` 总的来说,如果需要在前端使用jQueryajax方法进行跨域请求,可以使用JSONP或CORS来解决跨域问题。具体的解决方案取决于服务端是否支持和设置了相应的跨域策略。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [jQuery(五)Ajax跨域](https://blog.csdn.net/weixin_53072519/article/details/120292253)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 50%"] - *3* [jqueryajax处理跨域的三大方式](https://blog.csdn.net/lgxzzz/article/details/119900540)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值