阿里云开发uniapp之uni-starter

一、为什么使用uni-starter

uni-starter是集成商用项目常见功能的、云端一体应用快速开发项目模版。

一个应用有很多通用的功能,比如登录注册、个人中心、设置、权限管理、拦截器、banner... uni-starter将这些功能都已经集成好,另外,uni-starter可以直接在前端调用数据库生成页面,节省了大量的js代码。

此外,uni-starter结合uni-admin给用户提供了用户端和管理端的全套模版,对开发人员来说,节省了大量的开发时间。

二、uni-starter如何使用

1,在HBuilderX中创建项目,选择模版uni-starter,选择阿里云,Vue版本2或3都可以,这里我是用Vue3版本,最后点击创建即可。

如下图所示:

 2.开通云服务
  • 在uniCloud控制台登录,按云厂商要求进行实名认证。
  • 在uniCloud认证通过后,创建一个服务空间给本项目使用。选择阿里云。如下图所示:

3.创建并配置uni-id的配置文件
  • 在目录uniCloud/cloudfunctions/common/uni-config-center/下新建uni-id/config.json
  • 参考文档云端配置config.json的说明完成配置
  • 这里尤为重要,后续登录报错提示:Invalid uni-id config file就是这个文件没有创建或者该文件注释没有删除,又或者该文件内容格式有误,总之就是文件没法生效。下面我附上自己的代码,大家复制粘贴即可正常使用,但AppID和secret等内容还需要各自参照官网来配置。
    {"passwordSecret": [{"type": "sdasd-23","version": 1}],"passwordStrength": "medium","tokenSecret": "asd12asd#23","requestAuthSecret": "","tokenExpiresIn": 7200,"tokenExpiresThreshold": 3600,"maxTokenLength": 10,"passwordErrorLimit": 6,"passwordErrorRetryTime": 3600,"autoSetInviteCode": false,"forceInviteCode": false,"idCardCertifyLimit": 1,"realNameCertifyLimit": 5,"sensitiveInfoEncryptSecret": "","frvNeedAlivePhoto": false,"userRegisterDefaultRole": [],"app": {"tokenExpiresIn": 2592000,"tokenExpiresThreshold": 864000,"oauth": {"weixin": {"appid": "","appsecret": ""},"qq": {"appid": "","appsecret": ""},"apple": {"bundleId": ""}}},"web": {"tokenExpiresIn": 7200,"tokenExpiresThreshold": 3600,"oauth": {"weixin-h5": {"appid": "","appsecret": ""},"weixin-web": {"appid": "","appsecret": ""}}},"mp-weixin": {"tokenExpiresIn": 259200,"tokenExpiresThreshold": 86400,"oauth": {"weixin": {"appid": "","appsecret": ""}}},"mp-qq": {"tokenExpiresIn": 259200,"tokenExpiresThreshold": 86400,"oauth": {"qq": {"appid": "","appsecret": ""}}},"mp-alipay": {"tokenExpiresIn": 259200,"tokenExpiresThreshold": 86400,"oauth": {"alipay": {"appid": "","privateKey": "","keyType": "PKCS8"}}},"service": {"sms": {"name": "","codeExpiresIn": 180,"scene": {"bind-mobile-by-sms": {"templateId": "","codeExpiresIn": 240}}},"univerify": {"appid": ""}}
    }

    注意:passwordSecret里和type值和tokenSecret值都是自己随意配置的,passwordSecret里和type值一般不随便更改,只改一次,如果后续还需要可以在数组中新增一个对象,把版本号改成2以此类推即可。

4 运行云服务空间初始化向导 

如下图所示步骤

 

 5.根据自己需要,修改uni-pages文件内容

该文件格式如下: 


