前端-支付宝小游戏开发接入指南
支付宝小游戏开发接入指南
概述
作为小游戏开发者，接入支付宝小游戏平台需要实现用户登录、支付、文本检测、角色上报等核心功能。本文将从实际开发角度，详细介绍如何利用支付宝小游戏的my对象API完成这些功能的接入。
开发环境准备
1. 支付宝开发者工具
- 下载并安装支付宝小程序开发者工具
- 创建小游戏项目
- 配置游戏基本信息
2. 权限申请
- 在支付宝开放平台申请小游戏权限
- 配置支付权限和用户信息权限
- 获取AppID等必要参数
核心功能实现
1. 用户登录实现
支付宝小游戏使用my.getAuthCode获取用户授权码，这是用户身份验证的核心：
// 用户登录功能
async function userLogin() {
try {
console.log('开始支付宝小游戏登录');
// 调用支付宝登录API
const loginResult = await new Promise((resolve, reject) => {
my.getAuthCode({
scopes: 'auth_base', // 使用基础授权方式
success: function(res) {
console.log('my.getAuthCode success:', res);
resolve({
authCode: res.authCode || '',
authSuccessScopes: res.authSuccessScopes || [],
authErrorScopes: res.authErrorScopes || {},
code: res.authCode || '' // 授权码
});
},
fail: function(err) {
console.error('my.getAuthCode fail:', err);
reject(err);
}
});
});
if (loginResult && loginResult.code) {
// 登录成功，保存用户信息
console.log('登录成功，授权码:', loginResult.code);
// 这里可以将授权码发送到你的服务器进行验证
// 服务器验证后返回用户ID等信息
return {
success: true,
authCode: loginResult.code,
message: '登录成功'
};
} else {
return {
success: false,
message: '登录失败'
};
}
} catch (error) {
console.error('支付宝登录异常:', error);
return {
success: false,
message: '登录异常'
};
}
}
2. 支付功能实现
支付是小游戏的重要变现方式，使用my.requestGamePayment实现。在实现支付功能前，需要先检查支付宝版本是否支持支付：
// 版本号比较函数
function compareVersion(version, compareVersion) {
const v1 = version.split('.').map(num => parseInt(num, 10));
const v2 = compareVersion.split('.').map(num => parseInt(num, 10));
const len = Math.max(v1.length, v2.length);
for (let i = 0; i < len; i++) {
const n1 = v1[i] || 0;
const n2 = v2[i] || 0;
if (n1 > n2) return 1;
if (n1 < n2) return -1;
}
return 0;
}
// 获取系统信息
function getSystemInfo() {
return my.getSystemInfoSync();
}
// 游戏内支付功能
async function gamePayment(orderInfo) {
try {
// 检查支付宝版本是否支持支付
const systemInfo = getSystemInfo();
console.log('支付宝版本:', systemInfo.version);
// 支付功能需要支付宝版本 >= 10.3.90
if (compareVersion(systemInfo.version || "0", "10.3.90") <= 0) {
console.log('支付暂不支持');
return {
success: false,
message: '当前支付宝暂不支持支付，请先升级支付宝'
};
}
console.log('开始支付宝小游戏支付:', orderInfo);
// 构建支付参数
const payParams = {
buyQuantity: orderInfo.buy_quantity, // 购买数量
customId: orderInfo.order_id, // 订单ID
extraInfo: {
ext: orderInfo.ext // 扩展信息
}
};
console.log('支付宝支付参数:', payParams);
// 调用支付宝支付API
await new Promise((resolve, reject) => {
my.requestGamePayment({
...payParams,
success: function() {
console.log('支付宝支付成功');
resolve({
success: true,
message: '支付成功',
orderId: orderInfo.order_id
});
},
fail: function(res) {
console.log('支付宝支付失败:', res);
// 处理未成年人限制
if (res.error == 15215) {
my.showModal({
title: '提示',
content: '您好，基于国家新闻出版署《关于防止未成年人沉迷网络游戏的通知》的规定，支付宝限制未成年人游戏充值哦。',
showCancel: false,
confirmText: '确定',
success: function() {
reject({
success: false,
message: '未成年人限制',
errorCode: res.error
});
}
});
return;
}
reject({
success: false,
message: `支付失败: ${res.errorMessage || res.error || '未知错误'}`,
errorCode: res.error
});
}
});
});
} catch (error) {
console.error('支付宝支付异常:', error);
return {
success: false,
message: '支付异常'
};
}
}
3. 文本安全检测
为了确保游戏内用户生成内容的安全性，需要实现文本检测功能：
// 文本安全检测
async function textSecurityCheck(text, userId) {
try {
console.log('开始支付宝文本验证:', text);
// 调用你的后端API进行文本检测
const response = await fetch('/api/text-check', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
third_uid: userId,
content: text,
channel: 'zfb'
})
});
const result = await response.json();
console.log('支付宝文本检测响应:', result);
// 根据接口返回结果判断是否通过检测
const isSafe = result.code === 0;
console.log('支付宝文本检测结果:', isSafe);
return isSafe;
} catch (error) {
console.error('支付宝文本验证异常:', error);
return false; // 检测异常时默认不通过
}
}
// 使用示例
async function sendChatMessage(message, userId) {
const isSafe = await textSecurityCheck(message, userId);
if (isSafe) {
// 文本安全，可以发送
console.log('消息发送成功');
} else {
// 文本不安全，提示用户
my.showToast({
content: '消息包含敏感内容，请重新输入',
type: 'none'
});
}
}
4. 角色信息上报
根据游戏运营需求，需要定期上报玩家角色信息：
// 角色信息上报
let lastLevelReportTime = 0; // 等级上报频率限制
async function reportRoleInfo(roleInfo) {
try {
console.log('支付宝角色信息上报:', roleInfo);
// 等级上报频率限制（60秒内只能上报一次）
if (roleInfo.data_type === 3) { // 3表示等级上报
const now = Date.now();
if (now - lastLevelReportTime < 60000) {
console.log('等级上报频率限制，等待中...');
return { success: false, message: 'awating...' };
}
lastLevelReportTime = now;
}
// 调用后端API上报角色信息
const response = await fetch('/api/role-report', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
...roleInfo,
channel: 'zfb'
})
});
const result = await response.json();
console.log('角色信息上报结果:', result);
return result;
} catch (error) {
console.error('支付宝角色信息上报异常:', error);
return { success: false, message: '上报异常' };
}
}
// 使用示例
async function onPlayerLevelUp(newLevel) {
await reportRoleInfo({
data_type: 3, // 等级上报
role_id: 'player_001',
role_name: '玩家昵称',
role_level: newLevel,
server_id: 'server_001',
server_name: '服务器名称'
});
}
常用API使用
1. 弹窗提示
// 显示模态弹窗
function showAlert(title, content) {
my.showModal({
title: title,
content: content,
showCancel: false,
confirmText: '确定',
success: function(res) {
console.log('用户点击确定');
}
});
}
// 显示Toast提示
function showToast(message) {
my.showToast({
content: message,
type: 'none',
duration: 2000
});
}
2. 数据存储
// 保存数据到本地存储
function saveGameData(key, data) {
my.setStorage({
key: key,
data: data,
success: function() {
console.log('数据保存成功');
},
fail: function(err) {
console.error('数据保存失败:', err);
}
});
}
// 读取本地存储数据
function loadGameData(key) {
return new Promise((resolve, reject) => {
my.getStorage({
key: key,
success: function(res) {
resolve(res.data);
},
fail: function(err) {
reject(err);
}
});
});
}
3. 网络请求
// 发送HTTP请求
async function httpRequest(url, data) {
try {
const response = await new Promise((resolve, reject) => {
my.request({
url: url,
method: 'POST',
data: data,
header: {
'Content-Type': 'application/json'
},
success: function(res) {
resolve(res);
},
fail: function(err) {
reject(err);
}
});
});
return response.data;
} catch (error) {
console.error('网络请求失败:', error);
throw error;
}
}
错误处理最佳实践
1. API兼容性检查
// 检查API是否支持
function checkApiSupport(apiName) {
if (my.canIUse(apiName)) {
return true;
} else {
console.warn(`当前环境不支持 ${apiName}`);
return false;
}
}
// 使用示例
if (checkApiSupport('showActionSheet')) {
my.showActionSheet({
itemList: ['选项1', '选项2', '选项3'],
success: function(res) {
console.log('用户选择了:', res.tapIndex);
}
});
} else {
// 降级处理
console.log('不支持ActionSheet，使用其他方式');
}
2. 异常捕获
// 统一的异常处理
function handleError(error, context) {
console.error(`${context} 发生错误:`, error);
// 可以上报错误到服务器
// reportError(error, context);
// 显示用户友好的错误提示
my.showToast({
content: '操作失败，请重试',
type: 'none'
});
}
// 使用示例
try {
await userLogin();
} catch (error) {
handleError(error, '用户登录');
}
开发调试技巧
1. 日志输出
// 开发环境日志
const DEBUG = true;
function debugLog(message, data) {
if (DEBUG) {
console.log(`[DEBUG] ${message}`, data);
}
}
// 使用示例
debugLog('用户登录开始', { timestamp: Date.now() });
总结
通过以上实现，我们完成了支付宝小游戏的核心功能接入：
- 用户登录：使用
my.getAuthCode获取用户授权 - 支付功能：通过
my.requestGamePayment实现游戏内购买，并加入版本校验确保兼容性 - 文本检测：确保用户内容安全
- 角色上报：满足游戏运营需求
- 错误处理：完善的异常处理机制
这些功能构成了支付宝小游戏开发的基础框架，开发者可以根据具体游戏需求进行扩展和优化。在实际开发中，建议：
- 充分测试各种异常情况
- 做好API兼容性检查
- 实现完善的日志记录
- 关注支付宝平台的政策更新
- 特别注意支付功能的版本兼容性，确保在低版本支付宝中给出友好提示
通过这套方案，可以快速完成支付宝小游戏的接入，为玩家提供流畅的游戏体验。
浙公网安备 33010602011771号