uniapp请求封装上传

1、如何封装请求👉uniapp请求封装_uniappx uts vue3 api request封装请求login-CSDN博客

2、封装上传图片的功能

复制代码
// 图片
const Upload = (url, source, formData) => {
  return new Promise(function (resolve, reject) {
    let header = {};
    if (uni.getStorageSync("token")) {
      header = {
        // 'Content-Type': ContentType,
        authorization: uni.getStorageSync("token"),
      };
    }
    uni.uploadFile({
      url: BASE_URL + url,
      filePath: source,
      name: 'file',
      formData,
      // name,
      header,
      success: function (res) {
        let obj1 = JSON.parse(res.data);
        uni.hideLoading();
        if (obj1.code !== 200) {
          uni.showToast({
            title: obj1.message,
            icon: "none",
            duration: 2000,
          });
        } else {
          uni.showToast({
            title: "上传成功",
            icon: "success",
            duration: 1000,
          });
          resolve(obj1)
        }
      },
      fail: function (err) {
        console.log(JSON.stringify(err), "失败999");
        uni.hideLoading();
        uni.showToast({
          title: "加载失败, 请稍后再试!",
          icon: "none",
          duration: 2000,
        });
      },
      complete: function () {},
    });
  });
};


export { Upload };

3、具体接口的请求js,内容如下:

复制代码
import { Upload } from './request'
// 获取场景列表
const uploadImg = (source, formData) => {
  return Upload('/uploadImg', source, formData)
}


export {
  uploadImg,
}
相关推荐
As331001014 分钟前
Chrome 插件开发实战:打造高效浏览器扩展
前端·chrome
xrkhy20 分钟前
nvm安装详细教程(卸载旧的nodejs,安装nvm、node、npm、cnpm、yarn及环境变量配置)
前端·npm·node.js
德育处主任1 小时前
p5.js 3D盒子的基础用法
前端·数据可视化·canvas
前端的阶梯2 小时前
为何我的figma-developer-mcp不可用?
前端
weixin_456904272 小时前
Vue3入口文件main.js解析
前端·javascript·vue.js
Awbeci2 小时前
微前端-解决MicroApp微前端内存泄露问题
前端
前端领航者2 小时前
重学Vue3《Vue Watch 监听器深度指南:场景、技巧与底层优化原理剖析》
前端·vue.js
布列瑟农的星空2 小时前
34岁老前端的一周学习总结(2025/8/15)
前端·后端
豆苗学前端2 小时前
vue3+TypeScript 实现一个图片占位符生成器
前端·面试·github
neon12042 小时前
Vue 3 父子组件通信核心机制详解:defineProps、defineEmits 与 defineExpose 完全指南
前端·javascript·vue.js·前端框架