# nw-share

> 分享组件，兼容漫画、蜗牛、阅读、lofter、云音乐、微信、易信和普通浏览器

## LOFRER业务分享注意
- LOFTER域名因为不是`163.com`，不在微信分享的白名单中，所以LOFTER的网页分享必须先到服务端生成一些鉴权信息，示例如下：
```json
{
    noncestr: "1MhzBSvy"
    signature: "a4c929f45d5538ae705eca4f9c6e00edbe63c37f"
    timestamp: "1628244174"
}
```
- 以上的信息生成需要我们将当前页的url发送到服务端生成，url的规则为当前页url去除hash的所有部分，代码为`location.href.split('#')[0]`

- 分享配置中的`link`字段无需与当前页url一样，只要求*链接域名或路径必须与当前页面对应的公众号JS安全域名一致*
- 如果当前页是SPA或者会使用`history.replaceState`修改当前页url，请一定注意，调用本组件必须在修改url之后，或者每次修改完url都重新调用一次本组件，否则会出现生成的鉴权信息与分享时刻的页面url不匹配，导致分享信息配置失败。


## 安装

### es6 module
```sh
$ yarn add nw-share
```

### script

引用`dist`下的`share-dist.js`，组件暴露的命名空间是`Share`

## API

```js
import {setOrUpdate, share} from 'nw-share';
```

### `setOrUpdate(shareData, callback)`

设置当前页面的分享参数，可多次调用

* `shareData`: **required** **Object** 分享数据对象
    * `title`: **required** **String** 标题
    * `description`: **required** **String** 描述信息
    * `activityId`: **required** **String** 活动ID，只能由数字组成
    * `picurl`: **required** **String** 分享图片，如果提供的链接无法访问，可能造成分享功能失效
    * `text`: **optional** **String** 分享到微博的文字，可选，未传时取`title`的值
    * `link`: **optional** **String** 分享出去的链接，可选，未传时取当前页面的地址
* `callback`: **optional** **Function** 分享成功回调，可选，lofter和云音乐没有回调功能

注意1: 注意图片的大小，过大的图片会导致分享失败，而且没有错误提示，推荐200x200左右的尺寸，并且用jpg格式，大小在50k以内；阅读应用会把分享到微信的图片截成160x160

注意2: 由于png会比jpg大很多，本库默认会把png图转成jpg（通过在url后面加参数`type=jpg`）

注意3: 回调函数里，不要立即执行`alert`，在iPhone版阅读应用里会卡死应用

注意4: `link`，如果需要在阅读应用使用该组件，`link`的域名必须是yuedu.163.com，其他域名会提示参数问题，如果有需要，联系阅读产品策划把需要的域名加到白名单里

注意5: 微信和易信平台没法直接触发分享分享功能，会提示用户点击右上角按钮去分享

注意6: 调试分享回调函数时最好使用80端口，存在非80端口的页面分享回调不执行的情况

注意7: 发现分享文案中的某些关键字会使分享的内容被屏蔽，如"礼包"。

### `share(shareData)`

* `shareData`: **optional** **Object** 分享数据对象，设置此次分享的数据，若为空，使用`setOrUpdate`配置的数据。

~~注意1: lofter不支持`shareData`参数~~ LOFTER6.8.4版本JSBridgeV7版本已支持主动调用时设置分享参数

触发分享

```js
import {setOrUpdate, share} from 'nw-share';
import {isWeixin, isLofter} from 'nw-detect';

share();
```

## 发布
1. 本组件有提供`ES Module`调用方式，所以在更新组件代码后，需要调用工程根目录的`npm run build nw-share`，构建`ES Module`版本的文件。
2. 在`nw-share`目录执行`npm run build`，构建`非ES Module`版本的文件