站长论坛

 找回密码
 注册
查看: 260|回复: 0

人人商城打包APP教程方法附带源码 解决无法弹出微信支付

[复制链接]
发表于 2022-4-1 13:06:56 | 显示全部楼层 |阅读模式
打包app介绍

众所周知,人人商城是一款很好的商城系统,且人人商城功能全面,本教程使用hbuilder技术对人人商城进行打包,是对人人商城的二开,借助hbuilder的打包技术和html5plus接口,实现看了原生支付。\

软件架构

在微信支付和支付宝支付的官方php demo上进行改造。并重写了h5app.js的代码,让人人商城打包app 支持安卓微信支付宝支付,同时支持ios的支付宝支付。(IOS微信支付也支持 但需要你上架IOS。)
安装教程

在gitee下载源码

将整个pay文件夹拷贝至 :你的微擎目录/addons/ewei_shopv2/core/mobile 文件夹下。确保路径正确。

将static文件夹,拷贝至 :你的微擎目录/addons/ewei_shopv2 确保路径正确,应该是会替换掉 你的微擎目录/addons/ewei_shopv2/static/js/app/biz 下面的原有的H5app.js
使用说明

在拷贝安装之前,你应该首先申请微信支付宝 appID和 微信支付的一些账号,并在微擎后台配置好参数。具体请见后端支付文件说明

使用hbuilder 打包

HBuilderX,下载地址:http://www.dcloud.io/下载完整APP开发版

下载并安装HBuilderX后,打开编辑器,点击右上角选择:文件 -> 新建 -> 项目选择wap2app,

     

    打开hbuilder后选择文件,新建 ,项目 ,项目类型选择 wap2app

    项目名词填写你app的名字,wap站首页网址。输入你的移动端网站网址即可。 应该是这样的格式 XXXXX.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile xxx替换成你的网站域名。如果不会请参考hbuilder官方文档

这样,manifest.json文件就配置完成了接下来,打包app,安卓请使用安卓自有证书,苹果请使用苹果证书。点击HBuilder: 发行 -> 原生App-云端打包



