Descarga directamente en Android, si es un iPad, pide al usuario que guarde el código QR para descargar

El problema de hoy es que
hay una imagen de banner en la página de inicio. Haga clic para descargar el archivo apk almacenado en el servidor.
Usé la descarga con la etiqueta a. Esto es amigable para Android y tabletas, pero no para iPhone y iPad. Guarda el apk. El archivo que se analizó en un código ilegible se abrió para mí. La idea actual es
hacer que el iPad salte a Appstone, pero no hay una red inalámbrica en el avión, por lo que no puedo saltar, así que voy a convertir el enlace en un código QR y dejar que juzgue si lo es. Si es un iPad, le pedirá al usuario que guarde el código QR para descargar.
Aquí surge la pregunta: ¿cómo se almacena este código QR, ya sea en el servidor o localmente?
Si está en el servidor, ¿cómo puede estar en la base de datos?

Al hacer clic en la imagen aquí también se hizo un juicio, de acuerdo con el resourceType para juzgar si abrir la imagen, saltar al registro o descargar la aplicación.

Idea de resolución de problemas:
juzgue directamente que hay Internet, luego vaya a la tienda respectiva y descargue la imagen
si no hay Internet. Cuando se considere que es un ipad, convierta directamente la dirección en un código QR y déjelo presionar prolongadamente para guardar
Buscar un complemento de generación de código QR

<cube-slide :speed="200"
                ref="slide"
                :data="items">
  <cube-slide-item v-for="(item, index) in items"
                   :key="index">
    <!-- 实现根据资源类型去跳转不同的页面 -->
    <!-- 4 资源下载 3 跳转注册 1,2大图察看-->
    <!-- 4 /cancrieasproxy/adv/hebei.apk -->
    <!-- 3 保证数据库src :/cancrieasproxy/adv/registeredmeber.jpg 和 resourceType:3-->
    <a :href="item.resourceId"
       download="hebei_app.apk"
       v-if="item.resourceType == 4"
       class="main-bak-height" @click="openApp"
       :style="{'background': 'url('+item.src+') no-repeat', 'background-size': '100% 100%', 'background-position': 'center center' }">
      <img class="swipe-img"
           :src="item.src">
    </a>
    <a @click="router"
       v-else-if="item.resourceType == 3"
       class="main-bak-height"
       :style="{'background': 'url('+item.src+') no-repeat', 'background-size': '100% 100%', 'background-position': 'center center' }">
      <img class="swipe-img"
           :src="item.src">
    </a>
    <a :href="item.src"
       v-else
       class="main-bak-height"
       :style="{'background': 'url('+item.src+') no-repeat', 'background-size': '100% 100%', 'background-position': 'center center' }">
      <img class="swipe-img"
           :src="item.src">
    </a>
  </cube-slide-item>
</cube-slide>

openApp(i) {
    
    
  // 判断是Android还是iPhone, Android直接下载,iPhone跳出二维码
  // 通过iframe的方式试图打开APP,如果能正常打开,会直接切换到APP,并自动阻止a标签的默认行为
  // 否则打开a标签的href链接
  var u = navigator.userAgent, app = navigator.appVersion
  var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; // Android
  var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/) // ios
  var link = document.getElementById('resource')
  if(this.online == true) {
    
    
    if (isAndroid) {
    
    
      link.href = i
      // link.download = hebei_app.apk
      link.click()
    }
    if (isIOS) {
    
    
      link.href = 'https://apps.apple.com/cn/app/%E6%B2%B3%E5%8C%97%E8%88%AA%E7%A9%BA/id1441284761'
      // link.download = hebei_app.apk
      link.click()
    }
  } else {
    
    
    // 离线状态
    if (isAndroid) {
    
    
        link.href = i
        link.click()
    }
    if (isIOS) {
    
    
      this.$createDialog({
    
    
        type: 'alert',
        confirmBtn: {
    
    
          text: '我知道了',
          active: true
        }
      }, (createElement) => {
    
    
        return [
          createElement('div', {
    
    
            'class': {
    
    
              'my-title': true
            },
            slot: 'title'
          }, [
            createElement('div', {
    
    
              'class': {
    
    
                'my-title-img': true
              }
            }),
            createElement('p', '截屏保存二维码')
          ])
        ]
      }).show()
    }
  }
$(function(){
    
    
	var u = navigator.userAgent, app = navigator.appVersion; 
	var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器 
	var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 
	alert('是否是Android:'+isAndroid); 
	alert('是否是iOS:'+isiOS);
	if(isAndroid){
    
    
		$ ("#choose").attr('capture','camera');
	}
}

Cuando navegamos por la web, verá un cuadro de aviso "Abrir APLICACIÓN" o "Descargar APLICACIÓN" flotando debajo de una página web. Si su teléfono ya ha instalado esta APLICACIÓN, la página web mostrará "Abrir APLICACIÓN". Si no está instalado, aparecerá el mensaje "descargar APP" ¿Cómo se logra esto desde un punto de vista técnico?

JS se da cuenta de hacer clic en la página web para juzgar si debe instalar la aplicación y abrirla; de lo contrario, vaya a la tienda de aplicaciones.

La página h5 evoca la aplicación (iOS y Android), salta a la página de descarga si no está instalada

Supongo que te gusta

Origin blog.csdn.net/fengtingYan/article/details/108530629
Recomendado
Clasificación