欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

微信小程序之简单商城部分功能总结

程序员文章站 2024-02-26 17:48:58
...

前段时间,突然接到公司得一个需求,叫我去做一个微信小程序得开发,类似一个商城的开发,然后基本看了看微信小程序的开发文档就着手开始做了,为了节约前端一些基本布局啥的,在某宝1.99买了个框架快速搭建了前端的静态页面。最近项目也上线测试运营,大家也可以在小程序关注“GEED智掂商城”帮小白提些问题,全套自己一个人开发,有些地方可能没考虑到,欢迎指出,然后写这篇博客也是自己对这个项目一些总结和归纳。
首先类似商城可能重要点的就是下单这块得逻辑了,一开始是借助第三方提供基于云开发得支付接口去做,但发现有的时候响应会失败,甚至会无反应,所以还是觉得不懒了,自己写把。然后几个功能点,做个记录,健忘怕忘。

关于支付:

首先我们找到一个微信发起调用微信支付得接口:
微信小程序之简单商城部分功能总结
做过微信支付得小伙伴肯定能记得这个prepay_id,这也就是说我们必须去搭服务器做支付接口,去得到一些返回值,再作为参数来传递到wx.requestpayMent(),我们再看看支付接口的文档:
对于普通商户,微信提供一下接口:
微信小程序之简单商城部分功能总结
微信小程序之简单商城部分功能总结
所以想要在小程序中发起支付,必须通过该接口发起预支付的交易单,特别注意二个字段,和其他类型支付接口不同,trade_typeopenid,一开始没注意,就当以前做过的来处理了 ,然后。。。(ps:不说了,都是累 啊),
微信小程序之简单商城部分功能总结
然后剩下的下单扣库存的,使用redis+分布式锁,具体实现百度一大堆。支付这块大概就这样把。

关于物流:

物流的话,说到这个我不得不吐槽一下,按照物流助手我做了相关接口出来,打印助手死都捕捉不到订单信息,最后不得不转快递管家。然后快递管家我们需要的是根据电子面单信息将用户下单信息推送到快递管家,再由快递管家发货打印,生成运单。那么问题来了,如果要查询物流信息是不是要有运单号,而运单号是在快递管家中生成,所以我决定手动填写运单号吧,相当于手动发货了,麻烦就麻烦把,毕竟咱一个人开发,开发周期得延长到什么时候啊,这些就不说了。来看看接口文档:
微信小程序之简单商城部分功能总结
因为我这边采用的是中通自己得api,也就是对请求得封装了,
微信小程序之简单商城部分功能总结
应该可以注意到测试环境得companyid和key是提供的,可是我死活没测通这test,然后我问他们得技术,哪里出问题了,因为报错信息是他们后端报错异常,我们调用没法知道异常具体是啥,然后他告诉我签名有问题,然后我仔细看签名:
微信小程序之简单商城部分功能总结
我理解得是里面有对签名生成传递得,而且我之前还特意看了源码
然后我又看了看他封装得zopClient,我确定是有封装得
微信小程序之简单商城部分功能总结
总之最后还是完成得效果是当用户下单成功,将订单信息推送到快递管家,商户打印快递单,发货单,获取运单号在后台进行一键发货。然后根据运单id获取到物流轨迹:
微信小程序之简单商城部分功能总结

关于定时器:

效果图:
微信小程序之简单商城部分功能总结
微信小程序之简单商城部分功能总结
给个思路把 ,大概就是获取当前订单创建时间和现在得时间得时间戳,然后再对比自己设定的有效时间。当时间戳大于有效期就判断用户放弃该订单,然后对该订单进行处理,我这边是进行一个删除操作。然后对定时器得定义大概一秒刷新一次,但一定要注意,这个不是单个得定时任务,而定时器每启动一次返回得number都是不一样的,我当时借鉴得是一个单个定时任务,而我这里采用多个定时器,对多个订单进行异步得倒计时功能。代码贴出来:

//定时器
  timer() {
    let timeInterval = 30; //fen
   // console.log(new Date());
    let nowTime = Date.parse(new Date());
    let countDownArr = [];
    var differ = 0;
    var that = this;
    this.data.createTimeList.forEach(function(item, index) {
      let createdTime = Date.parse(new Date(item.createTime.replace(/-/g,'/')));
      var TIME = 1000 * 60 * timeInterval;
      // 目标时间和当前时间的毫秒数
     // console.log(createdTime);
      var differ = nowTime - createdTime;
    //  console.log(differ);
      // 剩余时间的秒数
      differ = TIME - differ;
      // 目标时间超过当前时间,或目标时间与当前时间的差超过30分钟则返回0
      if (differ < 0) {
        //过期处理
        //删除该时间节点
        that.data.createTimeList.splice(index, 1);
        //console.log(that.data.timerInvalList);
        //过期删除
         that.deleteOrder(item.orderId);
         //取消当前定时
        clearTimeout(that.data.timerInvalList[index+1]);
        
         //删除当前定时节点
        that.data.timerInvalList.splice(index+1, 1);
        
      } else {
        // 计算分钟数
        var minute = Math.floor(differ / (60 * 1000));
        minute = minute < 10 ? '0' + minute : minute;
        // 计算秒数
        var second = Math.floor((differ - minute * (60 * 1000)) / 1000);
        second = second < 10 ? '0' + second : second;
        // 返回结果格式 29:59
        var str = minute + ':' + second;
        var obj = {
          orderId: item.orderId,
          timedate: str
        }
        countDownArr.push(obj);
      }
    });
    // 渲染,然后每隔一秒执行一次倒计时函数
    this.setData({
      dateData: countDownArr
    })
    var timerInval = setTimeout(this.timer, 1000);
    this.data.timerInvalList.push(timerInval);
    this.setData({
      timerInvalList: this.data.timerInvalList
    })
  },

其中这个createTime.replace(/-/g,’/’)是对ios得一个兼容修改的,之前直接获取createTime没做处理上线体验就出了NaN。你懂的。大概这么多吧 ,其他在开发文档能看懂得就不说了。差不多也就说到这里,好好准备面试了,生活太难了。
欢迎各位大佬吐槽,有些不对的地方欢迎指出。

一个在互联网苟且偷生的小白

相关标签: 小程序 java