Contoh implementasi membangunkan Baidu dan Amap APP di Html5

Beberapa hari yang lalu, United Black Card melaporkan perlunya membuka Baidu APP atau Amap APP di H5, jadi saya memeriksa dokumen terkait secara online dan meletakkan tautan di bawah: 1. Amap 2. Baidu Map

Ide spesifiknya adalah ketika mengklik untuk memilih peta, pertama-tama minta tautan APLIKASI. Jika tidak ada respons setelah 800 milidetik, lalu lompat ke tautan H5. Kerugian dari pendekatan ini adalah ia akan melompat ke link H5 terlepas dari apakah ia melompat ke APP atau tidak. Jika Anda punya ide bagus, silakan beri komentar.

Di bawah ini adalah kode yang relevan:

 function ToggleAppAndH5( AppUrl , AppCallback = () => {}){ // Buka APP terlebih dahulu const ifr = document.createElement('iframe'); .body.appendChild(ifr); setTimeout(fungsi(){ dokumen.body.removeChild(ifr); }, 3000); // Panggil tautan H5 setelah 800 milidetik biarkan timer = setTimeout(function () { clearTimeout(timer); AppCallback(); }, 800); window.onblur = function () { clearInterval(timer }; ){ // Letakkan tautan H5 yang relevan di sini if ​​(mapType === 'baidu') { frameDom.attr('src', http://api.map.baidu.com/direction?origin=latlng:+ curLat +,+ curLng +|nama:+ currAddr +&destination=latlng:+ elat +,+ elng +|nama:+ eaddr +&region= + cityName +&mode=driving&output=html&src=com.youbei.chefu } else if (mapType === 'amap') { frameDom.attr('src', https://ditu.amap.com/dir?type=car&from[lnglat]=+ curLng +,+ curLat +&from[name]=+currAddr+&to[lnglat]=+ elng + ,+ elat +&to[nama]=+eaddr+&src=com.youbei.chefu); const isiOS = !!u.match(//(i[^;]+;( U;)? CPU.+Mac OS X/); //ios terminal

1. Gaode

 // Header Apple dan Android berbeda let proto = isiOS ? 'iosamap://path' : 'amapuri://route/plan' ; const AppUrl = proto + ?t= 0&slat=+curLat+&slon=+curLng+ &sname= +currAddr+&dlat=+elat+&dlon=+elng+&dname=+eaddr+&src=xxx; ToggleAppAndH5(AppUrl,Panggilan Balik)

2. Baidu

 // Header Apple dan Android berbeda let proto = isiOS ? 'baidumap://' : 'bdapp://' const AppUrl = proto + map/direction?region=+cityName+&origin=latlng:+ curLat+,+ curLng + |nama:+ currAddr +&tujuan=latlng:+ elat +,+ elng +|nama:+ eaddr +&coord_type=bd09ll&mode=driving&src=com.youbei.chefu; ToggleAppAndH5(AppUrl, Panggilan Balik)

Di atas adalah keseluruhan isi artikel ini, saya harap dapat bermanfaat untuk pembelajaran semua orang. Saya juga berharap semua orang mendukung VeVb Wulin Network.