 从零搭建:项目创建、服务空间配置与云对象初体验)
1. 从零开始创建uniCloud项目第一次接触uniCloud的开发者可能会觉得云开发很复杂其实用HBuilderX工具创建项目非常简单。我刚开始用的时候也担心配置麻烦实际操作下来发现比想象中容易得多。打开HBuilderX点击左上角文件→新建→项目选择uni-app项目类型。这里有个关键点要注意在模板选择区域务必勾选启用uniCloud选项。这个选项很容易被忽略我第一次就漏掉了结果后面还得重新配置。项目名称建议用英文比如myFirstUniCloud避免中文可能导致的路径问题。创建完成后项目目录会多出一个uniCloud文件夹这就是我们后续开发云函数和云对象的主战场。如果你没看到这个文件夹别慌我遇到过这种情况——有时候需要右键项目选择关联uniCloud才能显示出来。2. 服务空间配置全流程详解2.1 新建服务空间服务空间相当于我们的云端服务器所有云函数和数据库都会部署在这里。在HBuilderX中右键uniCloud文件夹选择关联云服务空间。如果你和我第一次使用时一样没有现成的服务空间就需要新建一个。点击新建服务空间会弹出阿里云或腾讯云的配置界面根据你选择的云服务商不同而不同。这里有个实际经验分享阿里云的服务空间初始化通常比腾讯云快一些我在测试时阿里云大概2分钟就好腾讯云有时要5分钟以上。服务空间名称建议包含项目名和日期比如myProject-202406方便后期管理。2.2 关联本地项目与服务空间服务空间创建成功后回到HBuilderX刷新界面在关联云服务空间的弹窗中就能看到新建的空间了。选中它点击确定项目根目录下会自动生成一个uniCloud-aliyun或uniCloud-tcb文件夹取决于你选择的云服务商。这里有个小坑我踩过关联成功后需要重启HBuilderX否则有时会出现云函数列表不刷新的问题。重启后你会在编辑器底部看到uniCloud面板这里可以管理所有云函数和查看调用日志。3. 云对象开发实战3.1 创建第一个云对象云对象是uniCloud的特色功能它把传统的RESTful API封装成了更易用的对象形式。右键uniCloud文件夹选择新建云函数/云对象类型选云对象命名为calculator。系统会自动生成两个文件index.obj.js云对象入口文件package.json配置文件打开index.obj.js我们来写个简单的加法函数module.exports { add(a, b) { // 参数校验 if(typeof a ! number || typeof b ! number){ throw new Error(参数必须是数字) } return a b }, // 再加个乘法方法 multiply(a, b) { return a * b } }3.2 前端调用云对象在前端页面调用云对象比传统ajax简单多了。在vue文件的script setup中// 导入云对象 const calculator uniCloud.importObject(calculator) const calculate async () { try { const sum await calculator.add(1, 2) const product await calculator.multiply(3, 4) console.log(加法结果:, sum) // 3 console.log(乘法结果:, product) // 12 } catch (e) { console.error(计算出错:, e) } }在模板中添加一个按钮触发计算button clickcalculate开始计算/button4. 部署与线上测试4.1 上传云对象到服务空间开发完成后右键calculator云对象文件夹选择上传部署。这个过程会把本地代码打包上传到之前关联的服务空间。上传成功后可以在HBuilderX的uniCloud面板中看到云对象状态变为运行中。这里有个实用技巧上传前先右键选择本地运行测试可以避免反复上传调试。我在实际项目中经常忘记这一步结果小错误也要等上传后才能发现很浪费时间。4.2 解决跨域问题第一次调用线上云对象时可能会遇到跨域错误。解决方法很简单打开uniCloud控制台进入跨域配置页面添加允许的域名或直接使用通配符*开发环境建议用通配符生产环境应该配置具体域名4.3 线上调用验证部署完成后前端代码不需要任何修改就能自动切换到调用线上云对象。你可以在浏览器控制台查看网络请求会发现请求地址变成了你自己的云服务地址。为了确保一切正常我通常会这样做清空浏览器缓存打开开发者工具的网络面板点击计算按钮检查请求是否成功和返回结果如果遇到403错误通常是权限问题。这时需要到uniCloud控制台的云对象权限页面给对应云对象添加所有用户可访问权限。这个细节官方文档提得不多但实际开发中经常遇到。