├─uni_modules                                         存放uni_module规范的插件。
│    ├─其他module
│    └─uni-id-pages
│        ├─uniCloud
│        │    └─cloudfunctions                        云函数目录
│        │        └─uni-id-co                         集成调用uni-id方法的云对象
│        │            ├─common                        公用逻辑
│        │            ├─config                        配置
│        │            │  └─permission.js              调用接口所需的权限配置
│        │            ├─lang                          国际化目录
│        │            ├─lib                           基础功能,不建议修改此目录下文件
│        │            │  ├─third-party                三方平台接口
│        │            │  └─utils                      基础功能
│        │            ├─middleware                    中间件
│        │            └─module                        分模块存放的云对象方法
│        ├─common
│        │    ├─login-page.scss                       登录页面公共样式
│        │    ├─login-page.mixin.js                   登录页面公共mixin文件
│        │    └─loginSuccess.js                       登录成功后执行的文件
│        ├─components
│        │    ├─cloud-image                           uniCloud云存储图片解析组件
│        │    │    └─cloud-image.vue
│        │    ├─uni-id-pages-agreements               同意用户服务协议&隐私政策条款组件
│        │    │    └─uni-id-pages-agreements.vue
│        │    ├─uni-id-pages-avatar                   用户头像组件
│        │    │    └─uni-id-pages-avatar.vue
│        │    ├─uni-id-pages-bind-mobile              通过微信获取手机号码绑定个人资料
│        │    │    └─uni-id-pages-bind-mobile.vue
│        │    ├─uni-id-pages-email-form               邮箱验证码组件
│        │    │    └─uni-id-pages-email-form.vue
│        │    ├─uni-id-pages-fab-login                悬浮的切换登录方式组件
│        │    │    └─uni-id-pages-fab-login.vue
│        │    ├─uni-id-pages-sms-form                 获取短信验证码组件
│        │    │    └─uni-id-pages-sms-form.vue
│        │    └─uni-id-pages-user-profile             获取用户信息组件
│        │        └─uni-id-pages-user-profile.vue
│        ├─pages
│        │    ├─common
│        │    │    └─webview                          用于实现应用内浏览或打开《用户协议和隐私协议》URL链接页面
│        │    │        └─webview.vue
│        │    ├─login                        
│        │    │    ├─login-smscode.vue                短信验证码登录
│        │    │    ├─login-withoutpwd.vue             免密码登录
│        │    │    └─login-withpwd.vue                密码登录
│        │    ├─register                    
│        │    │    ├─register.vue                     通过用户名密码注册账号
│        │    │    ├─register-admin.vue               创建超级管理员
│        │    │    ├─register-by-email.vue            通过邮箱验证码注册账号
│        │    │    └─validator.js                     注册账号页的表单验证规则文件
│        │    ├─retrieve                              
│        │    │    ├─retrieve-by-email.vue            通过邮箱验证码重置密码
│        │    │    └─retrieve.vue					            通过手机验证码重置密码
│        │    └─userinfo
│        │        ├─bind-mobile.vue                   绑定手机号码
│        │        ├─change_pwd.vue                    修改密码
│        │        ├─cropImage.vue                     裁剪图片
│        │        ├─deactivate.vue                    注销账号
│        │        ├─set-pwd.vue                       设置密码
│        │        ├─realname-verify                   实名认证
│        │        └─userinfo.js                       注册账号页的表单验证规则文件
│        ├─static                                     静态资源目录
│        ├─changelog.md                               更新日志
│        ├─config.js                                  uni-id-pages的配置文件
│        ├─init.js                                    初始化文件
│        ├─package.json                               包管理文件
│        └─readme.md                                  插件自述文件

 这里补充细节:

具体看官方文档:简介@intro | uniCloud 

//这是导入云函数,后续直接uniIdCo.即可访问该云函数方法,具体看官网云函数和云对象
const uniIdCo = uniCloud.importObject("uni-id-co", {errorOptions: {type: 'toast'}})

此外还有 调用云数据库,使用Vuex等操作,如下:

	const db = uniCloud.database();//这是导入云数据库
