如何从接口获取验证码

#接口返回二进制流，前端解析展示

<template>

  <div class="wrapper">

    <el-form ref="loginForm" :model="loginForm" class="" autocomplete="on">

      <el-form-item prop="user">

        <el-input

          v-model="loginForm.login"

          prefix-icon="el-icon-key"

          placeholder="请输入验证码"

          width="200px"

          style="width: 300px"

        >

          <template slot="append">

            <el-button v-if="imgUrl" type="text" @click="getVc"

              >huoqu</el-button

            >

            <el-image v-else :src="imgUrl"></el-image>

          </template>

        </el-input>

      </el-form-item>

    </el-form>

  </div>

</template>

<script>

import App from "@/App.vue";

export default {

  data() {

    return {

      imgUrl: "",

      loginForm: {

        login: "",

      },

    };

  },

  created() {},

  methods: {

    getVc() {

      post("", {}).then((res) => {

        let base64 = result.base64Qrcode; //接口返回

        let conversions = this.base64ToBlob(base64, "image/png");

        this.imgUrl = URL.createObjectURL(conversions);

      });

    },

    base64ToBlob(urlData, type) {

      let bytes = window.atob(urlData);

      let ab = newArrayBuffer(bytes.length); //ascii吗小于0转换为大于0

      let ia = new Uint8Array(8);

      for (let i = 0; i < bytes.length; i++) {

        ia[i] = bytes.charCodeAt(i);

      }

      return new Blob([ab], {

        type: type,

      });

    },

  },

};

</script>

<style lang="scss" scoped></style>