“鞋之城”微信小程序的设计与开发

摘要：随着现如今生活水平和文明程度的以及消费能力的提高，人们对鞋类要求也越来越高。“鞋之城”购物微信小程序的设计与实现主要基于微信平台实现与大流量用户的线上连接。本课题基于微信小程序优点在占用资源比较小、运行便捷、操作简单,相比传统的手机应用APP有着比较大的优势。
本课题研究“鞋之城”购物微信小程序开发的设计与实现，主要有以下几点意义：
小程序操作便捷。随着人们生活水平和文明程度的提高，人们对于精致的生活要求也越来越高，鞋子作为人们生活中必不可少的一部分。如何选择成为一个不可逃脱的问题。“鞋之城”购物微信小程序操作简单，主题明确并且用户可通过微信直接使用，不需要安装APP，使用界面和简洁。让使用者能更快找到心仪的商品。
微信用户的基数大，小程序开发难度低。对于开发者来说，微信小程序开发门槛相对较低,开发难度较小。相对APP来说，小程序大大节省了开发成本。
鞋类市场需求大，用户需求越来越高，不仅仅局限于外表，舒适度和质量也成为选择标准。
现如今许多鞋子经过品牌包装宣传，让鞋子价格不断高涨，鞋子本身价值完全不能和价格对等，很多厂家鞋子质量过关可是苦无宣传不能销售出去。通过此小程序可以让人们购买到这些物美价廉的鞋子。

关键词：微信小程序 网上购物 鞋

Design and development of city of shoes wechat applet

      Student:Pengqian          Instructor:Zhangchong                     

Abstract： With the improvement of living standard, civilization and consumption ability, people have higher and higher requirements for shoes. The design and implementation of “city of shoes” shopping wechat app is mainly based on wechat platform to realize online connection with large flow users. This topic is based on the advantages of wechat app, such as small resource occupation, convenient operation and simple operation. Compared with the traditional mobile app, it has great advantages.
This paper studies the design and implementation of “city of shoes” shopping wechat small program development, mainly has the following significance:
The small program is easy to operate. With the improvement of people’s living standards and civilization, people have higher and higher requirements for exquisite life. Shoes are an indispensable part of people’s life. How to choose has become an unavoidable problem. The “city of shoes” shopping wechat app is easy to operate, has a clear theme, and users can use it directly through wechat without installing app, and has a simple interface. So that users can quickly find their favorite products.
The base number of wechat users is large, and the difficulty of small program development is low. For developers, the development threshold of wechat applet is relatively low, and the development difficulty is relatively small. Compared with app, small program greatly saves the development cost.
Shoes market demand is big, user demand is higher and higher, not only limited to appearance, comfort and quality has become the selection standard.
Nowadays, many shoes are packaged and publicized by brands, so that the price of shoes keeps rising. The value of shoes can’t be equal to the price at all. Many manufacturers pass the standard of shoes quality, but they can’t sell them without publicity. Through this mini program, people can buy these high-quality and cheap shoes.
Key words: Wechat Mini Program online shopping shoe

目录
第1章 概述 1
1.1 项目背景介绍 1
1.2.1 微信小程序发展状况 1
第2章 相关技术概述 3
2.1 .云开发工具 3
2.1.1 .云函数 3
2.1.2 数据库 3
2.2 微信小程序开发者工具 3
第3章 需求分析 4
3.1 获取需求 4
3.2 分析需求 4
3.2.1 功能性需求 4
3.2.2 非功能性需求 6
3.2.3 设计约束 6
第4章 系统设计 7
4.1 架构设计 7
4.2 总体设计 7
4.3 功能模块设计 8
4.3.1 小程序自动登陆 8
4.3.2 编辑收货地址 9
4.3.3 商品展示 10
4.3.4 购买商品 10
4.3.5 查询商品 11
4.3.6 添加购物车 12
4.3.7 订单查看 14
4.3.8 后台系统登陆 14
4.3.9 管理商品 15
4.3.10 管理订单 16
4.3.11 客服查询 17
4.3.12 轮播图管理 18
4.4 数据库设计 19
4.4.1 对象与对象关系设计 19
4.4.2 数据库表设计 21
4.4.3 数据库链接设计 25
第5章 系统实现 26
5.1 小程序前端页面的实现 26
5.1.1 微信小程序端界面 26
5.1.2 .NET Core后端界面 28
5.2 功能模块实现 29
5.2.1 微信小程序自动登陆 29
5.2.2 轮播图 30
5.2.3 商品 32
5.2.4 商品购买 34
5.2.5 加入购物车与商品收藏 37
5.2.6 收货地址 38
5.2.7 后台登陆与权限 41
5.2.8 后台功能 44
第6章 系统测试 46
6.1 测试环境 46
6.2 小程序界面测试 46
6.3 功能测试用例 46
6.3.1 收货地址操作 46
6.3.2 购买商品 47
6.3.3 微信小程序登陆 48
6.3.4 管理员登陆 48
第7章 结　论 50
参考文献 1
致 谢 2

