一、WordPress REST API简介
WordPress从4.7版本开始内置了REST API功能，这使得开发者可以通过标准的HTTP请求与WordPress网站进行数据交互。这一特性为将WordPress内容接入小程序提供了技术基础。
WordPress REST API的主要特点包括：
- 基于JSON格式传输数据
- 支持GET、POST、PUT、DELETE等HTTP方法
- 提供用户、文章、页面、分类等核心数据接口
- 可通过插件扩展更多接口功能
二、准备工作
在开始接入前，需要确保以下条件已满足：
- WordPress网站配置
- 确保WordPress版本在4.7以上
- 在”设置-固定链接”中选择非默认的URL结构(推荐”文章名”)
- 考虑安装JWT Authentication等插件增强API安全性
- 小程序开发环境
- 注册微信小程序开发者账号
- 安装微信开发者工具
- 创建新的小程序项目
- 接口测试工具
- 准备Postman或类似的API测试工具
- 用于调试WordPress API接口
三、WordPress API基础接入
1. 获取文章列表
小程序端可以通过以下方式获取WordPress文章列表：
wx.request({
url: 'https://yourdomain.com/wp-json/wp/v2/posts',
method: 'GET',
success(res) {
console.log(res.data)
}
})
返回的数据包含文章标题、内容、特色图片等信息。
2. 获取单篇文章详情
通过文章ID获取特定文章的完整正文：
wx.request({
url: 'https://yourdomain.com/wp-json/wp/v2/posts/123',
method: 'GET',
success(res) {
console.log(res.data)
}
})
3. 获取分类信息
获取所有分类或特定分类下的文章：
// 获取所有分类
wx.request({
url: 'https://yourdomain.com/wp-json/wp/v2/categories',
method: 'GET'
})
// 获取特定分类下的文章
wx.request({
url: 'https://yourdomain.com/wp-json/wp/v2/posts?categories=5',
method: 'GET'
})
四、高级功能实现
1. 用户认证与登录
通过JWT插件实现小程序用户与WordPress用户的对接：
- 安装并配置JWT Authentication for WP REST API插件
- 小程序端实现登录获取code
- 将code发送到服务器换取JWT token
// 小程序登录
wx.login({
success(res) {
if (res.code) {
wx.request({
url: '你的服务器地址/api/jwt-auth/v1/token',
method: 'POST',
data: {
code: res.code
},
success(res) {
// 保存token
wx.setStorageSync('token', res.data.token)
}
})
}
}
})
2. 文章评论功能
实现用户在小程序端发表评论：
wx.request({
url: 'https://yourdomain.com/wp-json/wp/v2/comments',
method: 'POST',
header: {
'Authorization': 'Bearer ' + wx.getStorageSync('token')
},
data: {
post: 123, // 文章ID
content: '这是一条评论内容'
},
success(res) {
console.log('评论成功')
}
})
3. 自定义接口开发
通过WordPress的register_rest_route函数创建自定义API：
// 在主题的functions.php中添加
add_action('rest_api_init', function() {
register_rest_route('custom/v1', '/data', [
'methods' => 'GET',
'callback' => 'custom_api_data'
]);
});
function custom_api_data() {
return [
'custom_data' => 'value',
'another_data' => 123
];
}
小程序端调用：
wx.request({
url: 'https://yourdomain.com/wp-json/custom/v1/data',
method: 'GET'
})
五、性能优化与安全
- 缓存策略
- 使用小程序storage缓存常用数据
- 设置合理的缓存过期时间
- 对频繁访问的数据实现本地缓存
- 安全措施
- 使用HTTPS协议
- 限制API访问频率
- 对敏感操作进行用户认证
- 过滤API返回的数据，移除不必要的信息
- 图片优化
- 使用WordPress的图片压缩插件
- 小程序端使用合适的图片尺寸
- 考虑使用CDN加速图片加载
六、常见问题解决
- 跨域问题
- 在WordPress主题的functions.php中添加CORS支持
add_action('init', 'handle_preflight');
function handle_preflight() {
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: POST, GET, OPTIONS");
header("Access-Control-Allow-Credentials: true");
header('Access-Control-Allow-Headers: Content-Type, Authorization');
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') {
exit;
}
}
- 数据格式问题
- 处理WordPress返回的HTML内容，可能需要转换为小程序rich-text支持的格式
- 处理特色图片的URL路径
- 分页加载
- 实现小程序上拉加载更多功能
- 使用WordPress API的page参数控制分页
七、完整示例项目结构
一个典型的小程序项目结构可能包括：
pages/
index/ // 首页
post/ // 文章详情
category/ // 分类页面
my/ // 个人中心
utils/
api.js // API请求封装
auth.js // 认证相关
config.js // 配置文件
app.js
app.json
app.wxss
在api.js中封装公共请求方法：
const API_BASE = 'https://yourdomain.com/wp-json'
function request(url, method, data) {
return new Promise((resolve, reject) => {
wx.request({
url: API_BASE + url,
method: method,
data: data,
header: {
'Authorization': 'Bearer ' + wx.getStorageSync('token')
},
success(res) {
resolve(res.data)
},
fail(err) {
reject(err)
}
})
})
}
export const getPosts = (params) => request('/wp/v2/posts', 'GET', params)
export const getPost = (id) => request(`/wp/v2/posts/${id}`, 'GET')
export const postComment = (data) => request('/wp/v2/comments', 'POST', data)
八、总结
WordPress REST API为小程序开发提供了强大的后端支持，使开发者能够快速构建内容驱动型小程序。通过合理利用WordPress的内容管理能力和小程序的跨平台特性，可以开发出功能丰富、性能优良的应用。
在实际开发中，建议：
- 先规划好数据结构和小程序页面布局
- 分模块开发测试
- 注意性能优化和用户体验
- 做好错误处理和日志记录
随着WordPress和小程序生态的不断发展，这种结合方式将为内容创作者和开发者带来更多可能性。
