整理文档并接入 H5 体验测试链路

miniprogram/pages/webview-test/webview-test.js

@@ -0,0 +1,24 @@
+const WEB_VIEW_TEST_URL = 'https://oss-mbh5.colormaprun.com/gotomars/h5/content-h5-test-template.html'
+
+Page({
+  data: {
+    webViewSrc: '',
+    webViewReady: false,
+  },
+
+  onLoad() {
+    this.setData({
+      webViewSrc: WEB_VIEW_TEST_URL,
+      webViewReady: true,
+    })
+  },
+
+  handleWebViewError() {
+    wx.showModal({
+      title: 'H5 打开失败',
+      content: WEB_VIEW_TEST_URL,
+      showCancel: false,
+      confirmText: '知道了',
+    })
+  },
+})

miniprogram/pages/webview-test/webview-test.json

@@ -0,0 +1,3 @@
+{
+  "navigationBarTitleText": "WebView 测试"
+}

miniprogram/pages/webview-test/webview-test.ts

@@ -0,0 +1,29 @@
+type WebViewTestPageData = {
+  webViewSrc: string
+  webViewReady: boolean
+}
+
+const WEB_VIEW_TEST_URL = 'https://oss-mbh5.colormaprun.com/gotomars/h5/content-h5-test-template.html'
+
+Page<WebViewTestPageData, WechatMiniprogram.IAnyObject>({
+  data: {
+    webViewSrc: '',
+    webViewReady: false,
+  },
+
+  onLoad() {
+    this.setData({
+      webViewSrc: WEB_VIEW_TEST_URL,
+      webViewReady: true,
+    })
+  },
+
+  handleWebViewError() {
+    wx.showModal({
+      title: 'H5 打开失败',
+      content: WEB_VIEW_TEST_URL,
+      showCancel: false,
+      confirmText: '知道了',
+    })
+  },
+})

miniprogram/pages/webview-test/webview-test.wxml

@@ -0,0 +1,11 @@
+<view class="webview-test-page">
+  <view class="webview-test-page__loading" wx:if="{{!webViewReady}}">
+    <view class="webview-test-page__title">H5 测试页加载中</view>
+    <view class="webview-test-page__desc">{{webViewSrc}}</view>
+  </view>
+  <web-view
+    wx:if="{{webViewReady && webViewSrc}}"
+    src="{{webViewSrc}}"
+    binderror="handleWebViewError"
+  ></web-view>
+</view>

miniprogram/pages/webview-test/webview-test.wxss

@@ -0,0 +1,24 @@
+.webview-test-page {
+  height: 100vh;
+  background: #f5f7f8;
+}
+
+.webview-test-page__loading {
+  min-height: 100vh;
+  padding: 120rpx 48rpx;
+  box-sizing: border-box;
+}
+
+.webview-test-page__title {
+  font-size: 40rpx;
+  font-weight: 600;
+  color: #102a24;
+}
+
+.webview-test-page__desc {
+  margin-top: 28rpx;
+  font-size: 24rpx;
+  line-height: 1.6;
+  color: #5a6e68;
+  word-break: break-all;
+}