tencent-qqnews-user/README.md

用于在腾讯新闻客户端中进行登录、获取用户信息和提交请求等操作

# 用于在腾讯新闻客户端中进行登录、获取用户信息和提交请求等操作

因新闻客户端存在iOS与Android的系统差异，导致调用客户端提供的jsapi非常不方便，这里就进行了下封装，直接调用即可。  

使用方式： 

首先下载该模块
```bash
npm install tencent-qqnews-user --save-dev
```

然后在代码中引用即可： 

```javascript
import User from 'tencent-qqnews-user';
```

或者直接使用`script`标签引入： 

> https://unpkg.com/tencent-qqnews-user

接下来是几个方法的使用方式。

### 1. 登录 User.login

登录的方法是`login(string logintype, function callback)`，这里接收两个参数。

第1个参数登录的方式有：

* `qq` ：只有QQ登录按钮；
* `weixin` ： 只有微信登录按钮；
* `qqorweixin`； QQ和微信按钮都有，用户可以任意选择

第2个参数是登录后的回调， `true`表示登录成功； `false`表示登录失败，比如中断登录等。

样例： 

```javascript
User.login('qqorweixin', result=>{
    if(result){
        alert('登录成功');
    }else{
        console.log( '取消登录' );
    }
});
```

**注意：**
> 在iOS的新闻客户端中，不论用户是否已经登录，都可以使用`User.login`再次呼起登录；在Android的新闻客户端中，若呼起的登录方式与当前的登录态相同，则直接回调为false，不会弹出登录窗口，比如当前为QQ登录，那么再次使用`qq`或者`qqorweixin`呼起登录时，都会直接回调为false。
> 同时，在这两个系统的新闻客户端内，若再次呼起登录的方式，与当前的登录状态不一样，则后登录的账户会作为副账户存在，不会顶掉当前主账户的信息。

### 2. 退出登录 User.logout

退出登录的方法是: `User.logout()`，没有参数

```javascript
User.logout(); // 退出登录
```

在iOS里则会直接退出账户，而在Android的客户端里，则会弹窗让用户确认是否退出。

### 3. 切换账号 User.changeLogin

在上面我们已经说过`User.login`会存在两个问题： 

* Android下若呼起的登录方式与当前的登录态相同，则无法重新登录；
* iOS和Android下，若呼起的登录方式与当前的登录态不同是，则后登录的账号作为副账户存在

为了解决这两个问题，客户端还提供了切换账号的功能，其实就是： 退出当前账号(logout)+重新登录(login)。若我们使用上面两个方式的组合来让用户重新登录，iOS下没问题，但在Android下，退出账号时会首先弹窗确认，而这个弹窗确认是不会阻止后面的login进程的，login就会进入到自己的判断流程，导致login失败。

这里我们使用`User.changeLogin(string logintype, function callback)`来切换账号，切换账号的方法是客户端提供的，虽然流程还是 退出当前账号(logout)+重新登录(login)，但能正常切换。

传递的参数与login相同：

第1个参数登录的方式有：

* `qq` ：只有QQ登录按钮 ；
* `weixin` ： 只有微信登录按钮；
* `qqorweixin`； QQ和微信按钮都有，用户可以任意选择

第2个参数是登录后的回调， `true`表示登录成功； `false`表示登录失败，比如中断登录等。

```javascript
User.changeLogin('qq', result=>{
    if( result ){
        alert( '切换账号成功' );
    }else{
        console.log( '中断切换' );
    }
});
```

### 4. 获取用户信息 User.getUserInfo

如果想要展示用户的昵称、头像等信息，可以用`User.getUserInfo`接口来获取，回调的字段里包含了当前用户的登录方式、昵称、头像和openid(QQ方式登录时为其qq号)：

```javascript
/*
result = {
    logintype: 'qq', // 'weixin'，当前的登录方式；若为空，则表示未登录；以下字段均在登录后才存在
    nickname: '', // 昵称
    avatar: '', // 头像
    openid: '' // 微信账号的openid或者QQ账号的qq号，均以openid字段返回
};
*/
User.getUserInfo(result=>{
    alert( JSON.stringify(result) );
})
```

### 5. 请求接口 User.post

客户端里也有提供请求接口的方法，不用额外引入ajax等模块：

这里内部调用的是客户端提供的方法，虽说名字是`post`，但在实际使用中发现，get请求和post请求都会接收到。这个方法通过客户端发起调用接口时，会自动带上客户端的信息和用户的信息(如果他已登录的话)。因此后端在接收到前端通过这种方式发送过来的请求时，可以拿到相应的设备信息和用户信息，前端无需显式的带上当前设备和当前用户的信息。

```javascript
User.post({
    url: url, // 请求地址，必传，必须明确协议
    data: {a:1, b:2}, // 参数，可以为空
    success: function(result){ // 请求成功时

    }, 
    error: function(error, url){ // 请求失败时

    },
    complete: function(error, url, result){ // 成功或失败都会执行的方法

    }
})
```

同时，在`0.0.5`版本里，User.post方法返回的是Promise对象，可以使用`then`和`catch`来接收数据： 

```javascript
User.post({
    url: url, // 请求地址，必传，必须明确协议
    data: {a:1, b:2}, // 参数，可以为空
}).then(result=>console.log(result)) // success
.catch(err=>console.error(err)) // fail
```

传递参数有以下几个方法，都是可以的： 

1. url与传递的参数写在一个object里
```javascript
User.post({
    url,
    data
})
```

2. url作为第一个参数，传递的参数作为第二个传参
```javascript
User.post(url, {
    data: {a:1},
    success: function(result){
        console.log(result);
    }
})
```

```javascript
User.post(url, {
    data: {a:1}
}).then(result=>console.log(result))
```

3. 只有url时
```javascript
User.post(url, {
    success: function(result){
        console.log(result);
    }
})
```

```javascript
User.post(url)
    .then(result=>console.log(result))
```


这里有几个要注意的点： 

1. 请求的url必须明确是`http://`还是`https://`协议，不能自动适应页面协议；不过您可以用`location.prototal`来获取当前页面的协议，拼接到URL上，然后再通过post进行请求； 
2. complete方法是无论请求成功还是失败都会执行，第1个参数在请求success时为null，在请求error时有数据 

同时，这里还是提供两个额外的方法，记得在使用post之前定义： 

`User.postSuccess(error, url, result)`: 所有通过post请求`成功`的都会执行这个方法，那么可以通过这个方法来进行接口数据上报的操作；  

`User.postError(error, url)`: 所有通过post请求`失败`的都会执行这个方法