jQuery的AJAX请求成功,但是跳转到error的解决方法

问题描述

        最新在项目中,使用jQuery的ajax请求ArcGIS Server的服务,因为服务开启了token验证,所以需要在请求服务之前调用ArcGIS Seerver的token生成接口,然后再调用服务,如下:

let user_token='',_self=this;

//获取token
$.ajax({
    method:"post",
    //url:appConfig.server_host+":6443/arcgis/admin/generateToken",
    url:"/arcgis/tokens/",
    async:false,
    data:{
        request:"getToken",
        username:appConfig.userName,
        password:appConfig.password,
        credential:60
    },
    dataType:"json",
    success:function (data) {
        message.success("token请求成功!");
        //console.log(data)
        user_token=data;
    },
    error:function (e) {
        message.error("token请求失败!");
        console.log(e)
    }
});

//携带token请求服务
esriLoader.loadModules([
    "esri/layers/FeatureLayer",
], options) // 传入需要使用的类
    .then(([FeatureLayer,
           ]) => {
        // doSomeThing

        let featureLayer = new FeatureLayer(appConfig.noneServer+"/0?token="+user_token);

        _self.state.mainMap.addLayer(featureLayer);

        _self.setState({
            _initServer:featureLayer,
        })

    })
    .catch(err => {
        console.error(err)
    })

        由上述代码可知,token生成接口调用成功的话,他会跳转到success函数,然后将token赋值给user_token这个变量。但是,现在出现了一个问题,调用token生成生成接口的时候,他跳转到了error这个函数里面,这就意味着这个接口调用失败了吧。奇怪的问题出现了,当我把这个错误信息输出之后,发现token在里面。这是为什么呢,请求成功了,但是却执行了error函数。

 

解决方案

         查阅资料可发现,所有的原因都出现在了dataType这个属性的赋值上面,我们的原来的代码,dataType属性值是“json”,但是他返回的却不是json字符串,而是一串String类型的字符串,所以,就导致了以上的问题。

        我们将代码中的dataType属性值修改为“text”,运行代码发现,此时ajax跳转到了正确的函数里,即success函数中。

 

当你使用jQueryajax方法发起请求时,如果后端返回了401状态码(表示未授权),那么jQuery会自动跳转到登录页面,这个行为是默认的。 如果你想自定义处理401状态码的情况,可以使用jQuery的全局ajax事件来实现。具体做法如下: 1. 在全局的ajax事件中监听401状态码: ```javascript $(document).ajaxError(function(event, jqxhr, settings, exception) { if (jqxhr.status == 401) { // 处理401状态码的情况 } }); ``` 2. 在处理401状态码的情况中,取消默认的跳转行为,并进行自定义处理: ```javascript $(document).ajaxError(function(event, jqxhr, settings, exception) { if (jqxhr.status == 401) { event.preventDefault(); // 取消默认的跳转行为 // 自定义处理401状态码的情况 } }); ``` 3. 在自定义处理401状态码的情况中,可以使用ajax方法重新发起请求,并在请求头中添加Authorization信息: ```javascript $(document).ajaxError(function(event, jqxhr, settings, exception) { if (jqxhr.status == 401) { event.preventDefault(); // 取消默认的跳转行为 // 自定义处理401状态码的情况 $.ajax({ type: 'GET', url: settings.url, // 重新发起请求 headers: { 'Authorization': 'Bearer ' + token // 添加Authorization信息 }, success: function(data) { // 处理成功的情况 }, error: function(jqxhr, status, error) { // 处理失败的情况 } }); } }); ``` 这样,当后端返回401状态码时,就会自动重新发起请求,并在请求头中添加Authorization信息,实现了自定义处理401状态码的情况。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

X北辰北

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值