通过JavaScript加载iOS'智能应用横幅'

Question

我在iOS智能应用横幅上遇到了一些麻烦,我正试图通过JavaScript添加它.

实际的smartbanner就像将这个小块添加到HTML的头部一样简单:

<meta name="apple-itunes-app" content="app-id=1008622954">

不幸的是,我对上传脚本的方式非常有限.我无法直接更改HTML,因此我将通过我们的标记管理器来完成,它基本上是通过JavaScript完成的.但事实证明这不起作用.

我试图简化测试的情况:

1. HTML中的硬编码标签:有效(如预期的那样)

   <meta name="apple-itunes-app" content="app-id=1008622954">
   

2. 在文档准备就绪时直接插入JavaScript:有效

   $(document).ready(function(){
       $("head").append('<meta name="apple-itunes-app" content="app-id=1008622954">');
   });
   

3. 插入JavaScript后,setTimeout延迟:不工作

   $(document).ready(function(){
       setTimeout(showBanner, 1);  //after 1 millisecond
   });
   
   function showBanner(){
       $("head").append('<meta name="apple-itunes-app" content="app-id=1008622954">');
   }
   

任何人都可以确认或解释为什么这个延迟的JavaScript不起作用？

重要提示:测试在实际的iOS设备上打开页面!桌面Safari/Chrome或iOS模拟器无法使用.此外,请勿关闭横幅,因为它不会再次出现.

更新:

我添加了一些没有jQuery的例子,所以简单的'ol JavaScript.但结果是一样的.一旦我们等待setTimeout()智能应用程序横幅无法加载.

5. Vanilla JavaScript - 直接执行.作品

   showBanner();
   
   function showBanner() {
       var meta = document.createElement("meta");
       meta.name = "apple-itunes-app";
       meta.content = "app-id=1008622954";
       document.head.appendChild(meta);
   }
   

6. Vanilla JavaScript - 延迟执行.什么都不行

   setTimeout(showBanner, 1);
   
   function showBanner() {
       var meta = document.createElement("meta");
       meta.name = "apple-itunes-app";
       meta.content = "app-id=1008622954";
       document.head.appendChild(meta);
   }
   

更新2:

异步加载脚本时可以观察到完全相同的不幸行为

7. 异步加载.什么都不行

   <script src="async.js" async></script>
   

   然后使用直接执行showBanner()调用相同的vanilla JavaScript;

   function showBanner() {
       var meta = document.createElement("meta");
       meta.name = "apple-itunes-app";
       meta.content = "app-id=1008622954";
       document.head.appendChild(meta);
   }
   

结论:

我只能得出结论,iOS Safari只在主线程中查找smartbanner和HTML.这让我伤心:-(

只有直接可用的HTML或通过JavaScript同步添加的HTML.但是不允许进行同步操作,无论是异步加载JavaScript,还是使用setTimeout()(或使用其他构造eval())

Answer 1

由于如果在页面加载后插入本机横幅，则不可能让 safari 显示本机横幅（如上所述，并由苹果确认），因此唯一可行的解​​决方法是不使用本机 smartbanner，而是创建自己的 smartbanner。

例如，使用这样的javascript 插件