之前我们在小游戏端做了上传图片的功能，但还没有接入到我们的后端，今天我们就来说下，如何接入到我们的后端。废话少说，下面直接开始。
1. 我们用的后端是基于thinkphp6.0框架的。我们俩写一个接口来接收小游戏端传过来的图片文件。
（1）打开我们的后台项目。
（2）在我们之前新增的api控制器上新增一个接收图片文件的方法。
/**
* @AdminAuth(auth=false,menu=false,login=false,title="Index")
*/
public function upload(){
$update = UploadService::instance();
$update->setFile(request()->file("file"));
$res = $update->save();
var_dump($res);
}
（3）记得在顶部引入
use quick\admin\library\service\UploadService;
（4）接下来，我们在接口的测试工具上测试下，增加一个file参数
（5）上传成功，可以看到我们打印出来的信息。
（6）回到api控制器，将数据保存到数据库里。
/**
* @AdminAuth(auth=false,menu=false,login=false,title="Index")
*/
public function upload(){
$update = UploadService::instance();
$update->setFile(request()->file("file"));
$res = $update->save();
if($res && $res['uploaded']){
$model = new Image();
$model->save([
'user_id'=>0,
'name' => $res['name'],
'image_url' => $res['url'],
'is_delete' => 0,
]);
return json([
'code' => 0,
'data' => $model->toArray(),
]);
}
return json([
'code' => -1,
'data' => '上传失败',
]);
}
（7）在数据库可以看到刚才上传图片文件信息了。
2. 打开小游戏项目的game.ts 脚本。
（1）之前封装的上传图片的函数有问题。我们换一个，改成wx.uploadFile的。
sendfile(api_url, file, callback) {
const uploadTask = this.wx.uploadFile({
url: api_url,
filePath: file,
name: 'file',
success: function(res) {
console.log(res)
if (res.statusCode === 200) {
const data = JSON.parse(res.data);
callback(null, data);
} else {
callback('请求失败: ' + res.statusCode, null);
}
},
fail: function() {
callback('请求错误', null);
}
});
uploadTask.onProgressUpdate(function(res) {
// 可以在这里获取上传进度
console.log('上传进度：' + res.progress);
console.log('已经上传的数据长度：' + res.totalBytesSent);
console.log('预期需要上传的数据总长度：' + res.totalBytesExpectedToSend);
});
}
（2）在选择图片的函数chooseFile处调用上传图片函数。
let api_url="https://xxxx.xxxx.cn/index.php/admin/api/upload"
console.log(res['tempFiles'][0]['tempFilePath'] )
console.log('ffff');
this.sendfile(api_url,res['tempFiles'][0]['tempFilePath'] ,function(error, data) {
if (error) {
console.error(error);
return;
}
console.log(data);
});
(3)测试了一下，可以上传图片了。
好了，今天就先介绍到这里了。可能写的过程中还有很多不好的地方，希望大家能指出来，在此，谢谢大家
