Merge branch 'feature/miniappJump' into 'release/6.8.1'
Feature/miniapp jump See merge request !1579
Showing
6 changed files
with
148 additions
and
51 deletions
@@ -76,7 +76,8 @@ | @@ -76,7 +76,8 @@ | ||
76 | <link rel="apple-touch-startup-image" href="https://cdn.yoho.cn/h5/forios/startup/startup-orange-5.png" media="screen and (max-device-width: 640px)"> | 76 | <link rel="apple-touch-startup-image" href="https://cdn.yoho.cn/h5/forios/startup/startup-orange-5.png" media="screen and (max-device-width: 640px)"> |
77 | </head> | 77 | </head> |
78 | <body class="{{pageStyle}}{{#if isWechat}} wechat-body{{/if}}{{#if width750}} width750{{/if}}{{#if isPassportPage}} passport-body{{/if}}{{#if isStarIndexPage}} star-index-bg{{/if}}{{#if isStarDetailPage}} star-class-body{{/if}}{{#if isInstallmentPage}}{{#unless notOpen}} installment-body{{/unless}}{{/if}}{{#if @root.isMarsApp}} is-mars-app{{/if}}{{#if @root.isNowApp}} is-now-app{{/if}}"> | 78 | <body class="{{pageStyle}}{{#if isWechat}} wechat-body{{/if}}{{#if width750}} width750{{/if}}{{#if isPassportPage}} passport-body{{/if}}{{#if isStarIndexPage}} star-index-bg{{/if}}{{#if isStarDetailPage}} star-class-body{{/if}}{{#if isInstallmentPage}}{{#unless notOpen}} installment-body{{/unless}}{{/if}}{{#if @root.isMarsApp}} is-mars-app{{/if}}{{#if @root.isNowApp}} is-now-app{{/if}}"> |
79 | - <div class="main-wrap" id="main-wrap" {{#if appPath}}data-apppath='{{{appPath}}}'{{/if}} {{#if miniPath}}data-miniPath='{{{miniPath}}}'{{/if}} {{#if @root.wap.wechat.backDownload}}data-backDownload='{{@root.wap.wechat.backDownload}}'{{/if}}> | 79 | + <div class="main-wrap" id="main-wrap"{{#if appPath}} data-apppath="{{{appPath}}}"{{/if}}{{#if miniPath}} data-miniPath="{{{miniPath}}}"{{/if}}{{#if @root.wap.wechat.miniAutoJump}} data-miniautojump="1"{{/if}}{{#if @root.wap.wechat.backDownload}} data-backDownload="{{@root.wap.wechat.backDownload}}"{{/if}}> |
80 | + | ||
80 | {{#if systemUpdate}} | 81 | {{#if systemUpdate}} |
81 | {{> updata}} | 82 | {{> updata}} |
82 | {{/if}} | 83 | {{/if}} |
@@ -563,6 +563,12 @@ function timedCutProductInit() { | @@ -563,6 +563,12 @@ function timedCutProductInit() { | ||
563 | }); | 563 | }); |
564 | } | 564 | } |
565 | 565 | ||
566 | +function miniProgramHandleInit() { | ||
567 | + if (window.__wxjs_environment === 'miniprogram') { | ||
568 | + require('./miniprogram'); | ||
569 | + } | ||
570 | +} | ||
571 | + | ||
566 | $(function() { | 572 | $(function() { |
567 | if ($('.over').length) { | 573 | if ($('.over').length) { |
568 | // 过期/删除 状态的 活动 | 574 | // 过期/删除 状态的 活动 |
@@ -619,8 +625,10 @@ $(function() { | @@ -619,8 +625,10 @@ $(function() { | ||
619 | timedCutProductInit(); | 625 | timedCutProductInit(); |
620 | 626 | ||
621 | // 小程序相关处理 | 627 | // 小程序相关处理 |
622 | - if (window.__wxjs_environment === 'miniprogram') { | ||
623 | - require('./miniprogram'); | 628 | + if (!window.WeixinJSBridge || !window.WeixinJSBridge.invoke) { |
629 | + document.addEventListener('WeixinJSBridgeReady', miniProgramHandleInit, false); | ||
630 | + } else { | ||
631 | + miniProgramHandleInit(); | ||
624 | } | 632 | } |
625 | 633 | ||
626 | // 商品曝光事件上报 | 634 | // 商品曝光事件上报 |
1 | /* global wx */ | 1 | /* global wx */ |
2 | import $ from 'yoho-jquery'; | 2 | import $ from 'yoho-jquery'; |
3 | import tip from 'js/plugin/tip'; | 3 | import tip from 'js/plugin/tip'; |
4 | +import {transToMiniappPath} from 'js/common/miniapp-path-rules'; | ||
4 | 5 | ||
5 | class LinkHandle { | 6 | class LinkHandle { |
6 | constructor() { | 7 | constructor() { |
@@ -39,58 +40,13 @@ class LinkHandle { | @@ -39,58 +40,13 @@ class LinkHandle { | ||
39 | * 转换为小程序页面地址 | 40 | * 转换为小程序页面地址 |
40 | */ | 41 | */ |
41 | transToPath(href) { | 42 | transToPath(href) { |
42 | - let path = ''; | ||
43 | - let openbyParamsArr = href.split(/openby:yohobuy(=|=)/); | ||
44 | - let paramsStr = openbyParamsArr[openbyParamsArr.length - 1]; | ||
45 | - let paramsObj = {}; | 43 | + let transData = transToMiniappPath(href); |
46 | 44 | ||
47 | - try { | ||
48 | - paramsObj = JSON.parse(paramsStr); | ||
49 | - } catch (error) { | ||
50 | - console.error('paramsStr is: ', paramsStr); | ||
51 | - } | ||
52 | - | ||
53 | - if (paramsObj.action === 'go.productDetail' && paramsObj.params && paramsObj.params.product_skn) { // 商品详情页 | ||
54 | - path = `/pages/goodsDetail/goodsDetail?productSkn=${paramsObj.params.product_skn}&page_name=home`; | ||
55 | - } else if (paramsObj.action === 'go.list') { // 列表页、专区 | ||
56 | - let queryParams = this.transOpenbyParams(paramsObj.params); | ||
57 | - | ||
58 | - path = `/pages/goodsList/goodsList${queryParams}`; | ||
59 | - } else if (paramsObj.action === 'go.poollist') { // 商品池 | ||
60 | - let queryParams = this.transOpenbyParams(paramsObj.params); | ||
61 | - | ||
62 | - path = `/pages/goodsList/productPool${queryParams}`; | ||
63 | - } else if (paramsObj.action === 'go.h5' && paramsObj.params && paramsObj.params.url) { // 活动模板 | ||
64 | - let queryParams = this.transOpenbyParams(paramsObj.params.param); | ||
65 | - let url = `${paramsObj.params.url}${queryParams}`; | ||
66 | - | ||
67 | - path = `/pages/webview/webview?page_name=home&url=${url}`; | ||
68 | - } else if (paramsObj.action === 'go.shop') { // 店铺 | ||
69 | - path = `/pages/goodsList/brandStore?shopId=${paramsObj.params.shop_id}`; | ||
70 | - } else { | 45 | + if (!transData.path) { |
71 | tip.show('暂不支持,请使用Yoho!buy有货APP选购'); | 46 | tip.show('暂不支持,请使用Yoho!buy有货APP选购'); |
72 | } | 47 | } |
73 | 48 | ||
74 | - return path; | ||
75 | - } | ||
76 | - | ||
77 | - /** | ||
78 | - * 转换 openby 参数 | ||
79 | - */ | ||
80 | - transOpenbyParams(params) { | ||
81 | - let paramsArr = []; | ||
82 | - | ||
83 | - if (params && $.isPlainObject(params)) { | ||
84 | - for (let key in params) { | ||
85 | - if (params.hasOwnProperty(key)) { | ||
86 | - paramsArr.push(`${key}=${params[key]}`); | ||
87 | - } | ||
88 | - } | ||
89 | - } else { | ||
90 | - console.info('params is:', params); | ||
91 | - } | ||
92 | - | ||
93 | - return paramsArr.length ? `?${paramsArr.join('&')}` : ''; | 49 | + return transData.path || ''; |
94 | } | 50 | } |
95 | } | 51 | } |
96 | 52 |
@@ -288,6 +288,8 @@ $.extend({ | @@ -288,6 +288,8 @@ $.extend({ | ||
288 | // 尝试打开 APP | 288 | // 尝试打开 APP |
289 | require('./common/open-app'); | 289 | require('./common/open-app'); |
290 | 290 | ||
291 | + // 尝试打开 MINIAPP | ||
292 | + require('./common/open-miniapp'); | ||
291 | }()); | 293 | }()); |
292 | 294 | ||
293 | $header.on('touchstart', 'a', function() { | 295 | $header.on('touchstart', 'a', function() { |
public/js/common/miniapp-path-rules.js
0 → 100644
1 | +const _isPlainObject = (obj) => { | ||
2 | + if (typeof(obj) !== 'object' || obj.nodeType || obj !== null && obj !== undefined && obj === obj.window) { // eslint-disable-line | ||
3 | + return false; | ||
4 | + } | ||
5 | + | ||
6 | + if (obj.constructor && | ||
7 | + !Object.prototype.hasOwnProperty.call(obj.constructor.prototype, 'isPrototypeOf')) { | ||
8 | + return false; | ||
9 | + } | ||
10 | + | ||
11 | + return true; | ||
12 | +}; | ||
13 | + | ||
14 | +const _qsStringfy = (params) => { | ||
15 | + let paramsArr = []; | ||
16 | + | ||
17 | + if (params && _isPlainObject(params)) { | ||
18 | + for (let key in params) { | ||
19 | + if (params.hasOwnProperty(key)) { | ||
20 | + paramsArr.push(`${key}=${params[key]}`); | ||
21 | + } | ||
22 | + } | ||
23 | + } else { | ||
24 | + console.info('params is:', params); | ||
25 | + } | ||
26 | + | ||
27 | + return paramsArr.length ? `?${paramsArr.join('&')}` : ''; | ||
28 | +}; | ||
29 | + | ||
30 | + | ||
31 | +// 有货跳转规则转化为有货精选路由 | ||
32 | +const transToMiniappPath = (href) => { | ||
33 | + let path = ''; | ||
34 | + let openbyParamsArr = href.split(/openby:yohobuy(=|=)/); | ||
35 | + let paramsStr = openbyParamsArr[openbyParamsArr.length - 1]; | ||
36 | + let paramsObj = {}; | ||
37 | + | ||
38 | + try { | ||
39 | + paramsObj = JSON.parse(paramsStr); | ||
40 | + } catch (error) { | ||
41 | + console.error('paramsStr is: ', paramsStr); | ||
42 | + } | ||
43 | + | ||
44 | + switch (paramsObj.action) { | ||
45 | + case 'go.productDetail': // 商品详情页 | ||
46 | + if (paramsObj.params && paramsObj.params.product_skn) { | ||
47 | + path = `/pages/goodsDetail/goodsDetail?productSkn=${paramsObj.params.product_skn}&page_name=home`; | ||
48 | + } | ||
49 | + break; | ||
50 | + case 'go.list': // 列表页、专区 | ||
51 | + path = `/pages/goodsList/goodsList${_qsStringfy(paramsObj.params)}`; | ||
52 | + break; | ||
53 | + case 'go.poollist': // 商品池 | ||
54 | + path = `/pages/goodsList/productPool${_qsStringfy(paramsObj.params)}`; | ||
55 | + break; | ||
56 | + case 'go.h5': | ||
57 | + if (paramsObj.params && paramsObj.params.url) { | ||
58 | + path = `/pages/webview/webview?page_name=home&url=${paramsObj.params.url}${_qsStringfy(paramsObj.params.param)}`; // eslint-disable-line | ||
59 | + } | ||
60 | + break; | ||
61 | + case 'go.shop': | ||
62 | + path = `/pages/goodsList/brandStore?shopId=${paramsObj.params.shop_id}`; | ||
63 | + break; | ||
64 | + default: | ||
65 | + break; | ||
66 | + } | ||
67 | + | ||
68 | + return { | ||
69 | + path: path, | ||
70 | + action: paramsObj.action | ||
71 | + }; | ||
72 | +}; | ||
73 | + | ||
74 | +module.exports = { | ||
75 | + transToMiniappPath | ||
76 | +}; |
public/js/common/open-miniapp.js
0 → 100644
1 | +import {transToMiniappPath} from './miniapp-path-rules'; | ||
2 | + | ||
3 | +const jumpAction = ['go.productDetail', 'go.list', 'go.shop', 'go.poollist']; | ||
4 | +let retry = 6; | ||
5 | + | ||
6 | +function goMiniapp(apppath) { | ||
7 | + retry--; | ||
8 | + | ||
9 | + if (!window.wx) { | ||
10 | + if (retry > 0) { | ||
11 | + setTimeout(function() { | ||
12 | + goMiniapp(apppath); | ||
13 | + }, 300); | ||
14 | + } | ||
15 | + | ||
16 | + return; | ||
17 | + } | ||
18 | + | ||
19 | + let transData = transToMiniappPath(apppath); | ||
20 | + | ||
21 | + if (transData.path && jumpAction.indexOf(transData.action) >= 0) { | ||
22 | + window.wx.miniProgram.redirectTo({url: transData.path}); | ||
23 | + } | ||
24 | +} | ||
25 | + | ||
26 | +function init() { | ||
27 | + if (window.__wxjs_environment !== 'miniprogram') { | ||
28 | + return; | ||
29 | + } | ||
30 | + | ||
31 | + // 添加小程序webview页面标识 | ||
32 | + const bodyClass = 'miniapp-body'; | ||
33 | + const $body = document.getElementsByTagName('body')[0]; | ||
34 | + let classNames = ($body.className || '').split(' '); | ||
35 | + | ||
36 | + if (classNames.indexOf(bodyClass) < 0) { | ||
37 | + classNames.push(bodyClass); | ||
38 | + } | ||
39 | + | ||
40 | + $body.className = classNames.join(' '); | ||
41 | + | ||
42 | + // 自动跳转至小程序对应页面 | ||
43 | + const appInfo = document.getElementById('main-wrap').dataset; | ||
44 | + | ||
45 | + if (appInfo.miniautojump && appInfo.apppath) { | ||
46 | + goMiniapp(appInfo.apppath); | ||
47 | + } | ||
48 | +} | ||
49 | + | ||
50 | +if (!window.WeixinJSBridge || !window.WeixinJSBridge.invoke) { | ||
51 | + document.addEventListener('WeixinJSBridgeReady', init, false); | ||
52 | +} else { | ||
53 | + init(); | ||
54 | +} |
-
Please register or login to post a comment