How to use Tencent slider verification code in Vue3+Vue-cli4 project

<script src="https://ssl.captcha.qq.com/TCaptcha.js"></script>

export default {
    name: "Login",
    setup() {
        const loginForm = reactive({
            accountName: '',
            accountPassword: '',
            ticket: '',
            randstr: ''
        })
        return {
            loginForm
        }
    }
}

export default {
    name: "Login",
    setup() {
        const loginForm = reactive({
            accountName: '',
            accountPassword: '',
            ticket: '',
            randstr: ''
        })
 
        const loginPost = () => {
 
            let captcha = new window.TencentCaptcha(config.app_id, res => {
                loginForm.randstr = res.randstr;
                loginForm.ticket = res.ticket;
 
                userLogin(loginForm).then(resp => {
 
                    if (resp.code === 200) {
                        //Logic after successful login} else {
                        //Logic after login failure}
                }).catch(() => {
                    ElMessage.error({
                        message: 'System error! Please try again later! '
                    })
                })
            })
            captcha.show();
        }
 
        return {
            loginPost,
            loginForm
        }
    }
}

<!-- Tencent SDK-slider verification code dependency-->
<dependency>
  <groupId>com.tencentcloudapi</groupId>
  <artifactId>tencentcloud-sdk-java</artifactId>
  <version>4.0.11</version>
</dependency>

public class DescribeCaptchaResult {
    @Value("${Tencent.SecretId}")
    private String secretId;
 
    @Value("${Tencent.SecretKey}")
    private String secretKey;
 
    @Value("${Tencent.CaptchaAppId}")
    private int captchaAppId;
 
    @Value("${Tencent.AppSecretKey}")
    private String appSecretKey;
 
    public JSONObject getTencentCaptchaResult(String ticket, String randstr, String userIp) {
        try {
            // Instantiate an authentication object. The parameters need to be passed in the Tencent Cloud account secretId and secretKey. Here, you also need to pay attention to the confidentiality of the key pair. // The key can be obtained at https://console.cloud.tencent.com/cam/capi. Credential cred = new Credential(secretId, secretKey);
            // Instantiate an http option, optional, you can skip HttpProfile if there is no special requirement httpProfile = new HttpProfile();
            httpProfile.setEndpoint("captcha.tencentcloudapi.com");
            // Instantiate a client option, optional, you can skip ClientProfile if there is no special requirement clientProfile = new ClientProfile();
            clientProfile.setHttpProfile(httpProfile);
            // Instantiate the client object to request the product, clientProfile is optional CaptchaClient client = new CaptchaClient(cred, "", clientProfile);
            //Instantiate a request object. Each interface will correspond to a request object DescribeCaptchaResultRequest req = new DescribeCaptchaResultRequest();
            req.setCaptchaType(9L);
            req.setTicket(ticket);
            req.setRandstr(randstr);
            req.setUserIp(userIp);
            req.setCaptchaAppId((long) captchaAppId);
            req.setAppSecretKey(appSecretKey);
            // The returned resp is an instance of DescribeCaptchaResultResponse, corresponding to the request object DescribeCaptchaResultResponse resp = client.DescribeCaptchaResult(req);
            // Output the string in JSON format return JSONObject.parseObject(DescribeCaptchaResultResponse.toJsonString(resp));
        } catch (TencentCloudSDKException e) {
            throw new ServiceException(e.getMessage());
        }
    }
}