自动填充 WebOTP javascript api 不起作用

Posted 2023-03-31

【中文标题】自动填充 WebOTP javascript api 不起作用

【英文标题】：autofill WebOTP javascript api is not working

【发布时间】：2021-05-28 11:40:35

【问题描述】：

我尝试了许多示例代码，但没有任何效果。

console.log("Otp.js>13 mounted");
if ('OTPCredential' in window) 
    try 
        console.log("Otp.js>16 in otpcredential");
        if (navigator.credentials) 
            try 
                console.log("Otp.js>19 credential");
                let type,code = await navigator.credentials.get( otp: transport: ['sms'])
                console.log("EsignSteps.js>78 aaaayo",type,code);
            
            catch (e) 
                console.log("EsignSteps.js>81",e);
            
        
    
    catch (err) 
        console.log("40",err);
    

即使在我收到 OTP 之后，上面的代码也会在几分钟后给出 DOMException

我也试过

const abort = new AbortController();

setTimeout(() => 
  abort.abort();
, 2 * 60 * 1000);

let type,code = await navigator.credentials.get( signal: abort.signal,otp: transport: ['sms'])

也试过了

navigator.credentials.get( signal: abort.signal,otp: transport: ['sms'])
.then((otp)=>
console.log(otp);
)
.catch(err=>
console.log(err);
)

我试过很多短信格式，比如：

格式 1：

Your OTP is : 123456
@https://example.com #123456

格式 2：

Your OTP is : 123456
@example.com #123456

格式 3：

Your OTP is : 123456
@www.example.com #123456

我已经浏览了最小的细节 https://web.dev/web-otp/

我尝试了一些演示，例如https://web-otp.glitch.me/、https://jyotishman.github.io/webOTPAPI/ 哪些不工作

【参考方案1】：

我找到了解决方案。我从保存在我的联系人列表中的朋友的手机号码发送短信。 如果发件人的电话号码包含在收件人的通讯录中，由于底层SMS User Consent API!的设计，该API不会被触发。