npm package: @netease-beauty/js-sdk
Description: [![build status](https://g.hz.netease.com/beauty/beauty-js-sdk/badges/master/build.svg)](https://g.hz.netease.com/beauty/beauty-js-sdk/commits/master) [![coverage report](https://g.hz.netease.com/beauty/beauty-js-sdk/badges/master/coverage.svg)](https://g
Author: maggiehe
Latest version: 2.3.0

# 美学 JS-SDK

[![build status](https://g.hz.netease.com/beauty/beauty-js-sdk/badges/master/build.svg)](https://g.hz.netease.com/beauty/beauty-js-sdk/commits/master) [![coverage report](https://g.hz.netease.com/beauty/beauty-js-sdk/badges/master/coverage.svg)](https://g.hz.netease.com/beauty/beauty-js-sdk/commits/master)

> 美学 JS-SDK 是为第三方开发者提供的网页开发工具包。

通过美学JS-SDK，网页开发者可以打开APP、判断是否在APP中，还可以在APP中获取到获取网络情况、进行登录、获取/编辑用户信息、分享等。

## 安装

Install with yarn:
```
$ yarn add @netease-beauty/js-sdk
```
Install with npm:
```
$ npm install @netease-beauty/js-sdk
```

## 引入

```js
// 推荐
import beauty from '@netease-beauty/js-sdk'
```

或直接引入 `https://m.mei.126.net/beauty-js-sdk-[version].js`，使用`window.beauty`.

## 变量

- User Agent：`beauty.ua`
- 是否在美学APP中：`beauty.inApp`
- APP当前版本：`beauty.version`
- 网络情况：`beauty.networkType`（ 'WIFI', '4G', 'UNKNOW', 等）
- 是否为WIFI网络：`beauty.isWifi`

注意:
```
1. iOS < 1.4.0 以及 Android <= 1.4.0 无法正确判断网络情况，beauty.networkType === `UNKNOW` 且 `beauty.isWifi === undefined`
2. Android 1.4.0 版本开始才可以判断是否在App中，之前版本 `beauty.inApp === false` 且 `beauty.version === undefined`，但可以调用其它接口
```

## 配置

```js
beauty.config({
  debug: true, // 开启调试模式，调用api时相关信息会在客户端alert
  refresh(data, callback) {} // 页面刷新处理函数
}).then(function () {
  // sdk就绪（jsbridge已注入且jssdk配置完成），这里可以进行一些初始化工作
  }, function (errMsg) {
  // 失败
})
```

## SCHEME

##### 获取url

```js
// type: 类型
// restParams：0~n个字符串参数，用于格式化scheme
// options: 最后一个参数如果是对象类型，则将对象的key和value作为query附加到url上
beauty.getURLScheme(type: string, ...restParams, options?: <object>)
```

##### 当前支持的类型

```js
// version: 从该版本开始支持，早于该版本getURLScheme将返回null
const URL_SCHEME = {
  webview: { url: 'webview' },
  // 产品
  product: { url: 'product/{0}' },
  // 品牌
  brand: { url: 'brand/{0}' },
  // 心得
  note: { url: 'record/{0}' },
  editNote: { url: 'recordeditor' },
  editTrialReport: { url: 'recordeditor', version: '1.5.0' },
  // 合辑
  repo: { url: 'repo/{0}'},
  // 标签
  tag: { url: 'tag/{0}' },
  // 视频
  video: { url: 'video/{0}' },
  // 问答
  questionList: { url: 'questionList', version: '1.4.3' },
  question: { url: 'question/{0}', version: '1.4.3' },
  answer: { url: 'answer/{0}', version: '1.4.3' },
  // 地址
  editAddress: { url: 'trial/order/{0}/addressEdit', version: '1.5.0' }
}
```

##### 示例

```js
const url = beauty.getURLScheme('product', 123, {
  'da_location': 2
})
// url === 'nemeixue://product/123?da_location=2'
```

## 接口

##### 在美学APP中打开页面

```js
beauty.launchApp({
  redirect: 'http://mkt.mei.163.com/blabla', // app中需要打开的网页地址
  degradedLink: '' // app打开失败后重定向到该链接，缺省将会根据平台信息打开应用宝，itunes或下载页
})

// or 缺省写法
beauty.launchApp('http://mkt.mei.163.com/blabla')
```

##### 是否登录

```js
beauty.isLogin().then(function (isLogin) {
  // 返回 true || false
}, function (errMsg) {
  // 异常处理
})
```

##### 登录

*拉起网易美学 App 的登录 UI*

```js
beauty.login().then(function (user) {
  // 返回当前用户信息
}, function (errMsg) {
  // 异常处理
})
```

##### 获取当前用户信息

```js
beauty.getUserInfo().then(function (user) {
  // 返回当前用户信息
}, function (errMsg) {
  // 异常处理
})
```

##### 编辑用户信息

*拉起编辑用户信息 UI*

```js
beauty.editUserInfo().then(function (user) {
  // 返回更新后的用户信息
}, function (errMsg) {
  // 异常处理
})
```

##### 分享

```js
beauty.share({
  guideTitle: '先分享再申领哦！', // 可选参数，引导标题
  title: 'EGF、干细胞、脐带血精华……护肤品中的“伪概念”你信了多少？-配方师Rex', // 分享标题
  subTitle: '作为一名护肤品研发人员，我觉得市场部的同事要比我们辛苦的多，因为', // 分享描述
  shareType: 1, //分享方式（1链接，3图片），其中图片模式在1.3.1版本引入
  url: 'http://mei.163.com/repo/prx5cff609f0c71a67fed1a6ce0e016a381', // 分享链接
  imageUrl: 'https://beauty.nosdn.127.net/beauty/img/1383b5fb-1a4b-4c00-90bf-81ec983c07a3.jpg' // 分享图
  channel: [1, 2], // 可选参数，支持的分享渠道，缺省为所有渠道
}).then(function () {
  // 分享成功
}, function (errMsg) {
  // 分享失败
})
```

其中渠道的具体代码：

```
1. 微信好友
2. 微信朋友圈
3. QQ好友
4. QQ空间
6. 新浪微博
7. 复制链接
```

##### 预览图片

```js
beauty.previewImage({
  urls: [
    'http://beauty.nos.netease.com/beauty/img/a505a6ec-7330-446e-9a37-c19af7f76855.jpg',
    'https://beauty.nosdn.127.net/beauty/img/b52dbbd7-0229-437c-bfe7-6b255aca7880.jpg'
  ], // 被预览的图片列表
  current: 1 // 当前图片下标
})
```

##### 版本比较

```js
beauty.compareVersion('1.5.0') // 被比较的版本号
```

返回值:

```
0. 当前版本与被比较的版本一致
1. 当前版本较新
-1. 当前版本较旧
null. 版本信息有误
```

##### 检测是否开启推送，未开启则弹出提醒弹窗

```js
beauty.checkPushSwitchState()
```


## 任务

如果调用接口时不确定SDK是否完成初始化，则可以创建一个任务。

任务会被添加到任务队列中，初始化完成后会依次调用队列中的任务。（如果创建任务时初始化已完成，则直接执行任务。）

```js
beauty.task(name: string,  ...theArgs)
```

例如：

```js
beauty.task('enableRefresh')
```

## 刷新页面

如果需要下拉刷新功能，需要在config函数中传入刷新函数：

```js
beauty.config({
  refresh(data, callback) {
    // 更新数据逻辑
    // ...
    // 更新数据后通知客户端更新完成
    callback()
  }
})
```

```js
// 启动下拉刷新，此时如果不确定SDK是否完成初始化，就创建一个任务
beauty.task('enableRefresh')
// 取消下拉刷新
beauty.disableRefresh()
```