uniapp怎么修改默认请求方式

uniapp修改默认请求方式

Uniapp是一款开发跨平台应用的框架，它能够快速构建适用于多个平台（如iOS、Android）的应用程序。在开发中，我们常常需要使用请求数据，而Uniapp默认使用的是get请求方式，但有时我们需要使用其他请求方式，比如post、put等。那么，该如何修改默认的请求方式呢？下面，就让我们来详细了解一下。

步骤

修改默认的请求方式需要经过以下步骤：

第一步：在main.js中设置

在main.js中设置请求拦截器，并在其中设置默认的请求方式。具体方式如下：

import {baseUrl} from '@/config/env'

import store from './store'
import { getToken } from './utils/auth'
// const baseUrl = process.env.NODE_ENV !== 'production' ? config.baseUrl.dev : config.baseUrl.pro
const whiteList = ['/login', '/404'] // 白名单，不需要登录的路由页面
const request = (options) => {
  options.url = baseUrl + options.url
  options.headers = {
    'Content-Type': 'application/json',
    'Authorization': 'Bearer ' + getToken()
  }
  return uni.request(options)
}
uni.getStorage({
  key: 'whiteList',
  success: function (res) {
    console.log(res)
    if (res) {
      whiteList.push(...res.data)
      console.log(whiteList)
    }
  }
});
// 登录授权后面后面会讲到，token拦截也在这里实现
uni.addInterceptor('request', {
  // 不设置为最先执行
  prepend: function(request) {
    console.log('request', request)
    if (whiteList.includes(request.url)) {
      return request
    }
    // 获取token
    const token = getToken()
    console.log('token', token)
    // 设置token，进入header
    if (token) {
      request.header.Authorization = 'Bearer ' + token
    }
    return request
  },
  // 这里将options变量的method修改为传入的method类型
  // 修改默认的method方式
  success: function (response) {
    console.log('成功:', response);
  },
  fail: function (response) {
    console.log('失败响应:', response);
  },
  complete: function (response) {
    console.log('请求完成:', response);
  },
  // performed 为 true 时证明 interceptors 链执行完成，否则会进入下一个 interceptors
  performed: true
});
Vue.config.productionTip = true
App.mpType = 'app'
Vue.prototype.$store = store
Vue.prototype.$http = request
const app = new Vue({
  ...App
})
app.$mount()

第二步：在api.js中使用

在api.js中，我们可以直接调用上述请求拦截器中设置的默认方法，从而实现修改默认请求方式的目的。具体操作如下：

import request from '@/utils/request'

export function getList(params) {
  return request({
    url: '/getList',
    method: 'POST',
    data: params
  })
}

在这个例子中，我们将请求方式改为了POST，如果需要使用其他方式，只需将method的值改为其他即可。

注意事项

需要注意的是，如果我们需要使用POST、PUT等方式进行请求，那么就需要在后台接口中进行对应设置，否则会无法正确接收到数据。

此外，如果我们需要对请求进行加密等操作，也可以在请求拦截器中进行对应设置，可以查阅相关文档进行了解。

总结

通过对上述步骤的了解和操作，我们可以轻松地修改默认请求方式，使得我们在开发过程中更加的便捷。在实际应用中，还需要根据实际需求进行设置，从而实现更好的效果。