苍穹外卖-DAY06

  • 微信小程序开发

一、HttpClient

1.HttpGet

发送get请求

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
public void testHttpClient() throws IOException {
// Test code for HTTP client would go here
//创建httpclient对象
CloseableHttpClient httpClient = HttpClients.createDefault();

//创建请求对象
HttpGet httpGet = new HttpGet("http://127.0.0.1:8080/user/shop/status");

//发送请求,接收响应结果
CloseableHttpResponse response = httpClient.execute(httpGet);

//打印响应结果
int statusCode = response.getStatusLine().getStatusCode();
System.out.println("响应状态码:" + statusCode);

HttpEntity entity = response.getEntity();
String body = EntityUtils.toString(entity);
System.out.println("响应体:" + body);

//关闭资源
response.close();
httpClient.close();

这样在springboot中发送http请求

2.HttpPost

发送post请求

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
public void testHttpClient() throws IOException {
// Test code for HTTP client would go here
//创建httpclient对象
CloseableHttpClient httpClient = HttpClients.createDefault();

//创建请求对象

HttpPost httpPost = new HttpPost("http://127.0.0.1:8080/admin/employee/login");

JSONObject json = new JSONObject();
json.put("username", "admin");
json.put("password", "123456");

StringEntity entity = new StringEntity(json.toString());

entity.setContentEncoding("UTF-8");
entity.setContentType("application/json");

httpPost.setEntity(entity);


//发送请求,接收响应结果
CloseableHttpResponse response = httpClient.execute(httpPost);

//打印响应结果
int statusCode = response.getStatusLine().getStatusCode();
System.out.println("响应状态码:" + statusCode);

HttpEntity entity_response = response.getEntity();
String body = EntityUtils.toString(entity_response);
System.out.println("响应体:" + body);

//关闭资源
response.close();
httpClient.close();
}

在这里,最终封装了一个工具类

sky-common/src/main/java/com/sky/utils/HttpClientUtil.java

二、微信小程序开发

1.准备

image-20260204134841240

安装后效果

image-20260204135723397

还需要勾选一个按钮,以保证接口请求正常

image-20260204135819203

2.项目结构

项目整体目录树

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
project-name/
├── pages/ # 存放所有页面
│ ├── index/ # 首页文件夹
│ │ ├── index.js # 页面逻辑
│ │ ├── index.json # 页面配置
│ │ ├── index.wxml # 页面结构
│ │ └── index.wxss # 页面样式
│ └── logs/ # 日志页文件夹
│ ├── logs.js
│ └── ...
├── utils/ # 工具函数目录 (可选)
│ └── util.js
├── components/ # 自定义组件目录 (可选)
├── assets/ # 静态资源 (图片、图标等)
├── app.js # 全局逻辑入口 (必须)
├── app.json # 全局配置文件 (必须)
├── app.wxss # 全局样式文件 (可选)
├── project.config.json # 项目/开发工具配置 (必须)
└── sitemap.json # 搜索索引配置

全局配置文件

根目录下的文件控制着整个小程序的生命周期和全局设置。

文件名 类型 必须 说明
app.json 配置 核心配置文件。决定页面路径 (pages)、窗口表现 (window)、底部 TabBar、网络超时等。
app.js 逻辑 入口文件。定义小程序的生命周期(如 onLaunch),声明全局数据 (globalData)。
app.wxss 样式 全局样式表。这里定义的样式会作用于所有页面(类似于 CSS Reset 或全局 Theme)。
project.config.json 工具 开发者工具配置。包含 AppID、编译模式、项目名称等,确保不同开发者在工具中打开项目时环境一致。
sitemap.json 搜索 微信索引配置。配置小程序及其页面是否允许被微信索引(用于微信搜索)。

页面文件结构

pages 目录下,每一个页面通常是一个独立的文件夹。文件夹内必须包含四个同名文件(例如都叫 index),它们共同组成一个页面。

注意: 为了让系统识别,这四个文件必须保持文件名一致,仅后缀名不同。

A. index.wxml (Structure)

  • 作用: 描述页面的结构(类似 HTML)。
  • 特点: 使用微信提供的组件标签(如 <view>, <text>, <image>)而不是 HTML 标签(<div>, <span>)。

B. index.wxss (Style)

  • 作用: 描述页面的样式(类似 CSS)。
  • 特点: 具有 CSS 大部分特性,但扩展了尺寸单位 rpx (responsive pixel),可以根据屏幕宽度进行自适应。

C. index.js (Logic)

  • 作用: 处理页面逻辑和数据交互。
  • 核心: 包含 data(页面初始数据)、生命周期函数(onLoad, onShow)以及事件处理函数(如点击事件)。

D. index.json (Config)

  • 作用: 当前页面的专属配置。
  • 优先级: 这里的配置会覆盖 app.json 中的 window 全局配置(例如,你可以单独修改某个页面的导航栏颜色)。

3.app.json

1
2
3
4
"backgroundTextStyle": "light",
"navigationBarBackgroundColoh": "#fff",
"navigationBarTitleText": "itcast",
"navigationBarTextStyle": "black"

三、登录功能实现

1.登录流程

1
https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/login.html

img

通过授权码只能获取一次用户的open_id,每次获取都需要更新