Canvas .fillText第一次后不起作用

问题描述 投票:0回答:1

我正在使用jCaptcha.js为我的应用生成验证码。一旦完成注册和注销并尝试注册新帐户,它就可以完美地首次工作。画布不打印任何显示为空白的内容,因为它,它进入循环循环,因此我设置了检查以查看是否为空白。

if ($('.jCaptchaText')[0].toDataURL() != $('#blankCaptcha')[0].toDataURL())
isCaptchaBlank = false;

jCaptcha.js

! function(t, a) {
    "function" == typeof define && define.amd ? define([], function() {
        return t.jCaptcha = a()
    }) : "object" == typeof module && module.exports ? module.exports = a() : t.jCaptcha = a()
}(this, function() {
    var t = function(t, a) {
            return "function" != typeof NodeList.prototype.forEach && (NodeList.prototype.forEach = Array.prototype.forEach), Object.keys(a).forEach(function(e) {
                t[e] = a[e]
            }), t
        },
        a = function() {
            n = Math.round(8 * Math.random()) + 1, c = Math.round(8 * Math.random()) + 1, i = n + c
        },
        e = function(t, a, e) {
            !e && t[0].insertAdjacentHTML("beforebegin", '<canvas class="jCaptchaText"></canvas>'), this.$captchaText = this.$captchaText || document.getElementsByClassName("jCaptchaText"), this.$jCaptchaTextContext = this.$jCaptchaTextContext || this.$captchaText[0].getContext("2d"), this.$captchaText[0].width = a.canvasWidth, this.$captchaText[0].height = a.canvasHeight, this.$jCaptchaTextContext.textBaseline = "top", this.$jCaptchaTextContext.font = a.canvasFontSize + " " + a.canvasFontFamily, this.$jCaptchaTextContext.textAlign = "left", this.$jCaptchaTextContext.fillStyle = a.canvasFillStyle, this.$jCaptchaTextContext.fillText(n + " + " + c + " " + a.requiredValue, 0, 0)
        },
        i = void 0,
        n = void 0,
        c = void 0,
        o = function(a) {
            this.options = a ? t(this.options, a) : this.options, this.init()
        };
    return o.prototype = {
        options: {
            el: "jCaptcha",
            requiredValue: "=",// vinaya20180820 - made required value text as "=". it was * originally.
            resetOnError: !0,
            focusOnError: !0,
            clearOnSubmit: !0,
            canvasWidth: 50,
            canvasHeight: 15,
            canvasFontSize: "15px",
            canvasFontFamily: "Arial",
            canvasFillStyle: "#fff",
            callback: null
        },
        init: function() {
            this.$captchaInput = document.getElementsByClassName(this.options.el), a(), e(this.$captchaInput, this.options)
        },
        validate: function() {
            this.callbackReceived = this.callbackReceived || "function" == typeof this.options.callback, this.$captchaInput[0].value != i ? (this.callbackReceived && this.options.callback("error", this.$captchaInput), !0 === this.options.resetOnError && this.reset(), !0 === this.options.focusOnError && this.$captchaInput[0].focus(), !0 === this.options.clearOnSubmit && (this.$captchaInput[0].value = "")) : (this.callbackReceived && this.options.callback("success", this.$captchaInput), !0 === this.options.clearOnSubmit && (this.$captchaInput[0].value = ""))
        },
        reset: function() {
            a(), e(this.$captchaInput, this.options, !0)
        }
    }, o
});

javascript html mobile html5-canvas
1个回答
0
投票

当我再次重定向到登录页面(验证码已初始化时,我刚刚添加了location.reload(true)。这对我有用。不知道它是否存在缓存问题或带有.filltext的东西,但重新加载似乎可以解决该问题。请让我知道是否有更好的解决方案。

© www.soinside.com 2019 - 2024. All rights reserved.