6.更多配置 

 如果项目运行出错,请检查manifest.json文件中的配置还有config.json文件中APPID配置是否正确,如果还有问题,查看微信开放平台和微信开发平台中AppID是否有权限。

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/9136.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Baidu Comate智能编码助手

Baidu Comate智能编码助手 🎈1.Baidu Comate的简介🎈2.安装Baidu Comate🎈3.Baidu Comate实现功能🎈4.使用注释进行智能代码提示🎈5.结束语 🎈1.Baidu Comate的简介 根据官网的介绍,我们了解到B…

力扣每日一题113:路径总和||

题目 中等 给你二叉树的根节点 root 和一个整数目标和 targetSum ,找出所有 从根节点到叶子节点 路径总和等于给定目标和的路径。 叶子节点 是指没有子节点的节点。 示例 1: 输入:root [5,4,8,11,null,13,4,7,2,null,null,5,1], targetSu…

完成单位投稿任务找投稿渠道不用精选10个1个就够了

在单位担任信息宣传员的这几年,我深刻体会到了“笔耕不辍”的艰辛与挑战。起初,面对单位的宣传需求,我遵循传统的投稿路径,即通过电子邮件的方式,一家接一家地向各大媒体投递稿件。那时的我,以为只要稿件质量上乘,自然能够获得青睐,却未曾料到,这是一条漫长而曲折的道路。 邮箱…

算法day03

第一题 179. 查找总价格为目标值的两个商品 本题采用前后指针和单调性规律可解; 解题思路如下: 1、设置前后指针 2、前后指针所指的两数之和大于目标数,右指针左移; 前后指针所指的两数之和小于目标数,左指针右移&…

“视频剪辑新境界:批量高效处理,画面虚化与播放速度调整一气呵成!“

在视频制作的广阔天地中,剪辑是赋予作品生命的关键环节。然而,面对大量的视频素材,如何高效地进行剪辑、调整,使每一帧画面都充满魅力,成为许多创作者面临的挑战。今天,我们为您带来一款颠覆性的视频剪辑工…

学习笔记:【QC】Android Q - IMS 模块

一、IMS init 流程图 高清的流程图参考:【高清图,保存后可以放大看】 二、IMS turnon 流程图 高清的流程图参考:【高清图,保存后可以放大看】 三、分析说明 1、nv702870 不创建ims apn pdp 2、nv702811 nv702811的时候才创建…

Objective-C的对象复制与拷贝选项

