微信商城小程序开发文档，手把手教你从零搭建完整项目

打开微信，点进小程序，搜个“商城”关键词，你会发现从服装鞋帽到生鲜水果，几乎每个商家都在抢这块屏幕。我自己试过几家，有的页面卡得像十年前的老网站，有的下单流程绕得你怀疑人生。但真正让我上头的，是那些体验流畅、设计干净的小店——它们背后，都有一套靠谱的开发文档撑着。今天我就手把手带你从零搭一个微信商城小程序，不扯虚的，直接上干货。

第一步，你得搞清楚自己的“货”和“客”到底是什么。别一上来就想着代码怎么写，先拿张纸画清楚：你到底卖什么？是实体商品还是虚拟服务？目标用户是年轻人还是中老年？我有个朋友开水果店，小程序上线前，他花了一周拍产品图、写文案，结果上线后用户反馈说“图太美，实物有点差距”。所以，明确商品属性和用户预期，比写代码更重要。你可以在微信公众平台注册一个小程序账号，选“电商”类目，然后准备营业执照、银行账户这些材料。这一步大概花半小时，但别急，后面才是重头戏。

注册完账号，你会在后台看到一个“开发”选项卡。这里有个关键点：小程序不是纯H5页面，它有自己的框架和组件。你得像搭积木一样，把页面拆成一个个模块。比如首页，得放轮播图、商品列表、搜索框、分类导航。我建议你从“商品详情页”开始写，因为这个页面最核心，用户点进来就是为了看价格、规格、评价。用微信开发者工具新建一个项目，选择“小程序”模板，然后打开`pages/goods/index`文件夹，先写一个静态的HTML结构：标题、图片、价格、购买按钮。注意，价格要显示“¥”符号，别写错了。

写静态页面时，别急着加花哨的动画。先把数据绑定做好。比如商品价格，你得在`data`里定义一个`price`变量，然后在模板里用`{{ price }}`渲染。这样，以后价格变了，你只需要改数据，页面自动更新。我见过太多新手一上来就写死价格，结果上架后改价改了十几次，每次都得重新发布代码。数据绑定是微信小程序的生命线，你可以在`app.json`里配置所有页面路径，确保每个页面都能访问到全局数据。比如用户信息、购物车状态，这些放`app.js`里，其他页面直接引用。

接下来，你要处理最头疼的支付环节。微信支付不像支付宝那样一键接入，它需要你配置商户号、API密钥、回调地址。你在微信支付后台申请商户号后，得把`mch_id`和`key`写到后端代码里。前端调起支付时，得先调用微信的`wx.requestPayment`接口，传入`timeStamp`、`nonceStr`、`package`、`signType`和`paySign`。这几个参数别弄混了，我见过有人把`timeStamp`写成`timestamp`，结果支付失败。更坑的是，测试环境你没法用真实支付，得用沙箱环境。你可以在微信支付文档里找到沙箱地址，模拟下单流程，确保整个链路通顺。

支付成功后，用户的订单状态得实时更新。你可以在数据库里建一个`orders`表，字段包括`order_id`、`user_id`、`total_fee`、`status`。当支付回调通知到你的服务器时，立马更新`status`为“已支付”。同时，小程序端也得监听这个变化。比如用户支付后，弹出一个“支付成功”的Toast，然后跳转到订单详情页。这里有个小技巧：用`wx.setStorageSync`缓存用户最近订单，这样用户打开页面能秒加载，不用每次都请求网络。我自己的项目里，缓存策略帮我把接口请求量减少了30%。

页面写好了，支付通了，但别急着上线。你得先做一轮内测。拉几个朋友进来，让他们像真实用户一样操作。重点测试三个场景：商品浏览是否流畅，加入购物车后价格计算是否正确，下单后订单状态变化是否及时。我测试时发现，有用户连续点两次“立即购买”按钮，结果生成了两个重复订单。后来我在前端加了防抖处理：按钮点击后立马禁用，等支付结果返回再启用。还有，商品库存你得实时扣减，别让用户支付成功却显示“库存不足”。这些细节，文档里不会写，但踩过坑的人都懂。

最后一步，把小程序提交审核。微信审核一般是1-3天，但如果你卖的是食品、化妆品这些特殊类目，得提前提交资质证明。审核不通过怎么办？别慌，看驳回理由。常见的问题是“页面内容不完整”或“支付功能未接入”。我有个朋友因为首页轮播图里放了一张没有版权的图片，被驳回了三次。所以，所有图片、文案都要确保原创或已授权。审核通过后，你可以在后台设置“灰度发布”，先让10%的用户体验新版本，没问题再全量发布。这样即使有bug，影响面也小。

从注册账号到上线运营，我搭这个商城小程序用了两周。最耗时的不是写代码，而是调试支付和订单流程。但当你看到第一笔真实订单进来时，那种成就感比喝十杯咖啡还提神。记住，文档是死的，但你的项目是活的。别死磕文档，多动手试错，多跟用户聊，你会发现，微信商城小程序没那么玄乎。现在，打开你的微信开发者工具，开始写第一行代码吧。