第1章概述
鞋类市场需求大，用户需求越来越高，不仅仅局限于外表，舒适度和质量也成为选择标准。随着人们生活水平和文明程度的提高，人们对于精致的生活要求也越来越高，鞋子作为人们生活中必不可少的一部分。如何选择成为一个不可逃脱的问题。
现如今许多鞋子经过品牌包装宣传，让鞋子价格不断高涨，鞋子本身价值完全不能和价格对等，很多厂家鞋子质量过关可是苦无宣传不能销售出去。通过此小程序可以让人们购买到这些物美价廉的鞋子。
1.1项目背景介绍
我国凭借在资源、劳动力、价格等方面的先天性优势,我国已成为全球最大的鞋类生产和出口国。目前鞋类产量占世界总量的53%， 出口占世界总和的60%人上。但我国鞋业仍然存在产能过剩、质量、技术相对落后、缺少自主品牌、出口盈利水平低等严峻问题。
专家建议，在当前国际化分工日益明晰的条件下，我国在巩固低档鞋市场，保证低端产品信誉和品质的同时，必须强化行业自律,从竞相压价的恶性循环中走出来。集中精力推广中档以上的鞋类产品，让外国消费者逐步了解中国的品牌，创出中国的中 高档鞋品牌;并逐步改变只是外国采购商来中国买鞋的现状，中国企业应更主动到国外市场卖鞋,逐步树立中国高档鞋的声望。政府应加强对制鞋业的宏观调控,创造公平的竞争环境,进行必要的产业引导，避免生产领域的重复建设和供求关系的进一步失衡，扶持企业提高产品档次和质量。对于出口型企业而言,提高海外市场的竞争力与利润率已是当务之急。企业有必要根据不同时期的市场需求，调整鞋类的出口品种，积极开发高科技、高附加值的产品，增加高档次鞋类产品出口，从而提高中国鞋的“身价”和整体形象。
第2章相关技术概述
2.1.云开发工具
云开发（Tencent CloudBase，TCB）是腾讯云提供的云原生一体化开发环境和工具平台，为开发者提供高可用、自动弹性扩缩的后端云服务，包含计算、存储、托管等 Serverless 化能力，可用于云端一体化开发多种端应用（小程序、公众号、Web 应用、Flutter 客户端等），帮助开发者统一构建和管理后端服务和云资源，避免了应用开发过程中繁琐的服务器搭建及运维，开发者可以专注于业务逻辑的实现，开发门槛更低，效率更高。
2.1.1.云函数
开发者可根据业务需求，编写函数并部署在云端，即可在小程序内调用。开发者无需维护复杂的鉴权机制，也无需购买、搭建服务器，可便捷地完成小程序开发。小程序可以直接利用微信的服务器资源，降低了开发者们的开发成本，可以更加专注于对内容和需求方面的探索。
2.1.2数据库
开发者可直接在小程序前端或云函数中对数据库进行读写，同时支持通过开发者工具内的云开发控制台进行数据管理。开发者调取数据更方便了，不过一般来说开发者开发阶段都是先测试然后上传正式版本的，所以更多的是方便数据查询和调取。

