如何和后端進行圖片驗證碼的交互？

現在很多項目都有進行圖片驗證碼驗證的功能，今天我也碰到了，遇到一個大坑：

　　普通的接口請求我們都會拿到后端返回的結果進行一系列操作，但是圖片驗證碼，后端不給你返回任何數據；

　　所以這個坑就是，圖片驗證碼的接口就是你頁面中img標簽綁定的src

<template>
  <div class="globalSet" style="min-width: 824px;width:calc(100% - 10px - 10px);height:calc(100% - 10px - 10px);color:red;">
    <div @click="refresh">換一張 </div>
    <img :src="imgSrc" style="width:100px;height:50px">
  </div>
</template>

<script>
export default {
  name: "globalSet1",

  data() {
    return {
      imgSrc: window.$url_front.serverBcsUrl + "/openRegister/createImagecode"
    };
  },
  methods: {
    refresh() {
      var num = Math.ceil(Math.random() * 10); //生成一個隨機數（防止緩存）
      this.imgSrc = window.$url_front.serverBcsUrl + "/openRegister/createImagecode?id=" + num;
    }
  }
};
</script>