可以参考hbuilder官网文档对 sitemap.json 继续优化,优化加载速度等。下面提供我开发的示例代码。注意,url要替换成自己的url。。

  1. {
  2.         "global": {
  3.                 "webviewParameter": {
  4.                         "titleNView": {
  5.                                 "autoBackButton": true,
  6.                                 "backgroundColor": "#f7f7f7", //导航栏背景色
  7.                                 "titleColor": "#000000", //标题颜色
  8.                                 "titleSize": "17px"
  9.                         },
  10.                         "statusbar": {
  11.                                 //系统状态栏样式(前景色)
  12.                                 "style": "dark"
  13.                         },
  14.                         "appendCss": "",
  15.                         "appendJs": ""
  16.                 },
  17.                 "easyConfig": {
  18.                         "quit": {
  19.                                 "toast": {
  20.                                         "showFeedback": false //不显示“反馈意见”链接,默认为true  
  21.                                 }
  22.                         },
  23.                         "open": {
  24.                                 "animation": { //窗口切换动画配置  
  25.                                         "type": "slide-in-right", //窗口动画类型  
  26.                                         "duration": 90 //窗口动画执行时
  27.                                 }
  28.                                 // "waiting" // 禁用waiting,打开page1页面时,不显示waiting等待框  
  29.                         }

  30.                 }
  31.                        
  32.         },
  33.         "pages": [{
  34.                         "webviewId": "__W2A__url.com", //首页
  35.                         "matchUrls": [{
  36.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile"
  37.                         }],
  38.                         "webviewParameter": {
  39.                                 "titleNView": false,
  40.                                 "statusbar": {
  41.                                         "background": "#fdd108"
  42.                                 }
  43.                                 // "pullToRefresh": {
  44.                                  
  45.                                 // "support": true,
  46.                                  
  47.                                 // "style": "circle",  //设置ios与安卓下拉统一为圈圈
  48.                                  
  49.                                 // "color": "#dea00e",  //下拉圈圈颜色
  50.                                  
  51.                                 // "offset": "9px"  //下拉圈圈出现的位置
  52.                                  
  53.                                 // }  
  54.                         },
  55.                         "easyConfig": {
  56.                                 "back": {
  57.                                         "before": [
  58.                                                 {
  59.                                                         "popupSelector": ".hisContent",  // 弹出层dom选择器
  60.                                                         "closeSelector": ".hisTitle"
  61.                                                        
  62.                                                 }
  63.                                         ]
  64.                                 }
  65.                         }
  66.                 },
  67.                 {
  68.                         "webviewId": "category", //首页
  69.                         "matchUrls": [{
  70.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=shop.category"
  71.                         }, {
  72.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=shop.category"
  73.                         }],
  74.                         "webviewParameter": {
  75.                                 "titleNView": false,
  76.                                 "statusbar": {
  77.                                         "background": "#f7f7f7"
  78.                                 }
  79.                         }
  80.                 },
  81.                 {
  82.                         "webviewId": "member", //会员中心
  83.                         "matchUrls": [{
  84.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=member"
  85.                         }, {
  86.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=member"
  87.                         }],
  88.                         "webviewParameter": {
  89.                                 "titleNView": false,
  90.                                 "statusbar": {
  91.                                         "background": "#fdd108"
  92.                                 }
  93.                         }
  94.                 },
  95.                 {
  96.                         "webviewId": "goodes", //商户页?
  97.                         "matchUrls": [{
  98.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=goods&merchid=*"
  99.                         }, {
  100.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=goods&merchid=*"
  101.                         }],
  102.                         "webviewParameter": {
  103.                                 "titleNView": false,
  104.                                 "statusbar": {
  105.                                         "background": "#fdd108"
  106.                                 }
  107.                         }
  108.                 },
  109.                 {
  110.                         "webviewId": "goods", //商品页
  111.                         "matchUrls": [{
  112.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=goods.detail&id=*"
  113.                         }, {
  114.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=goods.detail&id=*"
  115.                         }],
  116.                         "webviewParameter": {
  117.                                 "titleNView": false,
  118.                                 "statusbar": {
  119.                                         "background": "#fdd108"
  120.                                 }
  121.                         },
  122.                         "easyConfig": {
  123.                                 "back": {
  124.                                         "before": [
  125.                                                 {
  126.                                                         "popupSelector": ".picker-modal",  // 弹出层dom选择器
  127.                                                         "closeSelector": ".icon-guanbi1"
  128.                                                        
  129.                                                 }
  130.                                         ]
  131.                                 }
  132.                         }
  133.                 },
  134.                 {
  135.                         "webviewId": "kefu", //首页
  136.                         "matchUrls": [{
  137.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=open_messikefu"
  138.                         }, {
  139.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=open_messikefu"
  140.                         }],
  141.                         "webviewParameter": {
  142.                                 "titleNView": {

  143.                                         "autoBackButton": true,
  144.                                         "backgroundColor": "#f7f7f7", //导航栏背景色
  145.                                         "titleText": "在线客服",
  146.                                         "titleColor": "#000000", //标题颜色
  147.                                         "titleSize": "17px"
  148.                                 },
  149.                                 "statusbar": {
  150.                                         "background": "#f7f7f7"
  151.                                 }
  152.                         },
  153.                         "easyConfig":{  
  154.             "back":{  
  155.                 "history":false //不允许执行history.back  
  156.             }  
  157.                         }  
  158.                 },
  159.                 {
  160.                         "webviewId": "kefugoods", //首页
  161.                         "matchUrls": [{
  162.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=open_messikefu*"
  163.                         }, {
  164.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=open_messikefu*"
  165.                         }],
  166.                         "webviewParameter": {
  167.                                 "titleNView": {
  168.                
  169.                                         "autoBackButton": true,
  170.                                         "backgroundColor": "#f7f7f7", //导航栏背景色
  171.                                         "titleText": "在线客服",
  172.                                         "titleColor": "#000000", //标题颜色
  173.                                         "titleSize": "17px"
  174.                                 },
  175.                                 "statusbar": {
  176.                                         "background": "#f7f7f7"
  177.                                 }
  178.                         },
  179.                         "easyConfig":{  
  180.                     "back":{  
  181.                         "history":false //不允许执行history.back  
  182.                     }  
  183.                         }  
  184.                 },
  185.                 {
  186.                         "webviewId": "address", //地址选择
  187.                         "matchUrls": [{
  188.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=member.address.selector"
  189.                         }, {
  190.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=member.address.selector"
  191.                         }],
  192.                         "webviewParameter": {
  193.                                 "titleNView":false,
  194.                                 "statusbar": {
  195.                                         "background": "#f7f7f7"
  196.                                 }
  197.                         }
  198.                 },
  199.                 {
  200.                         "webviewId": "ordercreate", //单规格确认订单
  201.                         "matchUrls": [{
  202.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=order.create&id=*&optionid=*&total=*&giftid&liveid=*"
  203.                         }, {
  204.                                
  205.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=order.create&id=*&optionid=*&total=*&giftid&liveid=*"
  206.                         }],
  207.                         "webviewParameter": {
  208.                                 "titleNView":false,
  209.                                 "statusbar": {
  210.                                         "background": "#f7f7f7"
  211.                                 }
  212.                         }
  213.                 },
  214.                 {
  215.                         "webviewId": "ordercreates", //多规格确认订单
  216.                         "matchUrls": [{
  217.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=order.create&id=*&iswholesale=*&buyoptions=*"
  218.                         }, {
  219.                                
  220.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=order.create&id=*&iswholesale=*&buyoptions=*"
  221.                         }],
  222.                         "webviewParameter": {
  223.                                 "titleNView":false,
  224.                                 "statusbar": {
  225.                                         "background": "#f7f7f7"
  226.                                 }
  227.                         }
  228.                 },
  229.                 {
  230.                         "webviewId": "diypage", //DIY活动页
  231.                         "matchUrls": [{
  232.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=diypage&id=*"
  233.                         }, {
  234.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=diypage&id=*"
  235.                         }],
  236.                         "webviewParameter": {
  237.                                 "titleNView": {
  238.                                         "titleText": "",
  239.                                         "type": "transparent"
  240.                                 },
  241.                                 "statusbar": {
  242.                                         "background": "#f7f7f7"
  243.                                 }
  244.                         }
  245.                 },
  246.                 {
  247.                         "webviewId": "addresspost", //默认地址
  248.                         "matchUrls": [{
  249.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=member.address"
  250.                         }, {
  251.                                 "href": "http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=member.address"
  252.                         }],
  253.                         "webviewParameter": {
  254.                                 "titleNView": false,
  255.                                 "statusbar": {
  256.                                         "background": "#f7f7f7"
  257.                                 }
  258.                         }
  259.                 },
  260.                 {
  261.                         "webviewId": "addressadd", //新增地址
  262.                         "matchUrls": [{
  263.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=member.address.post*"
  264.                         }, {
  265.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=member.address.post*"
  266.                         }],
  267.                         "webviewParameter": {
  268.                                 "titleNView": false,
  269.                                 "statusbar": {
  270.                                         "background": "#f7f7f7"
  271.                                 }
  272.                         }
  273.                 },
  274.                 {
  275.                         "webviewId": "payok", //新增地址
  276.                         "matchUrls": [{
  277.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=order.pay.success&id=*&result=true"
  278.                         }, {
  279.                                 "href": "W:http://url.com/app/index.php?i=1&c=entry&m=ewei_shopv2&do=mobile&r=order.pay.success&id=*&result=true"
  280.                         }],
  281.                         "webviewParameter": {
  282.                                 "titleNView": false,
  283.                                 "statusbar": {
  284.                                         "background": "#f7f7f7"
  285.                                 }
  286.                         }
  287.                 },
  288.                 {
  289.                         "webviewId": "common",
  290.                         "matchUrls": [{
  291.                                 "hostname": "R:.",
  292.                                 "pathname": "R:."
  293.                         }],
  294.                         "webviewParameter": {
  295.                                 "titleNView": false,
  296.                                 "statusbar": {
  297.                                         "style": "dark",
  298.                                         "background": "#F7F7F7"
  299.                                 }
  300.                         },
  301.                         "easyConfig": {
  302.                                 "quit": {
  303.                                         "toast": {
  304.                                                 "showFeedback": false
  305.                                         }
  306.                                 }
  307.                         }
  308.                 }
  309.         ]
  310. }