对象复制与拷贝 文章目录 对象复制与拷贝copy与mutablecopycopy与mutablecopy的简介示例:不可变对象的复制可变对象的复制 NSCopying和NSMutableCopying协议深复刻和浅复刻浅拷贝(Shallow Copy):深拷贝(Deep Copy&…

同步电机原理解析

同步电机 同步带年纪,顾名思义无论负载如何,都能以恒定的速度运转,它以高效率著称 这种恒速特性是通过恒定磁场和旋转磁场的相互作用实现的,与其他电机一样,同步电机由定子和转子组成,定子铁芯由硅片层叠而…

无人直播需要什么软件系统?最新AI实景自动无人直播软件:智能化引领直播拓客新时代

随着互联网的快速发展(无人直播招商加盟:hzzxar)直播行业已经成为商家品牌推广和商品销售的热门方式。近年来,人工智能技术的飞速发展,催生了一款令人惊叹的AI实景自动无人直播软件,为商家提供了全新的直播…

修改表空间的状态

Oracle从入门到总裁:​​​​​​https://blog.csdn.net/weixin_67859959/article/details/135209645 表空间有4种状态:联机、脱机、只读和读写。修改其中某一种状态的语句如下所示 设置表空间 tspace 为联机状态。 SQL>ALTER TABLESPACE space ONLINE: 设置表空间 tspa…

google地图js,添加标记,以及infowindow信息弹窗

&#xff08;谷歌地图版本V3&#xff09; var contentString "<div classdevinfo><P>设备ID: BJ-20240507</p> <P>设备状态: 正常</p> <P>通讯信号: 89% </p> <P>设备位置: 中国</p> <P>剂量率: 988</p&…

鸿蒙开发接口Ability框架:【(StaticSubscriberExtensionAbility)】

StaticSubscriberExtensionAbility StaticSubscriberExtensionAbility模块提供静态订阅者扩展能力的类别的能力。 说明&#xff1a; 本模块首批接口从API version 9 开始支持。后续版本的新增接口&#xff0c;采用上角标单独标记接口的起始版本。 本模块接口仅可在Stage模型下…

SpringBoot之Zuul服务

概述 Spring Cloud Netflix zuul组件是微服务架构中的网关组件,Zuul作为统一网关,是所有访问该平台的请求入口,核心功能是路由和过滤。 目前公司业务就是基于Zuul搭建的网关服务,且提供的服务包括转发请求(路由)、黑名单IP访问拦截、URL资源访问时的权限拦截、统一访问日志记…

【python】模拟巴特沃斯滤波器

巴特沃斯滤波器&#xff08;Butterworth Filter&#xff09;&#xff0c;以其设计者斯蒂芬巴特沃斯&#xff08;Stephen Butterworth&#xff09;的名字命名&#xff0c;是一种具有平滑频率响应的滤波器。这种滤波器在频域中具有非常平坦的无波纹响应&#xff0c;直到它达到截止…

【springboot基础】如何搭建一个web项目?

正在学习springboot&#xff0c;还是小白&#xff0c;今天分享一下如何搭建一个简单的springboot的web项目&#xff0c;只要写一个类就能实现最基础的前后端交互&#xff0c;实现web版helloworld &#xff0c;哈哈&#xff0c;虽然十分简陋&#xff0c;但也希望对你理解web运作…

ssm115乐购游戏商城系统+vue

毕业生学历证明系统 设计与实现 内容摘要 如今社会上各行各业&#xff0c;都喜欢用自己行业的专属软件工作&#xff0c;互联网发展到这个时候&#xff0c;人们已经发现离不开了互联网。新技术的产生&#xff0c;往往能解决一些老技术的弊端问题。因为传统毕业生学历信息管理难…

iOS 17 / iPad OS 17屏蔽更新

iOS 17 / iPad OS 17屏蔽更新 1&#xff0c;进入屏蔽iOS更新的描述文件下载链接 下载链接 wx 搜索 Geek 前端发送屏蔽更新进行获取 2&#xff0c;复制这段链接&#xff0c;在Safari浏览器中打开&#xff0c;注意打开后别点击下载&#xff01;要先改时间&#xff01; 3&#…

感知机简介

感知机简介 导语感知机简单逻辑电路实现权重和配置与/或/与非与门实现与非门实现或门实现 线/非线性单/多层感知机异或 总结参考文献 导语 学习感知机有助于更好的理解深度学习的神经元、权重等概念&#xff0c;感知机的结构和概念很简单&#xff0c;只要学过基本线性代数、数…

华为静态路由跨网段通信eNSP

拓扑图&#xff1a; 底层原理&#xff1a; 通信需要4个地址 源MAC 源IP 目标MAC 目标IP ARP地址解析协议 通过ip地址解析MAC 如果是相同的网段直接通过 arp直接发送广播 谁是192.168.1.2 我需要的MAC 1.2就会回应告诉 1.1他的MAC 1.1会封装4个地址 发送方的IP MAC 接受方IP和MA…

景源畅信:抖音小店有哪些人气品类?

抖音小店作为短视频平台中的一股清流&#xff0c;已经成为了众多商家和消费者关注的焦点。在这个平台上&#xff0c;有各种各样的商品琳琅满目&#xff0c;让人眼花缭乱。那么&#xff0c;抖音小店有哪些人气品类呢?下面就从四个不同的方面来详细阐述这个问题。 一、美妆护肤类…