YingXingAI/pages/login/recognitionResult/recognitionFailed.vue

<template>
  <view class="recognition-result-page">
    <u-navbar title="认证结果" :is-back="false"></u-navbar>

    <view class="result-container">
      <image
        :src="isSuccess ? resultSuccess : resultError"
        class="result-image"
        mode="widthFix"
      ></image>
      <text class="result-text">{{
        isSuccess ? "认证通过" : "认证未通过"
      }}</text>
    </view>

    <view class="btn-container">
      <button class="next-btn" @click="handleNext">
        {{ isSuccess ? "进入系统" : "重新识别" }}
      </button>
    </view>
  </view>
</template>

<script>
import resultSuccess from "@/static/common/img/result-success.png";
import resultError from "@/static/common/img/result-error.png";

export default {
  data() {
    return {
      resultSuccess,
      resultError,
      isSuccess: false,
      verifyResult: null,
      verifyInfo: null,
      token: null,
    };
  },
  onLoad(options) {
    // 获取token参数
    if (options && options.token) {
      this.token = options.token;
      console.log("获取到token:", this.token);
      // 使用token查询认证结果
      this.queryVerificationResult();
    }
  },
  methods: {
    // 查询认证结果
    queryVerificationResult() {
      if (!this.token) {
        console.error("token为空，无法查询认证结果");
        return;
      }

      // 调用API查询认证结果
      this.$u.api
        .getVerifyInfo(this.token)
        .then((res) => {})
        .catch((err) => {
          console.log("API调用过程中出错:", err);
        });
    },
    handleNext() {
      if (this.isSuccess) {
        uni.switchTab({
          url: "/pages/main/index/index",
        });
      } else {
        this.toBaiduApi();
      }
    },

    toBaiduApi() {
      this.$u.api.getAPIToken().then((res) => {
        const token = res.result.verify_token;

        // 跳转到百度人脸核验页面
        this.redirectToBaiduVerification(token);
      });
    },
    redirectToBaiduVerification(token) {
      // 获取当前域名
      const currentDomain = window.location.origin;

      // 编码回调URL - 使用相对路径，让uni-app处理路由
      // 百度人脸核验会在回调URL后附加verify_result和verify_info参数
      const successUrl = encodeURIComponent(
        `${currentDomain}/#/pages/login/recognitionResult/recognitionResult?token=${token}`
      );
      const failedUrl = encodeURIComponent(
        `${currentDomain}/#/pages/login/recognitionResult/recognitionFailed?token=${token}`
      );

      // 构建跳转URL
      const verifyUrl = `https://brain.baidu.com/face/print/verify/verify?token=${token}&successUrl=${successUrl}&failedUrl=${failedUrl}`;

      console.log("跳转到百度人脸核验页面:", verifyUrl);

      // 直接跳转到百度人脸核验页面
      window.location.href = verifyUrl;

      return;
    },
  },
};
</script>

<style lang="scss">
.recognition-result-page {
  padding: 0 24rpx;

  .result-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 130rpx 0 36rpx;
    text-align: center;

    .result-image {
      width: 160rpx;
      height: 160rpx;
      margin-bottom: 36rpx;
    }

    .result-text {
      font-family: PingFang SC, PingFang SC;
      font-size: 32rpx;
      color: #000;
    }
  }

  .btn-container {
    .next-btn {
      background-color: #45b5ff;
      color: #ffffff;
      height: 90rpx;
      line-height: 90rpx;
      border-radius: 45rpx;
      font-size: 32rpx;
      font-weight: 500;
      border: none;
    }
  }
}
</style>