复制代码


app.js也需要配置
  1. App({
  2.         options: {
  3.                 debug: true
  4.         },
  5.         /**
  6.          * 当wap2app初始化完成时,会触发 onLaunch
  7.          */
  8.         onLaunch: function() {
  9.                 console.log('launch');
  10.                 var ws = plus.webview.currentWebview();
  11.                 console.log(ws.getURL())
  12.         },
  13.         /**
  14.          * 当wap2app启动,或从后台进入前台显示,会触发 onShow
  15.          */
  16.         onShow: function() {
  17.                 console.log('show');
  18.                 delete wap2app.quit
  19.         },
  20.         /**
  21.          * 当wap2app从前台进入后台,会触发 onHide
  22.          */
  23.         onHide: function() {
  24.                 console.log('hide');
  25.         }
  26. });
  27. Page('__W2A__url.com', { //首页扩展配置

  28.         onShow: function() {
  29.                 var ws = plus.webview.currentWebview();
  30.                 console.log(ws.getURL())
  31.                  ws.addEventListener('backbutton', function() {console.log(123) })
  32.         },

  33.         onClose: function() {

  34.         }
  35. });
  36. Page('kefu', { //首页扩展配置
  37.         onShow: function() {
  38.                 console.log('kefu')
  39.         },
  40.         onClose: function() {
  41. console.log('kefuback')
  42.         }
  43. });
  44. Page('member', { //首页扩展配置
  45.         onShow: function() {
  46.                 var ws = plus.webview.getWebviewById('member');
  47.                 setTimeout(function() {
  48.                         ws.beginPullToRefresh();
  49.                 }, 60000);
  50.         },
  51.         onClose: function() {

  52.         }
  53. });
  54. Page('sousuo', { //首页扩展配置
  55.         onShow: function() {
  56.                 console.log(123)
  57.         },
  58.         onClose: function() {

  59.         }
  60. });
  61. Page('address', { //地址选择
  62.         onShow: function() {
  63.                 var wv = plus.webview.currentWebview();  
  64.                 var _reject = function(event) {  
  65.                     var _url = event.url;  
  66.                     var o = plus.webview.create(_url,'id',{  
  67.                         titleNView:{  
  68.                             titleText:true,  
  69.                             autoBackButton:true  
  70.                         }  
  71.                     });  
  72.                     o.show('slide-in-right');  
  73.                 };  
  74.                 wv.overrideUrlLoading({  
  75.                     mode: 'reject'  
  76.                 }, _reject);
  77.                 console.log('禁止一直刷新')
  78.                
  79.                
  80.         },
  81.        
  82.         onClose: function() {
  83.                 console.log('reload')
  84.        
  85.         var ordercreates = plus.webview.getWebviewById('ordercreates');
  86.         ordercreates.reload(true)
  87.         }
  88. });
  89. Page('addresspost', { //默认地址
  90.         onShow: function() {
  91.                 var wv = plus.webview.currentWebview();  
  92.                 var _reject = function(event) {  
  93.                     var _url = event.url;  
  94.                     var o = plus.webview.create(_url,'id',{  
  95.                         titleNView:{  
  96.                             titleText:true,  
  97.                             autoBackButton:true  
  98.                         }  
  99.                     });  
  100.                     o.show('slide-in-right');  
  101.                 };  
  102.                 wv.overrideUrlLoading({  
  103.                     mode: 'reject'  
  104.                 }, _reject);
  105.                 console.log('禁止一直刷新')
  106.                
  107.                
  108.         },
  109.        
  110.         onClose: function() {
  111.                 console.log('reload')
  112.         var ordercreate = plus.webview.getWebviewById('ordercreate');
  113.         var ordercreates = plus.webview.getWebviewById('ordercreates');
  114.         ordercreate.reload(true)
  115.         ordercreates.reload(true)
  116.         }
  117. });

  118. Page('addressadd', { //新增地址
  119.         onShow: function() {
  120.                 var wv = plus.webview.currentWebview();  
  121.                 var _reject = function(event) {  
  122.                     var _url = event.url;  
  123.                     var o = plus.webview.create(_url,'id',{  
  124.                         titleNView:{  
  125.                             titleText:true,  
  126.                             autoBackButton:true  
  127.                         }  
  128.                     });  
  129.                     o.show('slide-in-right');  
  130.                 };  
  131.                 wv.overrideUrlLoading({  
  132.                     mode: 'reject'  
  133.                 }, _reject);
  134.                 console.log('禁止一直刷新')
  135.                
  136.                
  137.         },
  138.        
  139.         onClose: function() {
  140.                 console.log('reload')
  141.         var ordercreate = plus.webview.getWebviewById('ordercreate');
  142.         var ordercreates = plus.webview.getWebviewById('ordercreates');
  143.         ordercreate.reload(true)
  144.         ordercreates.reload(true)
  145.         }
  146. });
  147. Page('payok', { //首页扩展配置
  148.         onShow: function() {
  149.                 var webview = plus.webview.currentWebview()
  150.                 plus.key.addEventListener('backbutton', function() {
  151.                         return false
  152.                 })
  153.         },
  154.         onClose: function() {

  155.         }
  156. });
复制代码


以上代码主要是解决了 有些页面无限刷新的BUG

以上步骤完成,选择hbuilder 菜单栏里的 发型 选择原生app -云打包 进行打包

注意打包时 一定要选择 使用自有证书, 按钮旁边有链接 可以去看怎么生成。 以及一定要设定一个应用包名 记下来,这对微信支付很重要!

打开微信开放平台,然后输入刚刚设置的包名,以及去下载一个app签名获取工具,把刚刚证书的签名获取一下,填进去 要不然是用不了微信支付的!
您需要登录后才可以回帖 登录 | 注册

本版积分规则

关闭

站长推荐上一条 /2 下一条

快速回复 返回顶部 返回列表