2.2微信小程序开发者工具
微信开发者工作是微信官方提供的针对微信小程序的开发工具，集中了开发，调试，预览，上传等功能。微信团队发布了微信小程序开发者工具、微信小程序开发文档和微信小程序设计指南，全新的开发者工具，集成了开发调试、代码编辑及程序发布等功能，帮助开发者简单和高效地开发微信小程序。
启动工具时，开发者需要使用已在后台绑定成功的微信号扫描二维码登录，后续所有的操作都会基于这个微信的帐号

第3章需求分析
3.1项目背景分析
我国凭借在资源、劳动力、价格等方面的先天性优势,我国已成为全球最大的鞋类生产和出口国。目前鞋类产量占世界总量的53%， 出口占世界总和的60%人上。但我国鞋业仍然存在产能过剩、质量、技术相对落后、缺少自主品牌、出口盈利水平低等严峻问题。
专家建议，在当前国际化分工日益明晰的条件下，我国在巩固低档鞋市场，保证低端产品信誉和品质的同时，必须强化行业自律,从竞相压价的恶性循环中走出来。集中精力推广中档以上的鞋类产品，让外国消费者逐步了解中国的品牌，创出中国的中 高档鞋品牌;并逐步改变只是外国采购商来中国买鞋的现状，中国企业应更主动到国外市场卖鞋,逐步树立中国高档鞋的声望。政府应加强对制鞋业的宏观调控,创造公平的竞争环境,进行必要的产业引导，避免生产领域的重复建设和供求关系的进一步失衡，扶持企业提高产品档次和质量。对于出口型企业而言,提高海外市场的竞争力与利润率已是当务之急。企业有必要根据不同时期的市场需求，调整鞋类的出口品种，积极开发高科技、高附加值的产品，增加高档次鞋类产品出口，从而提高中国鞋的“身价”和整体形象。

3.2获取需求
既然是购物类小程序就有购物车和完整的购物流程，用户可以通过本微信小程序顺利的选择心仪的商品并且下单，然后支付。一个销售类的微信小程序，首先在界面和名字上要能够明确告诉目标客户你的小程序销售的商品是什么，并且界面能够吸引到用户。对于使用者而言打开小程序就能够看到首页，搜索栏，购物车，我的个人中心以及订单界面和商品详情页。使用者能够在小程序中通过关键字搜索需要的商品购买商品，加入购物车，查询订单状态以及咨询客服相关信息等。
3.3分析需求
3.2.1功能性需求

小程序的功能如图 1整体功能图所示，“鞋之城”微信小程序系统的用户可以进行商品的详细查看，添加购物车，提交订单，支付订单等操作，使用者进入小程序自动登陆本微信小程序系统，可以通过关键字搜索商品，可以编辑收货地址，查询订单，联系客服。

3.2.2目标用户分析
针对不停的客户群体，设置不同的侧重需求。用户群体：因为鞋子是每个年龄段客户的必需品，所以本小程序针对所有年龄段的用户。
用户需求：本小程序主要是针对的是对鞋类产品的品牌以及知名度要求不高，只追求鞋子质量和舒适度并且预算有限的用户。
产品特点：物美价廉，让让用户可以花最少的钱买到质量最高的鞋子，产品的特性就是，在价格最低的情况下让产品质量达到最高的一个水平，薄利多销，造成双赢的局面。
3.4详细内容分析
3.3.1 首页内容
在首页的搜索功能可以帮助用户迅速的找到他们需要的商品：类型功能把所有的商品分为几个大类，可以让用户根据自己的需求选择，推荐功能是根据客户的搜索比例进行一个推荐的功能，根据一个大数据的统计来推测你当前需要的产品和心灵的商品，这个功能可能比较难以实现。
3.3.2 全部宝贝页内容
在全部宝贝页，分为女鞋部分男鞋部分以及精选和新品帮助用户能快速找到想要的商品分类；在这个页面你可以看到所有商品，可以根据自己的需求选择不同的大类，，每一个大类里面有，不同的小类，比如说女鞋里面有高跟鞋，休闲鞋，运动鞋，可以用户更快速和精准的，选择你需要的商品，
3.3.3 购物车页内容
在购物车页面可以查看自己添加到购物车的商品，并进行商品的结算支付。可以在本页面对购物车里面的商品，进行商品数量的修改以及商品的删除，并且可以在这个页面联系客服反馈问题，咨询问题；
3.3.4 我的页内容
在我的页面可以查询自己的订单状况以及修改订单的确认收货以及退款售后服务，订单的物流情况查看商品是否出库，到达位置，以及收货情况。设置收货地址，更改收货地址，及登录自己的个人账号或者更改登录情况。

