Vue前端發送短信邏輯

1.vue發送短信邏輯

• 前端函數如下,js方法代碼無需更改，前端代碼邏輯在

  components\common\lab_header.vue

• 隻需要修改

  components\axios_api\http.js

  中調用的後端位址

  • // axios.defaults.baseURL = "http://127.0.0.1:8000/"
    axios.defaults.baseURL = "http://192.168.56.100:8888/"
               

// 擷取手機驗證碼
    sendcode() {
      // 0. 判斷是否發送中
      if (this.is_send) {
        return
      }
      this.check_phone()
      this.check_imgcode()
      if (this.phone_error || this.imgCode_error) {
        return false
      }
      // 3、短信發送
      // imgCode: '',
      // uuid: '',
      var data = { phone: this.phone, image_code_uuid: this.uuid, image_code: this.imgCode }
      this.is_send = true
      send_phone_code_post(data).then((res) => {
        console.log(res)
        if (res.code != 0) {
          this.errorMsg = res.msg
          return
        }
        let t = 10
        let si = setInterval(() => {
          this.msgButtonText = t
          t = t - 1
          if (t == 0) {
            this.is_send = false
            this.msgButtonText = '擷取手機驗證碼'
            clearInterval(si)
          }
        }, 1000)

        // if (res.data.code == 200) {
        //   console.log('短信發送成功')
        //   alert(res.data.message)
        // } else {
        //   alert(res.data.message)
        // }
      }).catch((err) => {
        console.log(err)
      })
    },