前端页面中iOS版微信长按识别二维码的bug?
发布于 6 年前 作者 qiang23 7596 次浏览 来自 官方Issues

IOS13.4 iPhoneX

进入微信后调用的replaceState,导致二维码图片无法识别,去掉就好了

2 回复

你好,微信版本是多少?麻烦给下复现的链接

// 第一版:仅针对demo做的兼容处理,可以解决长按问题。但无法解决项目中;
var original = window.history.replaceState;
window.history.replaceState = function() {
    var args = arguments;
    setTimeout(function() {
        original.apply(window.history, args);
    }, 0);
    window.history.replaceState = original;
};

// 第二版:项目中尝试,延迟需要加到1s后, 但我觉得优先考虑上面的代码;
let original = window.history.replaceState;
let timer;
let startTime = new Date();
let delay = 1000;
window.history.replaceState = (...args) => {
    let diff = new Date() - startTime;
    let fn = () => {
        // 确保第一次都是异步的
        setTimeout(() => {
            original.apply(window.history, args);
        }, 0);
        window.history.replaceState = original;
    };
    if (diff < delay) {
        timer && clearTimeout(timer);
        timer = setTimeout(fn, delay - diff);
    } else {
        fn();
    }
};

/**
 * 最终版
 * 同时解决二维码和签名问题
 */
let schedule;
let original = window.history.replaceState;
window.history.replaceState = (...args) => {
    schedule && schedule('cancel');;
    Promise.race([
        // TODO: 为了确保签名过程中,路由也不产生变化
        // TODO: 这里可以放等待一个签名成功的Promise
        // 重复加入时执行取消
        new Promise((_, reject) => schedule = reject), 
        // 3s这个也可以改成1s,看个人;
        new Promise(r => setTimeout(r, 3000))
    ])
        .then(() => {
            original.apply(window.history, args);
            window.history.replaceState = original;
        }).catch((e) => {
            console.log(e);
        });
};
回到顶部