关于403错误的一种情况(两个状态码,一个成功,一个显示用户国企)

面签服务部分

问题再现

1、接口情况

/hngd/order/pre/info获取业务系统推送过来的订单信息

请求方式:POST

请求数据类型: application/json

请求示例:{ "key": "string", "remoteNumber": "string" }

请求参数说明:

vbnet 复制代码
key、remoteNumber分别对应/order/face/sign/{orderNum}接口响应得到的reroteKey、orderNumber

响应示例:

css 复制代码
{
  "code": 0,
  "data": {
    "hasCreated": true,
    "isExpired": true,
    "msg": "string",
    "preCreateOrderInfo": {
      "businessCode": "string",
      "businessField": [
        {
          "code": "string",
          "needNotarize": "string",
          "value": "string"
        }
      ],
      "comseqno": "string",
      "guaranteeCode": "string",
      "guaranteeName": "string",
      "loanBank": "string",
      "loanNumber": "string",
      "loginKey": "string",
      "orderClientQueryList": [
        {
          "address": "string",
          "clientCardNo": "string",
          "clientName": "string",
          "clientType": 0,
          "clientTypeName": "string",
          "gender": "string",
          "idCardBack": "string",
          "idCardFront": "string",
          "isMarry": "string",
          "phone": "string",
          "relationId": 0
        }
      ],
      "remoteNumber": "string"
    }
  },
  "errorMsg": "string"
}

2、问题情况

响应截图

network基本截图

第一张图中有一个要注意的点,后面需要改(request url后面多了个斜杠)

axios封装截图

通常来讲403问题是由于用户信息过期而无法访问所请求的资源,通常有一个状态码是我们所遇到的问题,这里有两个状态码,一个是status,一个是code,status为200表示请求成功,code为403表示用户信息过期,这里的原因在于错误的使用token,笔者大致讲一下问题的具体的业务场景

scss 复制代码
个贷项目主要有两大部分,一个是前面的录单服务部分,一个是后面的面签服务部分,两个服务后面可能一个再公众号,一个在小程序两个部分的接口请求不是在同一个网址下(暂时设置的是同一个域名下面,后面也许还会再做更改),这两个服务的token不是用的同一个。
所以这里产生问题的原因就在于说,因为是先做录单部分的,从录单部分登录,并且登录设置了Token,但是这个token和后面面签服务的Token不一样,后面进入面签服务也要进行一次登录,也许是"隐性登录"(这里是点击发起面签按钮,在这个按钮的点击事件中,增加了登录免登录的接口请求),但是笔者在做后面面签服务部分的接口请求的时候,仍然用的是前面录单服务部分的token,所以失败,这里两个状态码,虽然第一个状态码status显示200成功,但是第二个状态码code却一直报403错误(用户信息过期)

问题解决

获取业务系统推送过来的订单信息/hngd/order/pre/info接口是进入面签服务的开始,这个接口不需要token,后面面签服务的接口包括说登录免登录都基于业务系统推送过来的订单信息这个接口的返回值。

(这边也就是有一个注意:具体场景中,不是每个接口都一定需要token,比如这边的获取业务系统推送过来的订单信息/hngd/order/pre/info接口)

对axios封装的请求部分做更改

1、通过设置接口白名单,接口白名单中的路径不需要token

2、两个服务,跨域时候设置两个代理(/api代理录单服务部分的测试域名前缀,/fvurl代理面签服务部分的测试域名前缀),设置双token,通过判断url是哪一个服务的,从而引用不同的token

arduino 复制代码
const whiteList = [
  '/fvurl/hngd/order/pre/info'
]
request.interceptors.request.use(config => {
  NProgress.start()
  console.log('config*', config)
  // 如果在接口白名单当中,不设置token返回config
  if (whiteList.includes(config.url)) {
    console.log('接口在白名单当中')
    config.headers.device = 'app-h5'
    return config
  }
  const isToken = (config.headers || {}).isToken === false
  let token
  if (config.url.split('/').includes('fvurl')) {
    token = store.state.viewToken
  } else {
    token = store.state.orderToken
  }
​
  if (token && !isToken) {
    config.headers.token = token
  }
  config.headers.device = 'app-h5'
  console.log('token请求头', token)
  return config
}, error => {
  return Promise.reject(error)
})

这是遇到这种两个状态码,一种403问题的一种思路和场景。

相关推荐
qq_390161775 分钟前
防抖函数--应用场景及示例
前端·javascript
3345543233 分钟前
element动态表头合并表格
开发语言·javascript·ecmascript
John.liu_Test35 分钟前
js下载excel示例demo
前端·javascript·excel
PleaSure乐事1 小时前
【React.js】AntDesignPro左侧菜单栏栏目名称不显示的解决方案
前端·javascript·react.js·前端框架·webstorm·antdesignpro
哟哟耶耶1 小时前
js-将JavaScript对象或值转换为JSON字符串 JSON.stringify(this.SelectDataListCourse)
前端·javascript·json
理想不理想v1 小时前
vue种ref跟reactive的区别?
前端·javascript·vue.js·webpack·前端框架·node.js·ecmascript
栈老师不回家2 小时前
Vue 计算属性和监听器
前端·javascript·vue.js
前端啊龙2 小时前
用vue3封装丶高仿element-plus里面的日期联级选择器,日期选择器
前端·javascript·vue.js
一颗松鼠2 小时前
JavaScript 闭包是什么?简单到看完就理解!
开发语言·前端·javascript·ecmascript
小远yyds2 小时前
前端Web用户 token 持久化
开发语言·前端·javascript·vue.js