3.4 章节小结

本章分析了项目背景情况，主要用户群体，功能界面分析，以及主要功能。
第4章系统设计
4.1架构设计
云开发提供了三个基础能力：数据库、存储和云函数。

数据库：json数据库，就理解为往里面存的是json，取出来的也是json。

存储：就是把你的图片、音频和视频之类的资源文件，存储到里面，帮你生成链接，直接拿链接就可以用，就好像一个网盘一样。

云函数：这个云函数，就是服务端的接口，你调用这个函数，也就是调用接口。云函数可以在客户端写，也可以在云开发控制台写，写完之后同步一下，两端就都有了。在云函数里，你可以进行计算，也可以操作数据库，把想要的结果以同步或者异步的方式返回给客户端。有创新的bai践行截层水平实施和自du动垂直堆叠的开zhi发理念：要能超越传统的一切都dao是对象，提出一种zhuan新型软件构建的基础理念，从而大大简化传统软件的开发； 有典型的简单到粗暴的驱动式开发模型和工具：整个开发过程，必须有各种的工具支持，能做到无编码开发，且其中的概念不能太多太专业； 具备独立云计算能力的运行时容器：云开发的前置条件就是同时能提供默认的云服务框架和环境，能迅速把上述开发成果转化成云软件、云应用和云服务； 提供了典型的专业构件集：常规软件中包含的一些专业核心软件技术，如全文检索、自然语言、统一用户等，必须变成专业的SaaS，供开发者快速整合； 开放兼容传统开发过程和技术积累：既然是开发，除了不懂编码的人可控外，更应该让有编码能力人感到强大、灵活和可复用，从而要求云开发过程其可兼容传统编程语言；要有充分的开放性，作为开发方式，当然能够看生成全部开发的源码，可以选择各种框架甚至自己定义的框架，同时还能够与各种开放框架耦合； 从在线开发开始通过连续交互驱动开发：驱动模式的开发。
4.2总体设计
根据前面的各项设计分析，按照系统开发的基本理念对系统进行分解，从模块上主要可分为前台模块和后台模块。
前台模块主要有购买商品、查询商品、编辑收货地址、查询订单、收藏商品、自动登陆、添加购物车、商品展示这八个子模块；后台模块主要有商品管理，订单管理，管理员账号管理，后台系统登陆，轮播图管理这五个子模块。系统总体设计如图 4.1系统总体设计图所示。

4.3功能模块设计
4.3.1小程序自动登陆
（一）流程设计
每当用户进入商场微信小程序系统，系统会进行自动登陆，获取到用户Openid（在小程序中设为全局变量）与用户微信名称，系统会将这些信息当作参数传入服务器，保存至用户信息表中，因为该登陆为自动登陆，为了防止数据的无限添加，导致数据库数据冗余而降低服务器处理效率，在添加用户信息时系统会进行数据筛选过滤掉微信小程序端传来的重复数据，保证数据库中数据的简洁。为了确保用户信息的安全性，系统在将数据保存进用户信息表时会对Openid进行MD5签名处理，用户微信名称进行ASE（Advanced Encryption Standard，高级加密标准）加密处理。用户登陆流程图如图 4.2 用户登陆流程图所示。注：N为加密后的Openid与用户信息表中的Openid一致且加密后的微信名称与用户信息表中的微信名称一致Y为Openid与用户信息表中的Openid一致且加密后的微信名称与用户信息表中的微信名称不一致

