ajax标准格式及实际开发中常见问题

admin 发布于 JS/JQ

          AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。 在前端开发中应用十分广泛,如:无刷新上传图片,分页、选项卡切换,地图加载。提高了前端的体验感。在网站开发中是非常重要的技术。

Ajax标准格式:[利用jquery中的ajax函数,原生js会出现兼容问题]

$.ajax({
    async:true, //请求是否异步,默认为异步(true)重要参数[重要]
    url: ajaxurl, //请求的url地址[重要]
    data:query,//发送请求数据
    type: "POST"//,[重要] //发送方式,POST/GET
    dataType: "json",//[重要]数据类型,一般为json格式,有些时候可以为html/text
    beforeSend:function(){ //请求前的处理 },
    success: function(result){ //成功处理函数,result为返回结果[重要] },
    error:function(){ //失败处理函数 },
    complete:function(){ //请求完成的处理 },
});

 开发中遇到的问题:

(1)、开发中有些时候需要本地访问网站中提供的接口数据:如本机需要访问

www.intewl.com里面某个接口时,由于本地的地址为127.0.0.1(或localhost),此时因为链接不同,出现跨域问题ajax不能获取数据。

解决方法:利用JsonBird解决远程数据跨域问题

在ajax中请求地址前添加https://bird.ioliu.cn/v1/?url=

最终请求地址为:“https://bird.ioliu.cn/v1/?url=www.intewl.com”,这样就可以实现跨域请求!

(2)、控制台提示404错误

这类错误的原因比较多,但是总的来讲就是请求的资源找不到,遇到这类错误需要首先检查一下请求的URL地址是否正确,或者请求的地址是否有效。

(3)、500系列错误

500系列的错误一般都来自于服务器端,常见的错误原因有:后端代码是否有问题?

(4)、需要获取ajax的返回值

定义一个全局变量,在success中将后台数据赋值给全局变量,在ajax调用完成后返回全局变量代码如下:

var check_res;[定义全局变量--必须添加]
function get(){//函数名可以自行定义
$.ajax({
            async:false,[设置是否异步]
            url: ajaxurl,
            data:query,
            type: "POST",
            dataType: "json",
            success: function(result){
                check_res=result;//必须添加
            }
      });
      return check_res;//放回结果--必须添加
}


1025浏览量 · 0评论 · 2018-11-06 07:12:56

全部评论  0

注册登录 进行评论

热门专题

更多专题