封装axios请求

/**
 * 请求管理
 */
import axios from 'axios'
import qs from 'qs'
import { globalHost } from '@/constant'

const app = globalHost;

//全局的axios默认值
axios.defaults.timeout = '';               //请求超时时间,过期将中断请求
axios.defaults.withCredentials = false;    //跨越请求是否需要携带凭证

//get请求
export const getRequest = (url = '', params, dataFormat = 'json') => {
    return axios({
        url: `${app}${url}`,     //请求地址
        method: 'get',           //请求方式
        params: params,          //请求携带的数据(入参)
        // baseURL: '/byProxy',     //自动加在url前面
        headers: {               //自定义请求头
            'Content-Type': `${dataFormat == 'form' ?
                'application/x-www-form-urlencoded;charset=UTF-8' :
                'application/json'
                }`,
        },
        transformResponse: [     //在传递给then/catch前对数据做处理
            function (response) {
                //对响应的数据做处理
                return response;
            }
        ],
    })
}
//post请求
export const postRequest = (url = '', data, dataFormat = 'json') => {
    return axios({
        url: `${app}${url}`,     //请求地址
        method: 'post',           //请求方式
        data: data,              //请求携带的数据(入参)
        //baseURL:'byProxy',     //自动加在url前面
        headers: {               //自定义请求头
            'Content-Type': `${dataFormat == 'form' ?
                'application/x-www-form-urlencoded;charset=UTF-8' :
                'application/json'
                }`,
        },
        transformRequest: [      //向服务器发送数据之前处理数据(仅用于PUT、POST、PATCH)
            function (data, headers) {
                //请求携带的数据转为json
                if (dataFormat == 'json') {
                    data = qs.stringify(data);
                }
                return data;    //此函数必须返回字符串或者数组
            }
        ],
        transformResponse: [     //在传递给then/catch前对数据做处理
            function (response) {
                //对响应的数据做处理
                return response;
            }
        ],
    })
}
在 UniApp 中封装 Axios 请求为 `request` 可以参考以下步骤和示例代码: ### 安装 Axios 首先要确保 Axios 已经安装。如果还没安装,可在项目根目录下使用如下命令进行安装: ```bash npm install axios ``` ### 创建封装文件 在项目的 `utils` 目录下创建一个 `request.js` 文件,以下是封装的示例代码: ```javascript import axios from 'axios'; // 创建 axios 实例 const request = axios.create({ baseURL: 'https://your-api-base-url', // 设置 API 的基础 URL timeout: 5000 // 请求超时时间 }); // 请求拦截器 request.interceptors.request.use( config => { // 在发送请求之前做些什么,例如添加请求const token = uni.getStorageSync('token'); if (token) { config.headers['Authorization'] = `Bearer ${token}`; } return config; }, error => { // 处理请求错误 console.log(error); return Promise.reject(error); } ); // 响应拦截器 request.interceptors.response.use( response => { // 对响应数据做点什么 return response.data; }, error => { // 处理响应错误 console.log('err' + error); return Promise.reject(error); } ); export default request; ``` ### 使用封装请求 在需要使用请求的地方引入封装好的 `request`,示例如下: ```javascript import request from '@/utils/request'; // 定义一个请求函数 export function getBanner(data) { return request({ url: `/index/banner`, method: 'POST', data: data, headers: { 'auth': true // 需要认证 } }); } ``` ### 调用请求 在页面或者组件中调用封装好的请求函数: ```javascript import { getBanner } from '@/api/banner'; getBanner({ param: 'value' }).then((res) => { if (res.success) { // 成功后业务处理 console.log(res); } else { // 失败后业务处理 console.log(res); } }).catch((error) => { console.log(error); }); ```
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值