图 4.2 用户登陆流程图
（二）对象设计
在图 4.2 用户登陆流程图中，可以得到一个对象用户，该对象有3个属性分别为Openid，用户微信名称，用户编号，其中Openid属性为MD5签名后的字符串，用户微信名称属性为ASE加密后的字符串。
4.3.2编辑收货地址
（一）流程设计
本系统的增加收货地址界面与修改收货地址界面为一个界面，通过参数（收货地址编号）进行控制。当参数（收货地址编号）不为空时，显示修改，为空时显示显示增加。为了保护用户信息，用户编辑信息时候输入的信息（姓名，电话号码，详细地址），传入到后台都会进行ASE加密，为了分辨是哪位用户更新了地址或者增加了地址，系统会传入用户唯一标识Openid，以此来判断哪位用户进行了对收货地址的编辑操作。当用户进行删除收货地址操作时，只需要用户将被删除的收货地址编号传入后台即可。

（二）对象设计
在图 4.3 编辑收货地址流程图中，可以获取到两个对象分别为用户与收货地址。其中收货地址对象有五个属性分别为收货地址编号，用户编号，姓名，电话号码，详细地址。用户编号属性是用户来识别收货地址对象中数据属于哪个用户，姓名，电话，详细地址属性均为ASE加密后的密文。
4.3.3商品展示
（一）流程设计
用户可以通过本系统看到商品信息，商品详细信息，商品品牌信息。根据需求分析。本系统的商品对象可以划分为五个对象：商品总分类对象，商品品牌分类对象，商品信息对象，商品详细信息对象，商品详细信息图片对象。

（二）对象设计
商品展示流程中共有五个对象：商品总体分类对象，商品品牌分类对象，商品信息对象，商品详细信息对象，商品详细信息图片对象。商品总体对象有一个属性商品总体分类编号；商品品牌分类对象有两个属性商品品牌分类编号与商品总体分类编号；商品信息对象有五个属性：商品信息编号，商品品牌分类编号，商品名称，商品价格，展示图片；商品详细信息对象有两个属性：商品详细信息编号，商品信息编号；商品详细信息图片对象有两个属性：商品详细信息图片编号，商品详细信息编号。
4.3.4购买商品
（一）流程设计
用户可以在微信商场小程序系统中购买自己喜欢的商品，当用户点击立即购买按钮时，系统会弹出用户收货地址列表模态框让用户选择收货地址，当用户选择完收货地址，系统将用户所购买商品的商品编号，收货地址编号，用户Openid通过参数的形式传入服务器中，服务器检验参数（是否为空），参数不为空，服务器通过Openid（MD5签名后）查询出用户编号，收货地址编号查询出用户收货地址详细信息，并将收货地址详细信息进行ASE解密，然后将这些信息与系统自动生成的订单编号存入订单表中，返回“购买成功”的回调数据；参数为空系统提示“购买失败”，返回“购买失败”的回调数据。小程序端接受回调数据，以此判断用户是否成功购买。注：N为参数为空，Y为参数不为空，O为订单编号，商品编号，收货地址详细信息，用户编号，订单状态

（二）对象设计
在图 4.5 购买商品流程图中，可以获取到四个对象分别为用户，商品信息，订单，用户收货地址。其中订单对象有五个属性分别为订单编号，用户编号，商品信息编号，收货地址详细信息，订单状态；商品信息对象有一个属性为商品信息编号；用户收货地址对象有两个属性分别为用户收货地址编号，用户收货地址详细信息。
4.3.5查询商品
用户可以通过关键字进行商品详细信息的模糊查询，用户在搜索框上输入需要查询的商品的关键字（商品名称，商品编号），并传入系统后台，系统后台根据用户传入的值进行条件查询，查询出用户想要搜索的商品信息，并将该商品信息编号返回前台，前台根据判断返回值是否为空，如不为空将返回编号当作参数跳转到商品详细信息页面显示用户所搜索商品的详细信息，如果为空显示模态框提示“没有该商品！”。

