苍穹外卖(五) 微信小程序

您所在的位置:网站首页 外卖小程序头像怎么换 苍穹外卖(五) 微信小程序

苍穹外卖(五) 微信小程序

2024-07-09 16:30:19| 来源: 网络整理| 查看: 265

项目应用: 

使用微信小程序完成客户端开发并基于微信登录实现小程序的登录功能如果是新用户需要自动完成注册  微信小程序开发 介绍

小程序是一种新的开放能力,开发者可以快速地开发一个小程序。可以在微信内被便捷地获取和传播,同时具有出色的使用体验。

官方网址:**微信小程序 

准备工作

开发微信小程序之前需要做如下准备工作:

注册小程序        走个人通道正常注册就可以完善小程序信息 进去之后填写一下项目名称  下载开发者工具

资料中已提供,无需下载,熟悉下载步骤即可。

下载地址: 微信开发者工具(稳定版 Stable Build)下载地址与更新日志 | 微信开放文档

下载好后, 创建小程序  AppID 见上方调试器 : 跟浏览器的调试工具是一样的  也能看到服务端发过来的消息

设置不校验合法域名

 

基本结构

实际上,小程序的开发本质上属于前端开发,主要使用JavaScript开发,咱们现在的定位主要还是在后端,所以,对于小程序开发简单了解即可。

 小程序目录结构

小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。一个小程序主体部分由三个文件组成,必须放在项目的根目录,如下:

app.js:必须存在,主要存放小程序的逻辑代码

app.json:必须存在,小程序配置文件,主要存放小程序的公共配置

app.wxss: 非必须存在,主要存放小程序公共样式表,类似于前端的CSS样式

对小程序主体三个文件了解后,其实一个小程序又有多个页面。比如说,有商品浏览页面、购物车的页面、订单支付的页面、商品的详情页面等等。这些页面会放在哪呢? 会存放在pages目录。

js文件:必须存在,存放页面业务逻辑代码,编写的js代码。

wxml文件:必须存在,存放页面结构,主要是做页面布局,页面效果展示的,类似于HTML页面。

json文件:非必须,存放页面相关的配置。

wxss文件:非必须,存放页面样式表,相当于CSS文件。

 微信登录 导入小程序代码

开发微信小程序,本质上是属于前端的开发,我们的重点其实还是后端代码开发。所以,小程序的代码已经提供好了,直接导入到微信开发者工具当中,直接来使用就可以了。

微信登录流程 

在我们完成小程序的代码导入后, 我们看一下微信登录流程

步骤分析: 小程序端,调用wx.login()获取code,就是授权码。小程序端,调用wx.request()发送请求并携带code,请求开发者服务器(自己编写的后端服务)。开发者服务端,通过HttpClient向微信接口服务发送请求,并携带appId+appsecret+code三个参数。开发者服务端,接收微信接口服务返回的数据,session_key+opendId等。opendId是微信用户的唯一标识。开发者服务端,自定义登录态,生成令牌(token)和openid等数据返回给小程序端,方便后绪请求身份校验。小程序端,收到自定义登录态,存入storage。小程序端,后绪通过wx.request()发起业务请求时,携带token。开发者服务端,收到请求后,通过携带的token,解析当前登录用户的id。开发者服务端,身份校验通过后,继续相关的业务逻辑处理,最终返回业务数据。

接下来,我们使用Postman进行测试。

 

说明 调用 wx.login() 获取 临时登录凭证code ,并回传到开发者服务器。调用 auth.code2Session 接口,换取 用户唯一标识 OpenID 、 用户在微信开放平台账号下的唯一标识UnionID(若当前小程序已绑定到微信开放平台账号) 和 会话密钥 session_key。

之后开发者服务器可以根据用户标识来生成自定义登录态,用于后续业务逻辑中前后端交互时识别用户身份。

注意事项 会话密钥 session_key 是对用户数据进行 加密签名 的密钥。为了应用自身的数据安全,开发者服务器不应该把会话密钥下发到小程序,也不应该对外提供这个密钥。临时登录凭证 code 只能使用一次

 

测试OpenID 获取: 1). 获取授权码

点击确定按钮,获取授权码,每个授权码只能使用一次,每次测试,需重新获取。

 

2). 明确请求接口

请求方式、请求路径、请求参数

 

3). 发送请求

在项目代码中,这部分使用HttpClient 方法实现

获取session_key和openid

 

若出现code been used错误提示,说明授权码已被使用过,请重新获取

 

需求分析和设计 业务规则: 基于微信登录实现小程序的登录功能如果是新用户需要自动完成注册  代码实现:

太多了,只放图片

苍穹外卖-day06.md

代码在连接中的3.4

3.4.4 Controller层

根据接口定义创建UserController的login方法:

 

3.4.6 Service层实现类

创建UserServiceImpl实现类:实现获取微信用户的openid和微信登录功能

 

3.4.8 编写拦截器

**编写拦截器JwtTokenUserInterceptor:**统一拦截用户端发送的请求并进行jwt校验在WebMvcConfiguration配置类中注册拦截器:

项目启动自动加载配置类, 这时就会把定义好的JwtTokenUserInterceptor 对象(也就是拦截器对象) 注入

 



【本文地址】

公司简介

联系我们

今日新闻


点击排行

实验室常用的仪器、试剂和
说到实验室常用到的东西,主要就分为仪器、试剂和耗
不用再找了,全球10大实验
01、赛默飞世尔科技(热电)Thermo Fisher Scientif
三代水柜的量产巅峰T-72坦
作者:寞寒最近,西边闹腾挺大,本来小寞以为忙完这
通风柜跟实验室通风系统有
说到通风柜跟实验室通风,不少人都纠结二者到底是不
集消毒杀菌、烘干收纳为一
厨房是家里细菌较多的地方,潮湿的环境、没有完全密
实验室设备之全钢实验台如
全钢实验台是实验室家具中较为重要的家具之一,很多

推荐新闻


图片新闻

实验室药品柜的特性有哪些
实验室药品柜是实验室家具的重要组成部分之一,主要
小学科学实验中有哪些教学
计算机 计算器 一般 打孔器 打气筒 仪器车 显微镜
实验室各种仪器原理动图讲
1.紫外分光光谱UV分析原理:吸收紫外光能量,引起分
高中化学常见仪器及实验装
1、可加热仪器:2、计量仪器:(1)仪器A的名称:量
微生物操作主要设备和器具
今天盘点一下微生物操作主要设备和器具,别嫌我啰嗦
浅谈通风柜使用基本常识
 众所周知,通风柜功能中最主要的就是排气功能。在

专题文章

    CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