template.h5.html 3.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <link rel="shortcut icon" type="image/x-icon" href="/static/img/favicon.ico">
  7. <meta name="viewport"
  8. content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  9. <title>
  10. <%= htmlWebpackPlugin.options.title %>
  11. </title>
  12. <script src="/static/common/js/config.js"></script>
  13. <!-- 正式发布的时候使用,开发期间不启用。↓ -->
  14. <script src="/static/common/js/touch-emulator.js"></script>
  15. <script>
  16. TouchEmulator();
  17. </script>
  18. <style>
  19. ::-webkit-scrollbar {
  20. display: none;
  21. }
  22. </style>
  23. <!-- 正式发布的时候使用,开发期间不启用。↑ -->
  24. <script>
  25. var coverSupport =
  26. "CSS" in window &&
  27. typeof CSS.supports === "function" &&
  28. (CSS.supports("top: env(a)") || CSS.supports("top: constant(a)"));
  29. document.write(
  30. '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
  31. (coverSupport ? ", viewport-fit=cover" : "") +
  32. '" />'
  33. );
  34. document.addEventListener('DOMContentLoaded', function () {
  35. document.documentElement.style.fontSize = document.documentElement.clientWidth / 20 + 'px'
  36. })
  37. var u = navigator.userAgent;
  38. var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //android
  39. var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios
  40. function setupWebViewJsBridge(params) {
  41. if (window.WKWebViewJavascriptBridge) {
  42. return params(window.WKWebViewJavascriptBridge);
  43. }
  44. if (window.WKWVJBCallbacks) {
  45. window.WKWVJBCallbacks.push(params);
  46. } else {
  47. window.WKWVJBCallbacks = [params];
  48. }
  49. if (isAndroid) {
  50. if (!window.InjectJavascript) {
  51. window.alert("ERROR: window.InjectJavascript if null!");
  52. return;
  53. }
  54. window.InjectJavascript.init();
  55. } else if (isiOS) {
  56. window.webkit && window.webkit.messageHandlers.h5ToApp.postMessage(params); // 给 ios 传参
  57. }
  58. }
  59. function appToH5(data) {
  60. let obj = JSON.parse(data)
  61. for (const key in obj) {
  62. if (obj.hasOwnProperty(key)) {
  63. window[key] = obj[key];
  64. }
  65. }
  66. }
  67. function insideH5ToApp(params) {
  68. setupWebViewJsBridge(isiOS ? JSON.stringify(params) : function (bridge) {
  69. bridge.callHandler("h5ToApp", {key: params.key}, function (data) {
  70. typeof window[params.void] === 'function' && window[params.void](data)
  71. })
  72. })
  73. }
  74. isAndroid && setupWebViewJsBridge(function (bridge) {
  75. bridge.registerHandler("appToH5", function (data, callback) {
  76. appToH5(JSON.stringify(data));
  77. })
  78. });
  79. window.insideH5ToApp = insideH5ToApp; // 自己调用
  80. window.appToH5 = appToH5;
  81. </script>
  82. <link rel="stylesheet" href="<%= BASE_URL %>static/index.css"/>
  83. </head>
  84. <body>
  85. <!-- 该文件为 H5 平台的模板 HTML,并非应用入口。 -->
  86. <!-- 请勿在此文件编写页面代码或直接运行此文件。 -->
  87. <!-- 详见文档:https://uniapp.dcloud.io/collocation/manifest?id=h5-template -->
  88. <noscript>
  89. <strong>本站点必须要开启JavaScript才能运行</strong>
  90. </noscript>
  91. <div id="app"></div>
  92. <!-- built files will be auto injected -->
  93. <script>
  94. /*BAIDU_STAT*/
  95. </script>
  96. </body>
  97. </html>