# SDK 初始化
在使用小程序的API之前,需要先初始化小程序SDK。只有SDK初始化成功之后,才能使用SDK提供的API,否则 API调用都会失败。
# 1. 初始化
初始化SDK的API有两个,建议使用第二个(MopSDK.initSDK)
1、不推荐使用(后续不再维护)
/**
* @description
* @param {Object} params
* @param {string} params.appkey
* @param {string} params.secret
* @param {string} params.apiServer
* @param {string} params.apiPrefix
* @param {string} params.userId
* @param {string} params.appletText 注入小程序统称appletText字符串,默认为“小程序”。
* @param {number} params.language SDK的语言类型,默认为中文,0:中文,1:英文,其他语言得使用 customLanguagePath、localeLanguage属性。具体看文档
* @param {string} params.customLanguagePath 【iOS属性】自定义SDK的语言,优先级高于内置的 language 属性;示例:如果是放在 mainBundle 下,则设置相对路径:@"abc.lproj";如果是放在自定于 Bundle 下,则设置相对路径:@"bundleName.bundle/abc.lproj"
* @param {string} params.localeLanguage 【Android属性】自定义SDK的语言,优先级高于内置的 language 属性;语言列表可以参考:https://uutool.cn/info-i18n/ 或者Java类 【java.util.Locale】;示例:简体中文:zh_CN,繁体中文:zh_TW,英文:en
* @param {Object} param.nativeEventEmitter eventEmitter 实例
* @param {Object} param.finMopSDK nativeModules.FINMopSDK 引用
* @returns
*/
MopSDK.initialize(params)
初始化示例:
import MopSDK from 'react-native-mopsdk';
import { NativeModules, NativeEventEmitter } from 'react-native';
const eventEmitter = new NativeEventEmitter(NativeModules.FINMopSDK);
MopSDK.initialize(
{
appkey: 'xxxxxxx',
secret: 'xxxxxxx',
apiServer: 'xxxxxxx',
userId: '123456',
language: 0, // 默认为中文 ; 0:中文,1:英文
customLanguagePath:"br.lproj",//【iOS属性】如果是放在 mainBundle 下,则设置相对路径:@"abc.lproj",如果是放在自定于 Bundle 下,则设置相对路径:@"bundleName.bundle/abc.lproj"
appletText:"快应用", // 如果需要修改小程序公共UI里面的中文的:“小程序”,英文的“Mini-Program”;你需要设置属性:appletText
localeLanguage:"ja_JP",// 【Android属性】自定义SDK的语言,优先级高于内置的 language 属性;语言列表可以参考:https://uutool.cn/info-i18n/ 或者Java类 【java.util.Locale】;示例:简体中文:zh_CN,繁体中文:zh_TW,英文:en
nativeEventEmitter: eventEmitter,
finMopSDK: NativeModules.FINMopSDK
}
).then((res) => {
console.log('message: ', res);
const s = JSON.stringify(res);
this.setState({
status: 'native callback received',
message: s,
});
}).catch((error) => {
console.log('init error: ', error);
const s = 'initialize fail'
this.setState({
status: 'native callback received',
message: s,
});
})
2、推荐使用
/**
* @description Initialize the SDK with the provided configuration
* @param {Object} params
* @param {Config} params.config - Main SDK configuration
* @param {UIConfig} params.uiConfig - UI related configuration
* @param {Object} params.finMopSDK
* @param {Object} params.nativeEventEmitter
* @returns
*/
MopSDK.initSDK(params)
初始化示例:
import { NativeModules, NativeEventEmitter } from 'react-native';
// 配置项比较很多,根据初始化对于方法上面的注释导入对应需要配置的类。
// 所有和配置相关类和常量为: BOOLState, ConfigPriority, LogLevel, LanguageType, FinStoreConfig, Config, CapsuleConfig, NavHomeConfig, FloatWindowConfig, AuthButtonConfig, AuthViewConfig, UIConfig ;
// 根据需求导入即可。
import MopSDK, { Config, FinStoreConfig,BOOLState, UIConfig } from 'react-native-mopsdk';
const eventEmitter = new NativeEventEmitter(NativeModules.FINMopSDK);
let finStoreConfigA = new FinStoreConfig(
"xxxxxxxx",
"xxxxxxxx",
"xxxxxxxx");
// 可配置多个服务器
let finStoreConfigs = [finStoreConfigA];
let config = new Config(finStoreConfigs,
{userId:"123456789",
debug:true,
appletDebugMode:BOOLState.BOOLStateTrue
}) ;
let uiConfig = new UIConfig({isHideClearCacheMenu:true});
let params = {
config: config,
uiConfig: uiConfig,
finMopSDK: NativeModules.FINMopSDK,
nativeEventEmitter: eventEmitter
}
MopSDK.initSDK(params).then((res) => {
console.log('message: ', res);
const s = JSON.stringify(res);
this.setState({
status: 'native callback received',
message: s,
});
}).catch((error) => {
console.log('init error: ', error);
const s = 'initialize fail'
this.setState({
status: 'native callback received',
message: s,
});
})
# FinStoreConfig配置项
| 配置名称 | 类型 | 是否必填 | 说明 |
|---|---|---|---|
| sdkKey | string | 是 | 创建应用时生成的sdkKey |
| sdkSecret | string | 是 | 创建应用时生成的sdkSecret |
| apiServer | string | 是 | 服务器地址,客户部署的后台地址 |
| apmServer | string | 否 | apm事件上报的服务器地址,不设置时使用apiServer |
| cryptType | string | 否 | 网络接口加密类型。默认为"MD5",也可以设置为"SM"(国密) |
| fingerprint | string | 否 | SDK指纹,在证联环境时必须传,否则接口访问不通 |
| encryptServerData | boolean | 否 | 默认为false。目前只能设置为false,设置为true会导致接口访问失败 |
| enablePreloadFramework | boolean | 否 | 默认为true。是否预下载基础库,如果设置为false,则初始化SDK时不会预下载基础库 |
# 2. 配置项
初始化SDK时的配置项为Config和UIConfig。
Config中主要是与UI不相关的配置项;UIConfig主要都是与UI相关的配置项。
# 2.1 Config中的配置项
| 配置名称 | 类型 | 配置描述 |
|---|---|---|
| finStoreConfigs | Array<FinStoreConfig> | 要初始化的服务器配置对象列表,具体参数见FinStoreConfig表 |
| userId | string | 当前用户唯一标识,小程序缓存信息会以userId做隔离 |
| productIdentification | string | 产品的标识,影响缓存根目录,以及userAgent中的标识 |
| disableRequestPermissions | boolean | 是否禁止SDK触发权限申请,默认为false。如果设置为true,则SDK内使用权限的api,不会主动申请权限。 |
| appletAutoAuthorize | boolean | 申请权限时是否会弹出对话框让用户确认,默认为false。如果设置为true,自动向SDK申请权限,不展示弹框 |
| disableGetSuperviseInfo | boolean | 是否禁用SDK的监管接口API,默认为false,如果设置为true,则SDK禁用监管接口API(getSuperviseInfo) |
| appletIntervalUpdateLimit | int | 后台自动检查更新的小程序个数,取值范围:0~50。0代表不检查更新;不设置默认是3。 |
| apmExtendInfo | Map<string, string> | apm 统计的扩展信息。Map类型 |
| startCrashProtection | boolean | 是否开启Crash防崩溃,默认值为false(仅iOS支持)。UnrecognizedSelector、KVO、Notification、Timer、Container(数组越界,字典插入nil等)、String (越界、nil等) |
| enableApmDataCompression | boolean | apm数据上报时,是否压缩数据,默认值为false |
| encryptServerData | boolean | 平台接口返回的数据是否要加密,默认值为false。 |
| appletDebugMode | BOOLState | 是否开启小程序的debug模式,即显示vConsole。 |
| enableWatermark | boolean | 是否显示水印,默认值为false。 |
| watermarkPriority | ConfigPriority | 显示水印优先级设置,默认全局配置优先 |
| baseLoadingViewClass | string | 小程序的自定义loading视图的class类名,仅iOS支持 |
| baseLoadFailedViewClass | string | 小程序的加载失败视图的class类名,仅iOS支持 |
| header | Map<string, string> | 统一设置小程序中网络请求的header |
| headerPriority | ConfigPriority | header优先级设置,默认全局配置优先 |
| enableH5AjaxHook | boolean | 是否开启小程序中加载的H5页面hook功能,默认为false。仅iOS支持,详情见api中的注释 |
| h5AjaxHookRequestKey | string | 开启enableH5AjaxHook后,会hook request请求,可设置requestKey。仅iOS支持 |
| pageCountLimit | int | 小程序中页面栈的最大限制。默认值为0,表示不限制。 |
| schemes | List<string> | 自定义的scheme数组。 SDK内部默认支持微信、支付宝、 FinClip App 、tel这些scheme |
| debug | boolean | 设置debug模式,影响调试和日志。 |
| maxRunningApplet | int | 设置最大同时运行的小程序个数。仅Android支持 |
| webViewMixedContentMode | int | WebView mixed content mode。仅Android支持 |
| bindAppletWithMainProcess | boolean | 小程序进程是否与主进程绑定,默认值为false。设置为true时,App被杀死,小程序同步关闭。仅Android支持 |
| killAppletProcessNotice | string | App被杀后关闭小程序的提示文案。仅Android支持 |
| enableScreenShot | boolean | 是否允许截屏录屏,默认为true。仅Android支持 |
| screenShotPriority | ConfigPriority | 截屏录屏配置项的优先级,默认GLOBAL。仅Android支持 |
| logLevel | LogLevel | 日志记录等级,默认为NONE。 |
| logMaxAliveSec | int | 日志文件最长缓存时间,单位秒,默认为10天。 |
| logDir | string | Log日志文件保存的目录。 |
| enablePreNewProcess | boolean | 是否提前创建进程,默认为true。仅Android支持 |
| language | LanguageType | SDK公共UI的语言类型,默认为中文 |
| customLanguagePath | string | SDK公共UI自定义语言的相对路径,优先级高于 language 属性(仅 iOS 平台生效) |
| localeLanguage | string | 自定义SDK的语言,优先级高于内置的 language 属性(仅 android 平台生效),语言列表可以参考:https://uutool.cn/info-i18n/ 或者Java类 【java.util.Locale】。示例:简体中文:zh_CN,繁体中文:zh_TW,英文:en |
| useLocalTbsCore | boolean | 是否使用本地加载tbs内核,默认为false。仅Android支持 |
| tbsCoreUrl | string | tbs内核的下载地址,不包含文件名。仅Android支持 |
| enableJ2V8 | boolean | 是否开启j2v8,默认为false。仅Android支持 |
| backgroundFetchPeriod | int | 周期性更新的时间间隔(小时), 设置为0不会发起周期性更新请求,接收设置范围为3-12小时 |
# 2.2 UIConfig中的配置项
| 配置名称 | 类型 | 配置描述 |
|---|---|---|
| navigationTitleTextAttributes | Map<string, any> | 导航栏标题的样式,目前仅支持字体的配置。仅iOS支持 |
| navigationBarHeight | double | 导航栏高度,默认为44。仅iOS支持 |
| navigationBarTitleLightColor | string | 导航栏的标题Light颜色(系统深色主题下的颜色),默认值为白色 #ffffffff |
| navigationBarTitleDarkColor | string | 导航栏的标题Dark颜色(系统明亮主题下的颜色),默认值为黑色 #ff000000 |
| navigationBarBackBtnLightColor | string | 导航栏的返回按钮Light颜色(系统深色主题下的颜色),默认值为白色 |
| navigationBarBackBtnDarkColor | string | 导航栏的返回按钮Dark颜色(系统明亮主题下的颜色),默认值为黑色 |
| moreMenuStyle | int | 弹出的菜单视图的样式 0:默认 1:Normal |
| isHideBackHomePriority | ConfigPriority | 隐藏导航栏返回首页按钮的优先级设置,默认全局配置优先。仅iOS支持 |
| isAlwaysShowBackInDefaultNavigationBar | boolean | 当导航栏为默认导航栏时,是否始终显示返回按钮,默认值为false。仅Android支持 |
| isClearNavigationBarNavButtonBackground | boolean | 是否清除导航栏导航按钮的背景,默认为false。仅Android支持 |
| isHideFeedbackAndComplaints | boolean | 隐藏...弹出菜单中的 【反馈与投诉】 菜单,默认为false |
| isHideBackHome | boolean | 隐藏...弹出菜单中的 【返回首页】 菜单。默认为false |
| isHideForwardMenu | boolean | 隐藏...弹出菜单中的 【转发】 菜单,默认为false |
| isHideShareAppletMenu | boolean | 隐藏...弹出菜单中的 【分享】 菜单,默认为true |
| isHideAddToDesktopMenu | boolean | 隐藏...弹出菜单中的 【添加到桌面】 菜单,默认为true |
| isHideFavoriteMenu | boolean | 隐藏...弹出菜单中的 【收藏】 菜单,默认为true |
| isHideRefreshMenu | boolean | 隐藏...弹出菜单中的 【重新进入小程序】 菜单,默认为false |
| isHideSettingMenu | boolean | 隐藏...弹出菜单中的 【设置】 菜单,默认为false |
| capsuleConfig | CapsuleConfig | 右上角胶囊的样式配置,具体参数见CapsuleConfig表 |
| navHomeConfig | NavHomeConfig | 返回首页按钮的配置的样式配置,具体参数见NavHomeConfig表 |
| floatWindowConfig | FloatWindowConfig | 安卓浮窗样式配置,具体参数见FloatWindowConfig表。仅Android支持 |
| authViewConfig | AuthViewConfig | 授权弹框样式配置,具体参数见AuthViewConfig表。 |
| webViewProgressBarColor | string | 小程序里加载H5页面时进度条的颜色 格式 #FFFFFFFF |
| hideWebViewProgressBar | boolean | 隐藏小程序里加载H5时进度条,默认为false |
| autoAdaptDarkMode | boolean | 是否适配暗黑模式,默认值为false |
| appendingCustomUserAgent | string | 要拼接至userAgent中的内容。 |
| transtionStyle | TranstionStyle | 打开小程序时的默认动画方式。默认为TranstionStyleUp。可设置如下场景:1. scheme 打开小程序;2. universal link 打开小程序;3. navigateToMiniprogram的动画方式。仅iOS支持 |
| hideTransitionCloseButton | boolean | 是否小程序loading页的关闭按钮,默认为false。 |
| disableSlideCloseAppletGesture | boolean | 是否禁用侧滑关闭小程序的手势,默认为false。 |
| appletText | string | 默认为“小程序”,您需要替换展示的名称。比如设置为"轻应用",所有显示"小程序"的地方,都会变为"轻应用" |
| loadingLayoutCls | string | Loading页Class,仅Android支持 |
| useNativeLiveComponent | boolean | 是否使用内置的live组件,默认为false。 |
# 2.3 CapsuleConfig(胶囊)中的配置项
| 配置名称 | 类型 | 配置描述 |
|---|---|---|
| capsuleWidth | double | 胶囊的宽度 |
| capsuleHeight | double | 胶囊的高度 |
| capsuleRightMargin | double | 胶囊的右边框距离屏幕右边框的距离 |
| capsuleCornerRadius | double | 胶囊的圆角半径 |
| capsuleBorderWidth | double | 胶囊的边框宽度 |
| capsuleBgLightColor | string | 胶囊的浅色背景颜色,在系统深色主题下使用,默认颜色 android:#33000000 ,iOS:#80ffffff |
| capsuleBgDarkColor | string | 胶囊的深色背景颜色,在系统明亮主题下使用,默认颜色 android:#80ffffff ,iOS:#33000000 |
| capsuleBorderLightColor | string | 胶囊的浅色边框颜色,在系统深色主题下使用,默认颜色 #80ffffff |
| capsuleBorderDarkColor | string | 胶囊的深色边框颜色,在系统深色主题下使用,默认颜色 #26000000 |
| capsuleDividerLightColor | string | 胶囊里浅色分割线颜色,在系统深色主题下使用,默认颜色 #80ffffff |
| capsuleDividerDarkColor | string | 胶囊里的深色分割线颜色,在系统深色主题下使用,默认颜色 #26000000 |
| moreLightImage | int | 胶囊的浅色更多按钮图片,暂未支持 |
| moreDarkImage | int | 胶囊的深色更多按钮图片,暂未支持 |
| moreBtnWidth | double | 胶囊的更多按钮宽度,高度与宽度相等,android默认值为32;ios默认值为20 |
| moreBtnLeftMargin | double | 更多按钮的左边距,android默认值为6;ios默认值为12 |
| closeLightImage | int | 胶囊里的深色关闭按钮图片,暂未支持 |
| closeDarkImage | int | 胶囊里的深色关闭按钮图片,暂未支持 |
| closeBtnWidth | double | 胶囊里关闭按钮的宽度,android默认值为32;ios默认值为20 |
| closeBtnLeftMargin | double | 胶囊里关闭按钮的左边距,android默认值为6;ios默认值为12 |
# 2.4 NavHomeConfig(返回首页按钮)中的配置项
| 配置名称 | 类型 | 配置描述 |
|---|---|---|
| width | double | 返回首页按钮的宽度 |
| height | double | 返回首页按钮的高度 |
| leftMargin | double | 返回首页按钮的左侧距离屏幕左边框的距离,Android默认值为8,iOS默认值为10 |
| cornerRadius | double | 返回首页按钮的圆角半径,默认值为5 |
| borderWidth | borderWidth | 返回首页按钮的边框宽度,Android默认值为0.75,iOS默认值为0.8 |
| borderLightColor | string | 返回首页按钮的浅色边框颜色,默认值 #80ffffff |
| borderDarkColor | string | 返回首页按钮的深色边框颜色,默认值 #26000000 |
| bgLightColor | string | 返回首页按钮的浅色背景颜色,默认值 #33000000 |
| bgDarkColor | string | 返回首页按钮的深色背景颜色,默认值 #80ffffff |
# 2.5 AuthViewConfig(权限弹框)的配置项
| 配置名称 | 类型 | 配置描述 |
|---|---|---|
| appletNameTextSize | double | 小程序名称字体大小,默认为16 |
| appletNameLightColor | string | 小程序名称的浅色颜色(明亮模式),默认#ff222222 |
| appletNameDarkColor | string | 小程序名称的深色颜色(暗黑模式),默认#ffd0d0d0 |
| authorizeTitleTextSize | double | 权限标题字体大小,默认大小17 |
| authorizeTitleLightColor | string | 权限标题的浅色颜色(明亮模式),默认#ff222222 |
| authorizeTitleDarkColor | string | 权限标题的深色颜色(暗黑模式),默认#ffd0d0d0 |
| authorizeDescriptionTextSize | double | 权限描述字体大小,默认大小14 |
| authorizeDescriptionLightColor | string | 权限描述的浅色颜色(明亮模式),默认#ff666666 |
| authorizeDescriptionDarkColor | string | 权限描述的深色颜色(暗黑模式),默认#ff5c5c5c |
| agreementTitleTextSize | double | 协议标题字体大小,默认大小16 |
| agreementTitleLightColor | string | 协议标题的浅色颜色(明亮模式),默认#ff222222 |
| agreementTitleDarkColor | string | 协议标题的深色颜色(暗黑模式),默认#ffd0d0d0 |
| agreementDescriptionTextSize | double | 协议描述字体大小,默认大小14 |
| agreementDescriptionLightColor | string | 协议描述的浅色颜色(明亮模式),默认#ff222222 |
| agreementDescriptionDarkColor | string | 协议描述的深色颜色(暗黑模式),默认#ffd0d0d0 |
| linkLightColor | string | 链接的浅色颜色(明亮模式),默认#ff4285f4 |
| linkDarkColor | string | 链接的深色颜色(暗黑模式),默认#ff4285f4 |
| allowButtonLightConfig | AuthButtonConfig | 同意按钮配置(明亮模式),详细配置见AuthButtonConfig |
| allowButtonDarkConfig | AuthButtonConfig | 同意按钮配置(深色模式),详细配置见AuthButtonConfig |
| rejectButtonLightConfig | AuthButtonConfig | 拒绝按钮配置(明亮模式),详细配置见AuthButtonConfig |
| rejectButtonDarkConfig | AuthButtonConfig | 拒绝按钮配置(深色模式),详细配置见AuthButtonConfig |
# 2.6 AuthButtonConfig(权限弹框里的按钮)的配置项
| 配置名称 | 类型 | 配置描述 |
|---|---|---|
| cornerRadius | double | 按钮的圆角半径 |
| normalBackgroundColor | string | 按钮默认背景颜色 |
| pressedBackgroundColor | string | 按钮按下背景颜色 |
| normalTextColor | string | 按钮默认文字颜色 |
| pressedTextColor | string | 按钮按下文字颜色 |
| normalBorderColor | string | 按钮默认边框颜色 |
| pressedBorderColor | string | 按钮按下边框颜色 |
我们的默认胶囊是这样:

那么,我们只需要这样设置,就可以变成圆角:
CapsuleConfig capsuleConfig = new CapsuleConfig({capsuleCornerRadius:16});
UIConfig uiconfig = new UIConfig({capsuleConfig:capsuleConfig});
效果如下:
