uniapp开发微信小程序，小程序上传图片/视频到阿里云oss（调用接口的方式，让后端放）

<template>
  <McPage classes="min-h-full">
    <view>
      <view class="p-4 box-border">
        <view class="bg-white w-full rounded-3 center flex-col mt-12">
          <image :src="imgJoin(img)" class="w-80 h-80 rounded-2 mt--32rpx"></image>
          <view class="mt-4 text-#999AAC">{{ name }}</view>
          <view v-if="state*1 === 0" class="flex items-center mt-4 text-#999AAC text-xs">
            <text class="mr-3">描述相符</text>
            <u-rate
              v-model="rate"
              :count="5"
              size="38"
              :gutter="16"
              :min-count="1"
              active-color="#fdcb33"
              inactive-color="#999AAC"
              active-icon="star-fill"
              inactive-icon="star"
            />
            <text class="ml-3">{{ ['', '非常差','差','一般','好','非常好'][rate] }}</text>
          </view>
          <view class="w-full max-h-400 mt-2 p-2 box-border relative">
            <textarea
              v-model="commentContent"
              class="my-textarea"
              placeholder="从多个角度评价宝贝，可以帮助更多想买的人"
            />
          </view>
          <view v-if="imgList.length === 0" class="upData-box">
            <view class="upData">
              <view class="w-full h-full center flex-col" @click="clooseImage">
                <u-icon name="camera" size="32" color="black" class="mb-2"></u-icon>
                <text class="text-sm text-#222222">发图/视频能帮助他人更真实地了解商品</text>
              </view>
            </view>
          </view>
          <view v-else class="grid grid-cols-3 gap-3 py-4">
            <view
              v-for="(item, index) in imgList"
              :key="item.id"
              class="w-200 h-200 relative rounded-2 overflow-hidden"
            >
              <image v-if="item.contentType === 'image/jpeg'" :src="imgJoin(item.path)" class="w-full h-full" mode="aspectFill"></image>
              <image v-else :src="imgJoin(item.thumbTempFilePath)" class="w-full h-full" mode="aspectFill"></image>
              <image src="/static/image/icon/delet_img.png" class="absolute top-0 right-0 w-40 h-40" @click.stop="dltImg(item)"></image>
              <image v-if="item.contentType === 'video/mp4'" src="/static/image/icon/video2.png" class="videoIcon"></image>
            </view>
            <view v-if="imgList.length < 9" class="w-200 h-200 rounded-2 border-1 border-#E5E8EC border-dashed center flex-col" @click="clooseImage">
              <u-icon name="camera" size="32" color="black" class="mb-2"></u-icon>
              <text class="text-20 text-#222222 mt-2">照片/视频</text>
            </view>
          </view>
        </view>
      </view>
    </view>
    <view class="fixed bottom-0 w-full left-0 p-4 box-border" @click="submit">
      <view class="bg-[--index-color] text-white w-full h-80rpx center rounded-full font-600">匿名发布</view>
    </view>

    <!--操作菜单  选择图片/视频-->
    <!--<u-action-sheet v-model="showAction" border-radius="24" :list="list" @click="clooseImage"></u-action-sheet>-->
  </McPage>
</template>

<script>
import { subYouGoodsOrderFirstPingjia, subYouGoodsOrderZhuiPingjia } from '@/api/mall'

export default {
  components: {},
  props: {},
  data() {
    return {
      id: '',
      name: '',
      img: '',
      state: '', // 0 首次评价 1 追评
      commentContent: '',
      orderData: {},
      rate: 0,
      imgList: [],
      showAction: false,
      list: [{
        text: '拍照',
      }, {
        text: '相册'
      }, {
        text: '视频'
      }],
    }
  },
  computed: {},
  watch: {},
  async onLoad(options) {
    this.id = options.id ? options.id : ''
    this.name = options.name ? options.name : ''
    this.img = options.img ? options.img : ''
    this.state = options.state ? options.state : ''
  },
  onShow() {},
  methods: {
    clooseImage() {
      const that = this
      if (this.imgList.length === 9) return
      uni.chooseMedia({
        count: 9 - this.imgList.length,
        sizeType: ['original', 'compressed'],
        // mediaType: mediaType,
        // sourceType: sourceType,
        mediaType: ['image', 'video'],
        sourceType: ['album', 'camera'],
        maxDuration: 30,
        camera: 'back',
        success: res => {
          console.log(res)
          if (res.tempFiles.length === 0) return
          res.tempFiles.forEach(item => {
            console.log('item', item)
            that.$store.commit('SET_ANIMATION', true)
            uni.uploadFile({
              url: process.env.VUE_APP_BASE_API + 'api-file/files-upload',
              name: 'file',
              filePath: item.tempFilePath,
              header: {
                'Authorization': uni.getStorageSync('token'),
              },
              formData: {
                file: item,
                userType: 4,
                imgType: 'goods',
              },
              success: res => {
                console.log('res', res)
                if (res.statusCode === 200) {
                  const data = JSON.parse(res.data)
                  if (data.code === 200) {
                    console.log('data.data', data.data)
                    if (data.data.contentType === 'image/jpeg') {
                      this.imgList.push(data.data)
                    } else {
                      this.imgList.push({
                        ...data.data,
                        thumbTempFilePath: data.data.path + '?x-oss-process=video/snapshot,t_700,w_600,h_600,m_fast'
                      })
                    }
                  }
                }
              },
              fail: err => {
                console.log('err', err)
              },
              complete() {
                that.$store.commit('SET_ANIMATION', false)
              }
            })
          })
        },
      })
    },
    dltImg(item) {
      this.imgList = this.imgList.filter(e => e.id !== item.id)
    },
    async submit() {
      if (!this.commentContent) {
        uni.showToast({
          icon: 'none',
          title: '请填写评价内容',
        })
        return
      }
      const imgs = this.imgList.map(item => {
        if (item.contentType === 'image/jpeg') {
          return {
            type: 1,
            content: item.path,
          }
        } else {
          return {
            type: 2,
            content: item.path,
            coverImg: item.thumbTempFilePath
          }
        }
      })
      let res
      if (this.state * 1 === 0) {
        res = await subYouGoodsOrderFirstPingjia({
          orderDetailsId: this.id,
          score: this.rate,
          firstContent: this.commentContent,
          firstImgs: JSON.stringify(imgs),
        })
      } else if (this.state * 1 === 1) {
        res = await subYouGoodsOrderZhuiPingjia({
          orderDetailsId: this.id,
          firstContent: this.commentContent,
          zhuiImgs: JSON.stringify(imgs),
        })
      }
      if (res.code === 200) {
        // 从评价中心进来就直接返回评价中心
        const page = getCurrentPages()
        console.log('从评价中心进来就直接返回评价中心', page)
        if (page[page.length - 2].route === "pageMall/pages/comment/myComment") {
          uni.navigateBack()
          return
        }
        // 评价对象 ： {type: 'comment', status: 1,}
        uni.setStorageSync('resultObject', {type: 'comment', status: 1, })
        uni.redirectTo({
          url: '/pageMall/pages/mall/result',
        })
      }
    },
  },
}
</script>

<style lang="scss" scoped>
::v-deep .u-rate{
  gap: 10rpx;
}
.upData-box{
  width: 100%;
  padding: 32rpx;
  box-sizing: border-box;
  .upData{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 240rpx;
    border: 1px dashed #E5E8EC;
    border-radius: 20rpx;
    box-sizing: border-box;
  }
}
.videoIcon{
  width: 50rpx;
  height: 50rpx;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
</style>