全部新闻提供最新行业动态,分享前沿设计理念
商品详情页购买跳转到订单确认页的一些关注点
时间:2024-09-22 来源:朝夕友人 点击:

    上次介绍了如何实现订单确认页面的收货地址选择。从上节的代码实现中,我们可以了解到,收货地址的信息是从当前登录用户的收货地址库中获取的。

    当前订单确认页面的开发还剩下两部分,一个是确认订单信息部分,另一个是汇总信息部分。原本计划介绍如何实现确认订单信息部分,但考虑到这部分比较复杂,也是整个电商的核心部分。所以本次不直接上代码了,先要了解一些业务知识。

    首先需要确认订单确认页面中订单的信息是从哪里来的。之前文章中已经提到过,可以在商品详情页点击购买,或者在购物车页面进行结算。在购物车页面进行结算的话,订单确认页面的订单就比较复杂点,用户会买多个商品进行同时下单,订单确认页面就会有多条记录。现在我的网站还未实现购物车,先不看这部分。

    先看下在商品详情页下单的情况。订单确认页中的订单信息,如购买数量,商品规格,配送方式这些都是用户选择的,是从商品详情页带过来的。购买信息被带到确认订单页面的过程通常由前端与后端协作完成。

前端处理

数据收集与封装

用户在商品详情页选择商品属性(如颜色、尺码等)、数量,并可能填写备注信息或选择特定的优惠券。

前端代码负责监听这些交互事件,实时收集用户的选购信息,并将其封装成一个对象或JSON格式的数据结构。

页面跳转与数据传递

前端代码需要将用户的数据保存起来(可以存到URL,前端Storage, Vue的pinia等)。

由于我使用的是vue,所以后面会选择使用pinia进行订单提交状态的管理。

处理

    后端在接收到前端传递的购买信息后,除了之前文章中介绍的为了避免重复下单,需要生成订单号外,还需要进行的验证和计算主要包括以下几个方面:

库存验证

后端需要根据用户选购的商品ID、属性(如颜色、尺码)以及数量,查询当前库存系统,确保有足够的库存来满足用户的购买需求。

如果某个商品的库存不足,后端应返回相应的错误信息,提示用户调整购买数量或选择其他商品。

优惠券/促销活动验证

用户可能在下单时使用了优惠券或参与了特定的促销活动。后端需要根据优惠券代码或活动规则,验证其有效性、适用范围(如最低消费金额、特定商品类别等)以及是否与其他优惠叠加。

验证通过后,计算实际优惠金额并应用到订单总价中。

价格计算

根据用户选购的商品及其数量,结合商品的基础价格、可能存在的会员价、限时折扣等动态价格策略,计算每个商品的实付金额。

对于有阶梯定价(如购买数量越多单价越低)的商品,后端需根据用户购买数量确定适用的单价。

税费计算

根据用户收货地址、商品类型以及当地税收政策,计算订单所需缴纳的各项税费(如增值税、消费税等)。税费可能基于商品原价、折扣后价格或订单总价计算,具体取决于所在地区的法规。

运费计算

根据用户收货地址、商品重量、体积、配送方式(普通快递、加急、大件物流等)以及商家的运费规则(如满额包邮、偏远地区额外收费等),计算订单的运费。

如果用户选择了自提点或门店配送,可能还需要验证自提点的可用性及门店库存情况。

合计金额计算

将上述各项(商品实付金额、优惠金额、税费、运费等)汇总,计算出订单的最终应付金额。

防刷验证

对于异常或高频的下单行为,后端可能需要进行防刷验证,防止恶意用户利用机器人或脚本进行刷单、囤货等操作。

用户余额、积分、红包等抵扣

如果用户账户内有余额、积分、红包等可抵扣金额,后端需要验证其可用性,并计算实际抵扣金额,更新订单总价。

后端完成以上验证和计算后,将处理结果(包括商品详情、总价、优惠信息、税费、运费、可用抵扣项等)打包成JSON格式的数据返回给前端。前端根据这些数据渲染确认订单页面,用户可以查看并确认订单详情,最终提交订单进行支付。这样既保证了订单数据的准确性,又提升了用户体验。

    我的电商网站目前比较简单,很多东西都没有涉及,比如营销,库存,安全等。后续会先把主要的功能实现,然后慢慢地迭代升级。

如果您也有此需求,欢迎咨询我们立即咨询