vue 验证码接口直接返回一张图片 前端怎么获取并渲染

1、封装api

接口中添加 responseType: ‘blob’,

export const hCode = key => request.get('/manager/captcha', { params: { key }, responseType: 'blob' })

2、发送请求 拿到数据 获取图片 window.URL.createObjectURL(res)

created() {
    this.iskey()
  },
  methods: {
    async iskey() {
      const res = await hCode({ key: +new Date() })
      //   console.log(res)
      // 将响应数据转换成url对象 赋值给src变量 传递给img
      const myBlob = new window.Blob([res.data], { type: 'image/png' })
      this.codeImg = window.URL.createObjectURL(myBlob)
    },

3、在data中添加一个变量codeImg 

4、动态渲染