# 部署
# 1. 编译、部署和source map使用
Vue 3.0:
- (1) 首先完善小程序的信息,小程序信息为 src/appConfig/app.config.mjs 内容为,此内容当被用户进行收藏操作后显示到小程序桌面上。
export default { // uuid, 和其他小程序区分的标识, 格式要求为 公司domain/产品,例如 "xxxx.domain.cn/XXXX", domain中不要有字符/ AppName: "-", // 显示在桌面系统上的名称,可以有特殊字符和中文,要求UTF8格式 AppTitle: "-", // 应用版本信息,只是用于显示,引擎不会拿其作为版本判断依据 AppVersion: "1.00", // 上线前请更换, 此为小程序之家APK上线后的图标规范 AppIcon: "https://oss.image.qcast.cn/JsViewVideo/ImageTestSample/JsvMiniAppIcon256x256.png", // 上线前请更换, 此为小程序之家APK上线后的图标规范 AppRectIcon: "https://oss.image.qcast.cn/JsViewVideo/ImageTestSample/JsvMiniAppIcon300x160.png", }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
(2) 完善 src/appConfig/jsview.config.mjs,
【非常重要】修改 jsviewConfig.localStorage.domain 到合适的值, 将数据从和其他小程序公用的测试域切换出来。
export default { jsviewConfig: { // (可选配置)remote loader remoteLoader: null, // (可选配置)localStorage支持 localStorage: { // 默认自动使用app.config.mjs的AppName作为domain, 可取值: // null, 'defualt': 使用 app.config.mjs 中的AppName作为Domain, 和其他小程序数据完全隔离,不担心重名问题 // 'follow-url': 使用运行时的 window.location.hostname 作为domain // 其他字符串: 使用给定字符串作为domain domain: null, }, ...
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
(3) 完善签名信息,参考 src/appConfig/HOW_TO_CONFIG.md 的说明来制作
(4) 联系我们完成上线协议签后获得js端授权,授权为互联网下的服务端授权。独立内网场景下,我们会协助部署内网授权。
同时,请关注鉴权的状态,避免上线后由于下面的常见原因:
- js编译签名文件使用错误
- 所运行的apk和所授权的不一致(内网场景) 其他原因请见下文代码中的errorCode
下面是脚手架中已经预制的鉴权状态回馈处理(permissionResult.tsx),请关注其打印信息:
export function listenerToPermissionResult() {
// 注册监听后,api方式的授权校验,会在延迟的1分钟后收到校验结果
(window as any).JsView?.addEventListener("onAuthResult", (info: any) => {
// info接口:
// success(bool): 当次授权校验是否通过
// showAlert(bool): APP界面右下角展示未授权提示,满足下面条件之一时会展示
// 1. app运行的main.js是未进行签名(签名参考src/appConfig/中的描述)的,提示"npm start 调试模式"
// 2. 仅在在线授权未通过, 并且达到允许次数时生效(每日累计1次, 最多累计30天), 提示"抢先版内核"
// errorCount(int): 在线授权失败累计的次数, 授权成功后清0
// checkType(string): 授权的校验方式, 例如: 调试模式 devMode, 在线校验方式: api
// customDescribe: 授权的描述, 许可范围等描述
// errorCode: 授权失败的错误码
// -1: apk签名不匹配(仅离线校验时)
// -2: js的app name未登记
// -3: js的app签名和app name登记信息不匹配
// -4: permission.js文件过期(仅离线校验时, 可通过商务洽谈无限期授权)
// -5: core版本不匹配
// -6: 分支名不匹配
// -7: 在线鉴权时未通过的统一错误码(后台详细错误码搭建中...)
// -8: 页面为npm start的调试模式(开发人员调试时才会出现此状态)
// -101: 本地permission.js文件格式错误
// -102: permission.js文件授权信息中core版本无法正确解析为数字错误
// -103: permission.js文件授权信息中的日期格式错误
// -105: 在线鉴权api请求失败错误
if (!info.success) {
if (info.errorCode != -8/* -8为"调试模式" */) {
console.error("警告: 当次授权未通过, error code=" + info.errorCode);
}
} else {
console.info("授权通过:" + info.customDescribe);
}
if (info.errorCount > 0) {
console.warn(`在线授权校验失败累计了${info.errorCount}天, 请在达到30天前检查授权网络环境`);
}
if (info.showAlert
&& info.errorCode != -8/* -8为"调试模式" */) {
console.warn("注意: 右下角未授权提示已展示");
}
});
}
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
(5) 执行npm build进行编译
(6) 将dist目录部署到服务器上,注意删掉dist/debug内容(为source map)以避免源码泄漏
(7) 部署后的启动方式为
$ adb shell am start -n com.tvcode.sjcenter/com.tvcode.chmarket.MainActivity \
--es COREVERSIONRANGE [JSVIEW_CORE_PATCH_VERSION] \
--es ENGINE [JSVIEW_ENGINE_URL] \
--es URL [APP_HOMEPAGE_URL] \
2
3
4
或者
$ adb shell am start -n com.tvcode.sjcenter/com.tvcode.chmarket.MainActivity \
--es URL [APP_HOMEPAGE_URL]?coreVersionRange=[JSVIEW_CORE_PATCH_VERSION]&engineUrl=[JSVIEW_ENGINE_URL] \
2
上述命令行中''为换行链接付,实际上面命令为一条整理,而非多条指令。指令中各参数含义:
从开发环境node_modules/@shijiu/jsview/dom/target_core_revision.mjs
文件中可以获得两个字段CoreRevisionAndBranch
和JseUrl
(此文件在npm ci时也会打印)
特别注意:内核版本和EngineUrl版本会跟随npm升级而变化,每次收到npm的更新包并安装后,请重新查看target_core_revision文件,并参照着修改启动参数
- 变量JSVIEW_CORE_PATCH_VERSION(对应属性COREVERSIONRANGE): 使用上述的
CoreRevisionAndBranch
字段 - 变量JSVIEW_ENGINE_URL(对应属性ENGINE): 使用上述的
JseUrl
字段 - 变量APP_HOMEPAGE_URL(对应属性URL): 脚手架npm run-script start后,符合此格式的
http://%npm start的服务器IP%:5173/js/main.jsv.mjs
的URL
URL: 指向部署了dist目录的服务器上,dist目录中 main.jsv.mjs 或者 main.jsv.[文件内容md5值].mjs 的http地址,如下图所示中的文件。
建议用带有md5值地址的那个,因为带有md5值的地址会被JsView运行器缓存起来,会加速第二次访问的启动速度。
(8) 调试时使用source map(本地服务开启): 在devtools(使用方法),链接前打开本地source map服务:
方法1: 进入 dist/debug 目录,执行 node jsview-jsmap-serve.js
方法2: node /path/to/jsview-jsmap-serve.js ./path/to/debug/folder(相对路径)
方法3: node /path/to/jsview-jsmap-serve.js file:///path/to/debug/folder(绝对路径)(9) 打开远程的map map文件可以上传到固定的地方,以便于协同工作时更容易使用到map。 部署后,可以通过 jsview-jsmap-serve.js 程序将localhost的map请求转为向目标服务器的请求。
指令为:
(格式) node /path/to/jsview-jsmap-serve.js http://path/to/debug/folder
(样例) node node_modules/@shijiu/jsview/tools/jsview-jsmap-serve.js http://www.shijiu.test.com:5173/dist/debug/
React: TODO