README.md 24.3 KB
Newer Older
1
> uni-starter目前还处于内测阶段,内测QQ群号:869926521,欢迎大家加入!内测期间享受有疑问实时解答的福利。
DCloud_JSON's avatar
DCloud_JSON 已提交
2 3
### ps:文档处于完善过程中

DCloud_JSON's avatar
DCloud_JSON 已提交
4
### 介绍
5 6
`uni-starter`,是一个云端一体的、集成了商用项目开发常见功能的项目模板。
如果说uniCloud admin是管理端项目的基础模板,那么uni-starter则是用户端、尤其是移动端的基础模板。
7
在HBuilderX新建项目时选择`uni-starter`项目模板,在这个模板基础之上快速填充自己的业务,即可很快完成一个应用。
8
地址:[https://codechina.csdn.net/dcloud/uni-starter.git](https://codechina.csdn.net/dcloud/uni-starter.git)
DCloud_JSON's avatar
DCloud_JSON 已提交
9 10

#### 项目背景
11
我们一直想出一个结合uni-app、uniCloud和openDB以及uni-id和uniCloud admin等,uni全家桶的项目模板;
12
为了照顾各类应用的开发者,我们取交集最终罗列了如下功能,发现这些就是除业务逻辑外的项目基本功能并把它命名为`uni-starter`
DCloud_JSON's avatar
DCloud_JSON 已提交
13 14 15
uni-starter将节省开发者大量的时间,让开发者集中精力在自己的特色业务上。
有了uni-starter,再加上schema2code生成前端页面,一个简单应用就可以快速完成。
uni-starter + uniCloud admin,应用开发从未如此简单快捷!
16
### 界面效果
17 18 19 20 21 22 23 24
<img src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/c2362519-8131-4071-b08a-8175e11b9341.jpg" />
<img src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/61e0f3d3-d726-4973-865c-e6ee0bdd0870.jpg" />
<img src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/644bab3c-1f90-46ba-a920-f464b52d0e36.jpg" />
<img src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/97db3e92-c3b3-4e32-bfb8-c348f9c9cd61.jpg" />
<img src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/a1d53005-5d45-45d1-b048-a7260a478edf.jpg" />
<img src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/d41b871f-d47f-4e86-b2f1-2b1a74a8a4bd.jpg" />
<img src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/b0d7f5e7-2e16-4b3e-a123-6e9cd97582d7.jpg" />
<img src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/e03ad65d-11bb-4697-81b2-d13af42f0441.jpg" />
25
<div style="clear: both;"></div>
26 27 28 29 30 31 32 33
<style>
img{
	box-shadow:0 0 2px #eeeeee;
	width:200px;
	margin:15px 5vw 0 0;
	float:left
}
</style>
34

35
### uni-starter集成的功能包括:
DCloud_JSON's avatar
DCloud_JSON 已提交
36
1. 个人中心:登录注册(含用户名密码登录、手机号验证码登录、app一键登录、微信登录、Apple登录、微信小程序登录)、修改密码、忘记密码、头像更换、昵称修改、积分查看、指纹绑定、退出登录
DCloud_Heavensoft's avatar
DCloud_Heavensoft 已提交
37 38 39 40 41 42
2. 设置:App更新(整包升级、wgt升级、强制升级,后台搭配uniCloud admin的升级中心插件管理)、权限引导(app)、推送开关(app)、清除缓存(app)、用户协议、隐私协议(app)、问题与反馈、分享推荐、关于
3. 启动引导:iOS初次启动被用户禁止网络权限后引导开启、Android弹出隐私协议后再申请权限
4. 首页集成banner(后台搭配uniCloud admin的banner插件管理)、搜索、列表、详情、分享,均为云端一体。实际使用中将clientDB的表名更改为自己业务表名即可
5. 首页采用nvue,fast编译模式,加快App端启动速度
6. 内置联网失败的重试页面(不是错误弹框,页面有重试按钮)、更漂亮的分享菜单页面
7. 内置拦截器:
DCloud_JSON's avatar
DCloud_JSON 已提交
43
	- 页面路由拦截,配置需强制登录的页面;打开时检测,如果token无效就自动跳转到登录页
DCloud_JSON's avatar
DCloud_JSON 已提交
44 45
	- 优雅实现:自动引导打开`选择图片`所需要的权限。当调用`uni.chooseImage`时检测到无权限自动开启引导。并不是在每次调用接口时处理这类问题,你可以参考该例子做更多该类场景的处理。uni-starter也会持续完善
8. h5版在页面顶部引导用户`点击下载App`
DCloud_Heavensoft's avatar
DCloud_Heavensoft 已提交
46

DCloud_JSON's avatar
DCloud_JSON 已提交
47 48 49 50 51
### 功能模块介绍
#### 1. 拦截器与路由守卫
第三方路由拦截库,一般带有windows对象等问题并不适合在uni-app中使用;另外传统路由拦截方式都是给原生方法做嵌套,首先这种写法并不优雅,另外不同项目的作者可能会不同的第三方路由库,这非常不利于生态的建设。你可能从插件市场拉下来一个项目有太多的学习成本,与你自有项目结合有大量差异需要去磨平。为此`uni-starter`基于`uni.addInterceptor`拦截器。
拦截器顾名思义,是在框架方法执行的各个环节(包含:拦截前触发、成功回调拦截、失败回调拦截、完成回调拦截)篡改参数或终止运行。
```
DCloud_JSON's avatar
DCloud_JSON 已提交
52
	const {"router": {needLogin,login} } = uniStarterConfig //需要登录的页面
DCloud_JSON's avatar
DCloud_JSON 已提交
53 54 55 56 57 58 59 60
	let list = ["navigateTo", "redirectTo", "reLaunch", "switchTab"];
	list.forEach(item => { //用遍历的方式分别为,uni.navigateTo,uni.redirectTo,uni.reLaunch,uni.switchTab这4个路由方法添加拦截器
		uni.addInterceptor(item, {
			invoke(e) { // 调用前拦截
				//获取用户的token
				const token = uni.getStorageSync('uni_id_token')
				//获取当前页面路径(即url去掉"?"和"?"后的参数)
				const url = e.url.split('?')[0]
DCloud_JSON's avatar
DCloud_JSON 已提交
61
				//拦截强制登录页面
DCloud_JSON's avatar
DCloud_JSON 已提交
62 63
				if (needLogin.includes(url) && token == '') {
					uni.showToast({
DCloud_JSON's avatar
DCloud_JSON 已提交
64
						title: '该页面需要登录才能访问,请先登录',
DCloud_JSON's avatar
DCloud_JSON 已提交
65 66 67 68 69 70 71
						icon: 'none'
					})
					uni.navigateTo({
						url: "/pages/ucenter/login-page/index/index"
					})
					return false
				}
DCloud_JSON's avatar
DCloud_JSON 已提交
72
				//控制登录优先级
DCloud_JSON's avatar
DCloud_JSON 已提交
73
				if (url == '/pages/ucenter/login-page/index/index') {
DCloud_JSON's avatar
DCloud_JSON 已提交
74
					//一键登录(univerify)、账号(username)、验证码登录(短信smsCode)
DCloud_JSON's avatar
DCloud_JSON 已提交
75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90
					if (login[0] == 'univerify') {
						if(e.url == url) { e.url += '?' } //添加参数之前判断是否带了`?`号如果没有就补上,因为当开发场景本身有参数的情况下是已经带了`?`号
						e.url += "univerify_first=true"
					} else if (login[0] == 'username') {
						e.url = "/pages/ucenter/login-page/pwd-login/pwd-login"
					}
				}
				return true
			},
			fail(err) { // 失败回调拦截 
				console.log(err);
			},
		})
	})
```

DCloud_JSON's avatar
DCloud_JSON 已提交
91 92 93
#### 2.登录模块
- uni-start集成的登录方式有:验证码登录(smsCode)、读取手机SIM卡一键登录(univerify)、账号密码登录(username)、微信登录(weixin)、苹果登录(apple)
- 使用方式:在 `uni-starter.config.js`->`router`->`login`下完全列举你需要的登录方式。这里支持用[条件编译](https://uniapp.dcloud.io/platform?id=%e6%9d%a1%e4%bb%b6%e7%bc%96%e8%af%91)因此你可以配置在不同平台下拥有的登录方式。
94 95 96 97 98 99 100
- 优先级策略:
	如果:配置内容为:["username","smsCode"],用户执行如下代码:
	```
	uni.navigateTo({
		url: "/pages/ucenter/login-page/index/index"
	})
	```
DCloud_JSON's avatar
DCloud_JSON 已提交
101
	访问登录页面,但会被拦截器自动切换到“配置的第0项的登录方式对应的页面”,即账户登录方式页面,路径:`/pages/ucenter/login-page/pwd-login/pwd-login`
102

DCloud_JSON's avatar
DCloud_JSON 已提交
103
- 生效策略:未列举到的或设备环境不支持的登录方式将被隐藏。
DCloud_JSON's avatar
DCloud_JSON 已提交
104
- 配置:
105
	+ 服务端:uni-starter服务端使用[uni-config-center](https://ext.dcloud.net.cn/plugin?id=4425)统一管理这些配置,文件路径`/uni_modules/uni-config-center/uniCloud/cloudfunctions/common/uni-config-center/uni-id/config.json`详情下文[目录结构](#id=catalogue) [配置说明](https://uniapp.dcloud.io/uniCloud/uni-id?id=configjson%e7%9a%84%e8%af%b4%e6%98%8e)
106
	+ 应用模块:`manifest.json` App模块配置 --> OAuth(登录鉴权)--> 勾选并配置你所需要的模块
107 108 109 110 111 112 113
- 短信登陆:
	+ 使用本功能需要在[DCloud开发者中心](https://dev.dcloud.net.cn/uniSms)开通并充值
	+ 教程参考[短信服务开通指南](https://ask.dcloud.net.cn/article/37534)
	+ 修改短信注册/登陆发生验证码的模板id,在文件`/uniCloud-aliyun/cloudfunctions/user-center/index.js` 搜索 `const templateId = '11753'` 替换为自己申请的模板id
- 一键登录:
	+ [开通配置](https://dev.dcloud.net.cn/uniLogin)
	+ [使用指南](https://uniapp.dcloud.io/univerify)
DCloud_JSON's avatar
DCloud_JSON 已提交
114
-  [苹果登陆集成指南](https://ask.dcloud.net.cn/article/36651) 
DCloud_JSON's avatar
DCloud_JSON 已提交
115 116
#### 3.h5版在页面顶部引导用户`点击下载App`
- 把h5端用户引流到APP端是一个非常常用的功能,相对于h5,APP端有更高的用户留存和更好的产品体验。
117
- 这同时也是一个演示开发者如何在h5端做全局悬浮块的例子。你可以在`/common/openApp.js`中修改他的样式等代码等,注意他只支持普通js语法。
DCloud_JSON's avatar
DCloud_JSON 已提交
118 119

#### 4.分享模块
120
- 应用配置:`manifest.json` App模块配置 --> Share --> 勾选并配置你所需要的模块
DCloud_JSON's avatar
DCloud_JSON 已提交
121 122 123 124
- 分享功能配置参数,随着应用的业务场景决定,在各场景调用的时候配置。参考uni-starter的`/pages/list/detail.vue``methods -> shareClick`
- 更多`uni-share`的介绍 [详情](https://ext.dcloud.net.cn/plugin?id=4860)

#### 5.升级中心相关
125 126 127 128 129
为了解决开发者维护多个 App 升级繁琐,重复逻辑过多,管理不便的问题,升级中心`uni-upgrade-center`应运而生。
提供了简单、易用、统一的 App 管理、App 版本管理、安装包发布管理,升级检测更新管理。
- 升级中心分为两个部分:`uni-upgrade-center` Admin管理后台和`uni-upgrade-center-app`前台检测更新。
- `uni-upgrade-center`的介绍 [详情](https://ext.dcloud.net.cn/plugin?id=4542)
- `uni-upgrade-center-app`的介绍 [详情](https://ext.dcloud.net.cn/plugin?id=4470)
DCloud_JSON's avatar
DCloud_JSON 已提交
130 131 132 133 134 135 136

#### 6.指纹识别模块
- `manifest.json` App模块配置 --> `Fingerprint`指纹识别

#### 7.消息推送模块
- `manifest.json` App模块配置 --> `push`消息推送

137 138 139 140
#### 8.意见反馈
- 客户端[详情](https://ext.dcloud.net.cn/plugin?id=50)
- admin端[详情](https://ext.dcloud.net.cn/plugin?id=4992)

DCloud_JSON's avatar
DCloud_JSON 已提交
141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190
#### 9.隐私政策弹框
根据工业和信息化部关于开展APP侵害用户权益专项整治要求,App提交到应用市场必须满足以下条件:
- 应用启动运行时需弹出隐私政策协议,说明应用采集用户数据
- 应用不能强制要求用户授予权限,即不能“不给权限不让用”
+ 如不希望应用启动时申请“读写手机存储”和“访问设备信息”权限,请参考:https://ask.dcloud.net.cn/article/36549

配置弹出“隐私协议和政策”打开项目的manifest.json文件,切换到“源码视图”项
`manifest.json` -> `app-plus` -> `privacy` 节点下添加 prompt节点
```
"privacy" : {
	"prompt" : "template",
	"template" : {
		"title" : "服务协议和隐私政策",
		"message" : "  请你务必审慎阅读、充分理解“服务协议”和“隐私政策”各条款,包括但不限于:为了更好的向你提供服务,我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。<br/>  你可阅读<a href=\"https://ask.dcloud.net.cn/protocol.html\">《服务协议》</a>和<a href=\"https://ask.dcloud.net.cn/protocol.html\">《隐私政策》</a>了解详细信息。如果你同意,请点击下面按钮开始接受我们的服务。",
		"buttonAccept" : "同意",
		"buttonRefuse" : "暂不同意"
	}
}
```
- prompt
  字符串类型,必填,隐私政策提示框配置策略,可取值template、custom、none,默认值为none
  + template
     使用原生提示框模板,可自定义标题、内容已经按钮上的文本
  + custom
     自定义隐私政策提示框,uni-app项目中推荐使用nvue页面进行自定义,5+ APP使用html页面进行自定义
  + none
    不弹出隐私政策提示框
- template
  json格式,可选,模板提示框上显示的内容
	+ title
	  模板提示框上的标题,默认为“服务协议和隐私政策”
	+ message
	  模板提示框上的内容,richtext类型字符串,支持a/font/br等节点,点击a链接会调用内置页面打开其href属性中链接地址。
	  **注意:务必配置此提示内容,或参考上面示例内容并修改《服务协议》和《隐私政策》链接地址**
	+ buttonAccept
	  模板提示框上接受按钮的文本,默认值为“我知道了”
	+ buttonRefuse
	  模板提示框上拒绝按钮的文本,默认不显示此按钮
	+ second
	  HBuilderX3.1.12+版本新增支持隐私提示框二次确认提示,用于配置二次确认提示框显示内容,message属性值不为空时弹出二次确认提示框
		+ title 二次确认提示框上的标题
		+ message 二次确认提示框上的内容,支持richtext类型字符串
		+ buttonAccept 二次确认提示框上接受按钮的文本
		+ buttonRefuse 二次确认提示框上拒绝按钮的文本
> 更多Android平台隐私与政策提示框配置方法,[详情](https://ask.dcloud.net.cn/article/36937)
#### 注意:配置后提交云端打包后生效。理论上绝大部分和`manifest.json`生效相关的配置均需要提交云打包后生效




DCloud_JSON's avatar
DCloud_JSON 已提交
191 192 193 194 195 196 197 198 199 200 201 202
### 应用启动时序介绍
文件路径: App.vue
```
	import initApp from '@/common/appInit.js';
	export default {
		onLaunch: function() {
			initApp();
		}
	}
```
onLaunch生命周期执行了
1. 全局监听clientDB的err事件,
DCloud_JSON's avatar
DCloud_JSON 已提交
203 204 205
	- 判断是否为token过期失效等需要重新登录的问题。自动跳转到登录页面
	- 检测本地的token是否有效(存在且并未过期)否则跳转到登录页面
2. 预登录一键登录功能
DCloud_JSON's avatar
DCloud_JSON 已提交
206 207 208 209 210 211
3. 执行了initApp()包含以下操作
	1. 读取uni-starter.config并挂载到globalData的config下
	2. 读取应用版本号,并存到globalData下
	3. 检查是否有可更新的应用版本,决定是否启动在线更新版本
	4. 监听设备的网络变化并以uni.showToast APi的方式提醒用户
	5. 使用[拦截器](https://uniapp.dcloud.io/api/interceptor?id=addinterceptor) 实现
DCloud_JSON's avatar
DCloud_JSON 已提交
212
		- 页面路由拦截,配置需强制登录的页面;打开时检测,如果token无效就自动跳转到登录页
DCloud_JSON's avatar
DCloud_JSON 已提交
213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234
		- 优雅实现:自动引导打开`选择图片`所需要的权限。当调用`uni.chooseImage`时检测到无权限自动开启引导。并不是在每次调用接口时处理这类问题,你可以参考该例子做更多该类场景的处理。uni-starter也会持续完善

## 快速体验部署流程
#### 1. 开通uniCloud
- 开通`uniCloud`:本项目是云端一体的,它的云端代码需要部署在uniCloud云服务空间里,需要开通uniCloud。在[https://unicloud.dcloud.net.cn/](https://unicloud.dcloud.net.cn/)登录,按云厂商要求进行实名认证。
- 在uniCloud认证通过后,创建一个服务空间给本项目使用。选择阿里云或腾讯云均可。[参考](https://uniapp.dcloud.net.cn/uniCloud/price)
- 使用HBuilderX 3.1以上版本(最好是最新版),把本项目导入到HBuilderX中,在项目根目录uniCloud上点右键菜单,关联服务空间 -> 选择之前创建的服务空间

#### 2. 关联项目与云服务空间
<img class="cloud" src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/f3f36e4a-77e6-495c-bb85-5fc6999e29e1.jpg" />
<img class="cloud" src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/dd39dfcc-60c8-4f9f-a4d7-6b08f39e737e.jpg" />
<img class="cloud" src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e/350f5e46-976e-4c5b-be49-e5c3908b03f4.jpg" />
<div style="clear: both;"></div>
<style>
img.cloud{
	box-shadow:0 0 2px #eeeeee;
	width:400px;
	margin:15px 5vw 0 0;
	float:left
}
</style>

DCloud_JSON's avatar
DCloud_JSON 已提交
235 236
##### 配置文件
uni-starter提供了uni-starter.config.js,可指定该应用是否强制登录才能进入首页,可配置选择登录注册方式以及不同方式的优先级等。配置项内容如下:
DCloud_JSON's avatar
DCloud_JSON 已提交
237 238 239 240 241 242 243 244 245
```
module.exports = {
	"h5": {
		"url": "https://static-76ce2c5e-31c7-4d81-8fcf-ed1541ecbc6e.bspapp.com", //	前端网页托管的域名
		 // 在h5端全局悬浮引导用户下载app的功能 更多自定义要求在/common/openApp.js中修改
		"openApp": {
			//点击悬浮下载栏后打开的网页链接
			"openUrl": 'https://sj.qq.com/myapp/detail.htm?apkName=com.tencent.android.qqdownloader&info=6646FD239A6EBA9E2DEE5DFC7E18D867',
			//左侧显示的应用名称
246
			"appname": 'uni-starter',
DCloud_JSON's avatar
DCloud_JSON 已提交
247 248 249 250 251 252 253
			//应用的图标
			"logo": './static/logo.png',
		}
	},
	"mp": {
		"weixin": {
			//微信小程序原始id,微信小程序分享时
DCloud_JSON's avatar
DCloud_JSON 已提交
254
			"id": "gh_132465798"
DCloud_JSON's avatar
DCloud_JSON 已提交
255 256 257
		}
	},
	"router": {
DCloud_JSON's avatar
DCloud_JSON 已提交
258
		//配置需要路由拦截的页面地址,在打开这些页面之前会自动检查(无需联网)uni_id_token的值,如果token无效就自动跳转到登录页
DCloud_JSON's avatar
DCloud_JSON 已提交
259 260 261 262 263
		"needLogin": [
			"/pages/ucenter/userinfo/userinfo",
			"/uni_modules/uni-news-favorite/pages/uni-news-favorite/list",
			"/pages/ucenter/userinfo/uploadCutImageToUnicloud"
		],
DCloud_JSON's avatar
DCloud_JSON 已提交
264
		"login": ["smsCode","univerify", "username", "weixin", "apple"],
DCloud_JSON's avatar
DCloud_JSON 已提交
265
		/* 
DCloud_JSON's avatar
DCloud_JSON 已提交
266 267
			这里会根据数组的第0项,决定登录方式的第一优先级是哪种登录方式。
			所有你希望拥有的登录方式这里都需要一一列举,未列举到的或设备环境不支持的登录方式将被隐藏。
DCloud_JSON's avatar
DCloud_JSON 已提交
268
			如果你需要在不同平台有不同的配置,直接用条件编译即可。
DCloud_JSON's avatar
DCloud_JSON 已提交
269 270 271 272 273
		*/
	},
	//关于应用
	"about": {
		//应用名称
274
		"appName": "uni-starter",
DCloud_JSON's avatar
DCloud_JSON 已提交
275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301
		//应用logo
		"logo": "/static/logo.png",
		//公司名称
		"company": "数字天堂(北京)网络技术有限公司",
		//口号
		"slogan": "为开发而生",
		//政策协议
		"agreements": [{
				"title": "用户服务协议", //协议名称
				"url": "https://ask.dcloud.net.cn/protocol.html" //对应的网络链接
			},
			{
				"title": "隐私政策",
				"url": "https://ask.dcloud.net.cn/protocol.html"
			}
		],
		//应用的链接,用于分享到第三方平台和生成关于我们页的二维码
		"download": "https://m3w.cn/uniapp"
	},
	//用于打开应用市场评分界面
	"marketId":{
		"ios":"id1417078253",
		"android":"123456"
	}
}
```

DCloud_JSON's avatar
DCloud_JSON 已提交
302
#### 目录结构@catalogue
DCloud_JSON's avatar
DCloud_JSON 已提交
303
<pre>
304
uni-starter
DCloud_JSON's avatar
DCloud_JSON 已提交
305 306 307
├─uniCloud-aliyun	
│	├─cloudfunctions 云函数目录
│	|	├─common 公共模块
308
│	│	|	├─uni-config-center		uni-starter的服务端配置中心,项目所有云函数的配置在这里填写 <a target="_blank" href="https://ext.dcloud.net.cn/plugin?id=4425">详情</a>
DCloud_JSON's avatar
DCloud_JSON 已提交
309 310
│	│	|	|	├─index.js			config-center入口文件
│	│	|	|	└─uni-id			uni-id模块配置目录
DCloud_JSON's avatar
DCloud_JSON 已提交
311
│	│	|	|		├─config.json	uni-id对应的配置数据:微信登录、一键登录、短信验证码登录等key都在这里填写<a target="_blank" href="https://ext.dcloud.net.cn/plugin?id=4425">详情</a>
DCloud_JSON's avatar
DCloud_JSON 已提交
312 313 314 315 316 317
│	│	|	|		└─file.cert		uni-id依赖的配置文件,假如你使用微信发红包功能,需要的证书文件就是放到这里
│	|	|	└───uni-id				uni-id用户体系 <a target="_blank" href="https://uniapp.dcloud.io/uniCloud/uni-id">详情</a>
│	|	├─uni-analyse-searchhot		云端一体搜索模板依赖的云函数 <a target="_blank" href="https://ext.dcloud.net.cn/plugin?id=3851">详情</a>
│	|	└─user-center				用户中心云函数,实现用户注册、修改密码、发送验证码、快捷登录(微信、短信、账户、一键登录)
│	└──database						云数据目录
│		├─db_init.json				db_init.json初始化数据库文件,其中不再包含schema <a target="_blank" href="https://uniapp.dcloud.net.cn/uniCloud/hellodb?id=db-init">详情</a>
318 319 320 321 322 323 324 325 326 327
│		├─opendb-app-versions.schema.json		应用版本,表结构文件
│		├─opendb-banner.schema.json	        	横幅数据表,表结构文件
│		├─opendb-feedback.schema.json	        意见反馈表,表结构文件
│		├─opendb-news-articles.schema.json	    新闻文章表,表结构文件
│		├─opendb-news-categories.schema.json	新闻分类表,表结构文件
│		├─opendb-news-comments.schema.json		新闻评论表,表结构文件
│		├─opendb-news-favorite.schema.json		新闻收藏表,表结构文件
│		├─opendb-search-hot.schema.json			热门搜索表,表结构文件
│		├─opendb-search-log.schema.json			搜索记录表,表结构文件
│		├─opendb-verify-codes.schema.json		验证码表,表结构文件
DCloud_JSON's avatar
DCloud_JSON 已提交
328
│		├─uni-id-log.schema.json	        	登录日志表,表结构文件
329 330
│		├─uni-id-scores.schema.json	        	用户积分表,表结构文件
│		└─uni-id-users.schema.json	        	用户表,表结构文件
DCloud_JSON's avatar
DCloud_JSON 已提交
331
├─pages										业务页面文件存放的目录
DCloud_JSON's avatar
DCloud_JSON 已提交
332
│	├─common						
DCloud_JSON's avatar
DCloud_JSON 已提交
333 334
│	│	└─webview							webview目录
│	│		└─webview.vue					webview页面	用于实现跨端的web页面浏览
DCloud_JSON's avatar
DCloud_JSON 已提交
335
│	├─grid
DCloud_JSON's avatar
DCloud_JSON 已提交
336
│	│	└─grid.vue	 						带宫格和banner的示例页面
DCloud_JSON's avatar
DCloud_JSON 已提交
337
│	├─list
DCloud_JSON's avatar
DCloud_JSON 已提交
338
│	│	├─list.vue	 						新闻列表
DCloud_JSON's avatar
DCloud_JSON 已提交
339
│	│	├─search
DCloud_JSON's avatar
DCloud_JSON 已提交
340 341
│	│	│	└─search						云端一体搜索插件
│	│	└─detail.vue						新闻详情
DCloud_JSON's avatar
DCloud_JSON 已提交
342
│	├─ucenter
DCloud_JSON's avatar
DCloud_JSON 已提交
343
│	│	├─about								关于我们
DCloud_JSON's avatar
DCloud_JSON 已提交
344
│	│	│	└─about
DCloud_JSON's avatar
DCloud_JSON 已提交
345 346
│	│	├─login-page						登录模块
│	|	|	├─common						登录模块公共库
DCloud_JSON's avatar
DCloud_JSON 已提交
347 348
│	│	│	│	├─login-page.css			公共样式库
│	│	│	│	├─login-page.mixin.js		公共mixin
DCloud_JSON's avatar
DCloud_JSON 已提交
349 350 351 352
│	│	│	│	└─loginSuccess.js			公共登录成功后操作
│	|	|	├─index							短信验证码登录,手机号码输入页面
│	|	|	├─phone-code					短信验证码登录,验证码输入页面
│	|	|	├─pwd-login						账户密码登录
DCloud_JSON's avatar
DCloud_JSON 已提交
353 354
│	|	|	├─pwd-retrieve					密码重置
│	│	│	└─register						注册账户模块
DCloud_JSON's avatar
DCloud_JSON 已提交
355 356
│	│	│		├─validator.js
│	│	│		└─register.vue
DCloud_JSON's avatar
DCloud_JSON 已提交
357
│	│	├─read-news-log						新闻阅读记录
DCloud_JSON's avatar
DCloud_JSON 已提交
358
│	│	│	└─read-news-log
DCloud_JSON's avatar
DCloud_JSON 已提交
359
│	│	├─settings						
DCloud_JSON's avatar
DCloud_JSON 已提交
360
│	│	│	├─dc-push
DCloud_JSON's avatar
DCloud_JSON 已提交
361 362 363
│	│	│	│	└─push.js					push权限操作SDK
│	│	│	└─settings.vue					app设置
│	│	├─userinfo							用户个人信息
DCloud_JSON's avatar
DCloud_JSON 已提交
364
│	│	│	├─bind-mobile
DCloud_JSON's avatar
DCloud_JSON 已提交
365 366
│	│	│	│	└─bind-mobile.vue			绑定手机号码
│	│	│	├─limeClipper					图片裁剪插件,来源[limeClipper](https://ext.dcloud.net.cn/plugin?id=3594) @作者: 陌上华年
DCloud_JSON's avatar
DCloud_JSON 已提交
367 368 369 370 371 372 373 374
│	│	│	│	├─images
│	│	│	│	│	├─photo.svg
│	│	│	│	│	└─rotate.svg
│	│	│	│	├─index.css
│	│	│	│	├─limeClipper.vue
│	│	│	│	├─README.md
│	│	│	│	└─utils.js
│	│	│	├─main.js
DCloud_JSON's avatar
DCloud_JSON 已提交
375
│	│	│	├─uploadCutImageToUnicloud.vue	引用limeClipper的图片裁剪模块,为了方便二开可能会出现兼容`vue``nvue`,所以做成了`页面`而不是`组件`
DCloud_JSON's avatar
DCloud_JSON 已提交
376
│	│	│	└─userinfo.vue
DCloud_JSON's avatar
DCloud_JSON 已提交
377
│	|	└─ucenter.vue						用户中心
DCloud_JSON's avatar
DCloud_JSON 已提交
378 379 380 381 382
│	|
├─static	 						存放应用引用的本地静态资源(如图片、视频等)的目录,<b>注意:</b>静态资源只能存放于此
├─uni_modules						存放[uni_module](/uni_modules)规范的插件。
├─main.js							Vue初始化入口文件
├─App.vue							应用配置,用来配置App全局样式以及监听 <a href="/collocation/frame/lifecycle?id=应用生命周期">应用生命周期</a>
383
├─baseconfig						uni-starter的前端的配置文件,项目所有模块的配置在这里填写。详见该文件的代码注释。
DCloud_JSON's avatar
DCloud_JSON 已提交
384 385
├─manifest.json	 					配置应用名称、appid、logo、版本等打包信息,<a href="/collocation/manifest">详见</a>
└─pages.json						配置页面路由、导航条、选项卡等页面类信息,<a href="/collocation/pages">详见</a>
DCloud_JSON's avatar
DCloud_JSON 已提交
386
</pre>
387
完整的uni-app目录结构[详情](https://uniapp.dcloud.io/frame?id=%e7%9b%ae%e5%bd%95%e7%bb%93%e6%9e%84)
DCloud_JSON's avatar
DCloud_JSON 已提交
388 389 390

### 注意事项
1. 真机运行需要制作自定义基座,制作后选择运行到自定义基座
DCloud_JSON's avatar
DCloud_JSON 已提交
391 392
2. 苹果登录的图标,需要满足苹果应用市场的审核规范请勿随便修改;如需修改请先阅读:[Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/sign-in-with-apple/overview/buttons/)
3. 应用登录功能,默认不勾选同意隐私权限是响应安卓应用市场的规范;请勿修改该逻辑。
DCloud_JSON's avatar
DCloud_JSON 已提交
393

DCloud_JSON's avatar
DCloud_JSON 已提交
394
### FAQ:常见问题
DCloud_JSON's avatar
DCloud_JSON 已提交
395
1. 提示“公共模块uni-id缺少配置信息”解决方案:在cloudfunctions右键‘上传所有云函数、公共模块及actions’之后,需要在cloudfunctions -> common -> uni-config-center 目录单独上传一次,右键‘上传公共模块’。
DCloud_JSON's avatar
DCloud_JSON 已提交
396 397 398
2. 本项目代码可以商用,无需为DCloud付费。但不能把本项目的代码改造用于非uni-app和uniCloud的技术体系。即,不能将后台改成php、java等其他后台,这将违反使用许可协议。

### 第三方插件(感谢插件作者,排名不分前后):
DCloud_JSON's avatar
DCloud_JSON 已提交
399 400
1. 图片裁剪 [limeClipper](https://ext.dcloud.net.cn/plugin?id=3594) @作者: 陌上华年
2. 二维码生成 [Sansnn-uQRCode](https://ext.dcloud.net.cn/plugin?id=1287) @作者: 3snn