H5 페이지에서 APP 기능을 호출하는 방법

이번에는 H5 페이지에서 APP 함수를 호출하는 방법을 알려드리겠습니다. H5 페이지에서 APP 함수를 호출할 때 주의사항은 무엇인가요?

이런 종류의 기능은 시장에서 흔히 볼 수 있으며 Taobao H5, Zhihu H5 등과 같이 이제 매우 일반적이 될 것입니다. . .

클릭하면 앱이 호출되거나 다운로드 페이지가 열리거나 직접 다운로드됩니다.

하지만 Zhihu의 이 기능은 약간 다르다는 것을 알았습니다. 먼저 휴대폰에서 Zhihu 앱을 열 것인지 묻는 메시지를 표시한 다음(브라우저 메커니즘이 사용자에게 작동 권한을 요청함) 다운로드 팝업을 표시하는 것이었습니다. 즉각적인.

솔루션 URL 구성표

URL 구성표는 IOS와 Android 모두 지원되며 호환성이 좋습니다.

iframe을 사용하는 방법을 선호합니다

의사 코드는 다음과 같습니다.

const iframe = document.createElement('iframe');
iframe.src = 'URL scheme'; // URL scheme的方式跳转
iframe.style.display = 'none';
document.body.appendChild(iframe);

이때, 모든 환경이 지원하면 APP가 깨어납니다.

하지만 이것은 이상적인 상황입니다. 호환성 처리의 빠른 논리를 수행하는 것이 더 좋습니다.

일부 시스템은 iframe의 src를 가로챌 것입니다(이것은 앱을 깨우지 못하는 이유 중 하나일 뿐입니다). 왜냐하면 이 src

속성

은 불법 해커이고 이를 악용하여 많은 취약점이 발생하기 때문입니다. 그래서 이때는 APP 조정 실패 여부를 판단할 필요가 있습니다.

의사 코드는 다음과 같습니다.

const timer = 1000;
setTimeout(function() {
        // 执行成功后移除iframe
    document.body.removeChild(iframe);
    //setTimeout小于2000通常认为是唤起APP失败
    if (Date.now() - last < 2000) {
            // 执行失败函数
            // 这里需要考虑一下之前知乎遇到的那个问题（浏览器询问导致时间小于2S）
    } else {
           //  执行成功函数
        }
}, timer);

이해:

통화가 성공하면 H5 페이지가 백그라운드로 전환되고 타이머가 지연됩니다. 사용자가 앱에서 H5 페이지로 전환하더라도 시간차는 2S보다 커야 합니다.

각성이 실패하면

timer

가 제 시간에 실행되며(100ms의 지연이 있어도 충분함) 이때는 2S 미만이어야 합니다. iframe이 가로채면 호환성을 위해 window.location.href = URL 체계를 사용할 수 있습니다.

이 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

관련 읽기:

HTML 5의 새로운 기능을 사용하는 방법

HTML에서 테이블 마우스 드래그 정렬을 구현하는 방법

html이 페이지로 이동할 때 매개변수를 전달하는 방법

위 내용은 H5 페이지에서 APP 기능을 호출하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!