uniapp云开发小程序（二 BHbuildX云开发小程序搭建和运行）
1、新建和运行
新建一个小程序，这里不多做描述，可以看之前的文章
注意：这里我们搭建的是一个uniapp+云开发的小程序
先简单看一下可以做的事情
然后接下来就可以直接上手了
这里直接建立运行,搭建成功以后我们的项目是这样的 ！
2、关联云服务空间
👉 右键点击去关联服务空间
👉 跳转网页去选择新建，这里我选择的是阿里云的！
👉 稍微等待一会，这里我们已经配置成功了！
👉 刷新一下然后我们绑定相关的空间部分
3、创建用户数据表
👉 创建完成之后，会自动打开创建好的当前服务空间，接下里我们去创建一个数据表
这边我们先创建一个user用户的表，这里直接有一个链接为我们提供了相关的案列表，我们直接拿来使用就可以 gitee.com/dcloud/open…
这边我们直接使用官方给我们提供的表在，这些东西真说方便的很，耐心等待一会 ！
这里我们使用的是标准的非关系型数据库mongoDB，接下来我们增加一条用户
mongoDB的使用可以看我关于mongoDB的使用文章
{"username":"admin"}；
这里已经为我们增加成功了！
再次运行我们的项目会发现，项目直接提示我们：这里再次返回运行会提示我们
本项目的uniCloud使用的默认服务空间spaceId为：xxx
这里就代表我们已经绑定成功了，接下来我们就可以正常访问了！
4、云函数用户登录的实现
这里我们新建一下云函数，官方直接封装好的用户部分，拿来即用
新建的部分位于我们的cloudfunctions下面的uni-id-cf 部分，我们可以简单打开看一下，这里可以看到我们相关的部分已经将我们的登录给封装好了！
建立完成以后直接去页面导入插件 ext.dcloud.net.cn/plugin?id=8…
然后我们导入以后配置一下我们的基础的tabBar页面，接下来去我们的登录页面之中去看看官方给我们提供的一体化登录如何
- 首页，方便我们去登录页面去
<template>
<view>
<button @click="topage('/pages/component/login/login')">登录</button>
</view>
</template>
<script setup>
function topage(row){
uni.navigateTo({
url:row,
})
}
</script>
<style>
</style>
- 官方推荐方式我们尝试一下
这边我们直接下载官方的文件，然后从里面找到官方给我们提供的页面，这里可以看到，给我们提供的页面有点丑啊，哈哈
也许是砸门打开方式不对，砸门去跑一下官方给我们推荐的
把官方给我们的页面给导入，然后跑一下，结果发现竟然是一样的，那就只能没办法，自己去后期考虑去优化一下了。
接下来我们优化一下我们的登陆界面，然后用户可以进行登陆
这里我们就选择云开发小程序。就先单纯弄一个微信登陆就可以啦！
5、项目导入和运行
这里我们再次将项目给备份传递了一下代码仓库，然后进行导入，然后HbuildX就给了我们一个提示，提示我们并没有关联对应的空间
👉 这里重新绑定一下本地云函数即可
绑定重新运行，欧克！
👉 右键=> 云服务空间初始化向导=> 直接下一步部署
6、uni-id和uni-pages的使用
接下来我们就uni-id和uni-pages结合在项目之中进行官方推荐的使用，迅速完成用户部分的功能
首先来看看具体逻辑在这个页面，我也是踩坑了才知道这玩意 doc.dcloud.net.cn/uniCloud/un…
必须得有俩东西，这个配套组合使用
uni-id(用在云函数之中) 和 uni-id-pages (用在前端页面之中)
👉 去HbuildX之中把 uniclound部分uni-id给导入进来 （云函数cloudfunctions右键=》新建云函数 =》(就是上面得 4 部分哇 ！！ )）
👉 去这个地址导入插件到你自己页面：ext.dcloud.net.cn/plugin?name…
然后我们就可以开始整配置了。
👉 配置登录部分云函数
创建并配置uni-id的配置文件
-
在目录
uniCloud/cloudfunctions/common/uni-config-center/下新建uni-id/config.json -
然后接下来你需要配置一下这个文件，我建议直接copy官方的就完事了，配置地址下面这个 doc.dcloud.net.cn/uniCloud/un…
这里粘贴一下我的配置部分
{
"passwordSecret": [
{
"type": "hmac-sha256",
"version": 1
}
], // 数据库中password字段是加密存储的，这里的passwordSecret即为加密密码所用的加密算法，详见[密码安全]
"passwordStrength": "medium", // 密码强度，新增于 uni-id-pages 1.0.8版本，见下方说明
"tokenSecret": "", // 生成token所用的密钥，注意修改为自己的，使用一个较长的字符串即可
"requestAuthSecret": "", // URL化请求鉴权签名密钥
"tokenExpiresIn": 7200, // 全平台token过期时间，未指定过期时间的平台会使用此值
"tokenExpiresThreshold": 3600, // 新增于uni-id 1.1.7版本，checkToken时如果token有效期小于此值且在有效期内则自动获取新token，请注意将新token返回给前端保存（云对象会自动保存符合uniCloud响应体规范的响应内的新token），如果不配置此参数则不开启自动获取新token功能
"maxTokenLength": 10, // 数据库用户记录token数组的最大长度，默认为10。新增于uni-id-common 1.0.16
"passwordErrorLimit": 6, // 密码错误最大重试次数
"passwordErrorRetryTime": 3600, // 密码错误重试次数超限之后的冻结时间
"autoSetInviteCode": false, // 是否在用户注册时自动设置邀请码，默认不自动设置
"forceInviteCode": false, // 是否强制用户注册时必填邀请码，默认为false
"idCardCertifyLimit": 1, // 实名认证相关; 限制每个身份证可以绑定几个账号
"realNameCertifyLimit": 5, // 实名认证相关; 限制用户每日认证次数，防止接口被刷
"sensitiveInfoEncryptSecret": "", // 敏感信息加密密钥(长度为32位的字符串)，如使用实名认证功能需配置此密钥
"frvNeedAlivePhoto": false, // 实名认证相关；是否获取认证照片
"userRegisterDefaultRole": [], // 用户注册时的默认角色
"app": { // 如果你使用旧版本uni-id公共模块而不是uni-id-common这里可能配置的是app-plus，务必注意调整为app
"tokenExpiresIn": 2592000,
"tokenExpiresThreshold": 864000,
"oauth": {
// App微信登录所用到的appid、appsecret需要在微信开放平台获取，注意：不是公众平台而是开放平台
"weixin": {
"appid": "",
"appsecret": ""
},
// App QQ登录所用到的appid、appsecret需要在腾讯开放平台获取，注意：不是公众平台而是开放平台
"qq": {
"appid": "",
"appsecret": ""
},
"apple": { // 使用苹果登录时需要
"bundleId": ""
}
}
},
"web": { // 如果你使用旧版本uni-id公共模块而不是uni-id-common这里可能配置的是h5，务必注意调整为web
"tokenExpiresIn": 7200,
"tokenExpiresThreshold": 3600,
"oauth": {
"weixin-h5": { // 微信公众号登录配置
"appid": "",
"appsecret": ""
},
"weixin-web": { // 微信PC页面扫码登录配置
"appid": "",
"appsecret": ""
}
}
},
"mp-weixin": {
"tokenExpiresIn": 259200,
"tokenExpiresThreshold": 86400,
"oauth": {
// 微信小程序登录所用的appid、appsecret需要在对应的小程序管理控制台获取
"weixin": {
"appid": "",
"appsecret": ""
}
}
},
"mp-qq": {
"tokenExpiresIn": 259200,
"tokenExpiresThreshold": 86400,
"oauth": {
// QQ小程序登录所用的appid、appsecret需要在对应的小程序管理控制台获取
"qq": {
"appid": "",
"appsecret": ""
}
}
},
"mp-alipay": {
"tokenExpiresIn": 259200,
"tokenExpiresThreshold": 86400,
"oauth": {
// 支付宝小程序登录用到的appid、privateKey请参考支付宝小程序的文档进行设置或者获取，https://opendocs.alipay.com/open/291/105971#LDsXr
"alipay": {
"appid": "",
"privateKey": "", // 私钥
"keyType": "PKCS8" // 私钥类型，如果私钥类型不是PKCS8，需要填写此字段，否则会出现“error:0D0680A8:asn1 encoding routines:ASN1_CHECK_TLEN:wrong tag”错误
}
}
},
"service": {
"sms": {
"name": "", // 应用名称，对应短信模版的name
"codeExpiresIn": 180, // 验证码过期时间，单位为秒，注意一定要是60的整数倍
"scene": {
"bind-mobile-by-sms": { // 对绑定手机号场景的配置，短信验证码场景值参考：https://uniapp.dcloud.net.cn/uniCloud/uni-id/summary.html#sms-scene
"templateId": "", // 绑定手机号使用的短信验证码模板
"codeExpiresIn": 240 // 绑定手机号验证码过期时间
}
}
},
"univerify": {
"appid": "" // uni-id-co 1.1.17及以上版本无需填写，当前应用的appid，使用云函数URL化，此项必须配置
}
}
}
格外注意：需要把里面的注释内容给删掉啊！！
👉 这里我就微信登录，所以砸门只要配置一部分微信得东西就可以啦！
填写上对应的appId和 appsecret 部分
初始化
👉 接下来去在App.vue中初始化uni-id-pages的init.js文件
官方给我们示例代码是这样子的
<script>
import uniIdPageInit from '@/uni_modules/uni-id-pages/init.js';
export default {
onLaunch: async function() {
console.log('App Launch')
await uniIdPageInit()
},
onShow: function() {
console.log('App Show')
},
onHide: function() {
console.log('App Hide')
}
}
</script>
这个配置直接一眼看穿，这里就直接过
👉 直接下一步，去配置我们的init.js文件
路径：/uni_modules/uni-id-pages/config.js
就是你找的目录，别怀疑，配置也是直接把官方一贴再看，这里应该你导入的直接有这个部分
export default {
//调试模式
"debug":true,
/*
登录类型 未列举到的或运行环境不支持的，将被自动隐藏。
如果需要在不同平台有不同的配置，直接用条件编译即可
*/
"loginTypes": [
"univerify",
"weixin",
"username",
"apple",
"smsCode"
],
//政策协议
"agreements": {
"serviceUrl": "https://xxx", //用户服务协议链接
"privacyUrl": "https://xxx", //隐私政策条款链接
// 哪些场景下显示，1.注册（包括注册并登录，如：微信登录、苹果登录、短信验证码登录）、2.登录（如：用户名密码登录）、3. 实名认证
"scope": ['register', 'login', 'realNameVerify']
},
// 提供各类服务接入（如微信登录服务）的应用id
"appid":{
"weixin":{
// 微信公众号的appid，来源:登录微信公众号（https://mp.weixin.qq.com）-> 设置与开发 -> 基本配置 -> 公众号开发信息 -> AppID
"h5":"wx111111111111111",
// 微信开放平台的appid，来源:登录微信开放平台（https://open.weixin.qq.com） -> 管理中心 -> 网站应用 -> 选择对应的应用名称，点击查看 -> AppID
"web":"wx22222222222222"
}
},
/**
* 密码强度
* super（超强：密码必须包含大小写字母、数字和特殊符号，长度范围：8-16位之间）
* strong（强: 密密码必须包含字母、数字和特殊符号，长度范围：8-16位之间）
* medium (中：密码必须为字母、数字和特殊符号任意两种的组合，长度范围：8-16位之间)
* weak（弱：密码必须包含字母和数字，长度范围：6-16位之间）
* 为空或false则不验证密码强度
*/
"passwordStrength":"medium",
/**
* 登录后允许用户设置密码（只针对未设置密码得用户）
* 开启此功能将 setPasswordAfterLogin 设置为 true 即可
* "setPasswordAfterLogin": false
*
* 如果允许用户跳过设置密码 将 allowSkip 设置为 true
* "setPasswordAfterLogin": {
* "allowSkip": true
* }
* */
"setPasswordAfterLogin": false
}
这里确实蛮多的，话不多说，直接微信+账号密码登录，他多任他多，我只要免费的！
再设置一下微信需要设置密码
setPasswordAfterLogin: true,
7、备案和添加域名
小程序云函数在使用完成以后都需要我们去配置，接下来我们就去配置一下对应的请求合法域名
地址： doc.dcloud.net.cn/uniCloud/pu…
小程序中配置
依次配置 👉 - 配置 request合法域名（我的阿里云的：api.next.bspapp.com） 👉 - 配置 uploadFile合法域名 👉 - 配置 download合法域名