4.3.6添加购物车
（一）收藏商品
用户点击收藏按钮（星星形状）可以进行商品的收藏，当用户点击收藏按钮时，系统会自动将用户Openid与被收藏商品信息编号以参数的形式传递给后台，验证参数是否为空，如果不为空，系统通过Openid（MD5签名后）查询出用户编号，将用户编号与商品信息编号存入收藏商品表中并自动生成收藏商品编号，并返回“收藏成功！”数据，小程序端接受的返回数据为“收藏成功！”时会自动将用户Openid作为参数跳转到收藏界面，访问获取收藏商品接口，进行参数验证，验证成功后查出用户编号，并通过用户编号查询出用户所有收藏的商品编号，通过商品编号查询出该编号下的商品信息，并转为JSON形式返回小程序端，进行商品信息展示；如果为空，系统会返回“收藏失败！”数据，小程序会弹出模态框提示“收藏失败！”。具体流程图如图 4.7收藏商品流程图所示。

收藏商品流程中共有三个对象：用户，收藏商品，商品信息。其中收藏商品对象有三个属性分别为收藏商品编号，用户编号，商品信息编号。
（二）添加购物车
添加购物车功能与收藏商品功能基本一致，其添加购物车对象所具有的属性与收藏商品对象所具有的属性基本一致唯一不同的是收藏商品编号为添加购物车编号。添加购物车在功能上与收藏商品相比唯一不同的是购物车界面有两种显示方式，第一种购物车表种没有商品，显示“点击浏览商品”字样；第二种购物车表种，有商品，显示商品信息。具体流程图如图 4.8购物车显示流程图所示。

4.3.7订单查看
用户可以在本系统中进行所有订单查询与订单条件（订单状态）查询，当用户进行所有订单查询时，系统将用户的Openid传入后台；当用户进行订单条件查询，系统将用户Openid与订单状态传入后台，获取订单数据流程与获取收藏商品流程和购物车流程一样，将Openid进行MD5签名，获取用户编号，通过用户编号获取用户订单，通过用户订单获取商品信息编号，通过商品信息编号获取商品信息数据，条件查询订单就是在所有订单查询基础上添加一个参数（订单状态），获取当前订单状态与用户下的所有商品信息。

4.3.8后台系统登陆
（一）流程设计
管理员输入正确的账号与密码进行登陆，在登陆过程中，系统会对管理员的账号与密码进行是否为空判断，判断未通过，系统中断登陆，返回“账号与密码不能为空”；当判断通过，系统进行账号是否在管理员表中存在判断，判断未通过，系统中断登陆，返回“管理员账号错误”；当判断通过，系统对管理员输入的密码进行MD5签名，将加密后的字符串与管理员表中保存的字符串进行比对，比对通过管理员登陆成功，进入系统首页，比对失败，系统中断登陆，提示“密码错误”。

（二）对象设计
在图 4.10 后台系统登陆流程图中，可以获取到一个对象为管理员，管理员对象有五个属性：账号，密码（MD5签名后的字符串），管理员编号，姓名，权限。
4.3.9管理商品
拥有管理商品权限的管理员可以对商品总体分类对象，商品品牌分类对象，商品信息对象，商品详细信息对象，商品详细信息图片对象中的属性进行增删查改操作。注：商品品牌分类，商品信息，商品详细信息，商品详细信息图片的增加，修改，删除操作流程与管理商品总体分类一致，唯一不同的是在进行对商品品牌分类，商品信息，商品详细信息，商品详细信息图片的修改，增加操作中需要传递上一个对象的参数，比如对商品品牌分类进行修改需要传递商品总体分类编号，对商品信息进行修改需要传递商品信息编号与商品品牌编号。

4.3.10管理订单
（一）流程设计
拥有管理订单权限的管理员，可以对订单状态进行更新。为了确保数据的安全性与后期维护的方便性，管理订单功能中管理员只能修改订单状态，且考虑到后期订单数据过于冗余，系统会自动在一个周期时间后删除不符合周期时间要求的数据（比如删除一个月前的订单数据）。

（二）对象设计
管理订单流程有两个对象：管理员，订单。其中订单对象有订单时间，订单编号，订单状态属性。
4.3.11客服查询
（一）流程设计
拥有管理员账号管理权限的管理员，可以对其他管理员的账号信息进行修改操作，可以修改其他管理员的登陆账号，登陆密码，权限，性别，姓名，电话号码这些基本信息，可以增加新管理员，删除旧管理员。

。。。。。

全部链接下载：点击下载