uniapp使用阿里百川SDK唤醒淘宝APP 打开淘宝领券页面/渠道备案,uniapp对接淘宝联盟等等超级详细

附录:
本文主要针对使用uniapp开发淘宝客APP而写,文章内容会讲到uniapp如何使用阿里百川sdk登录淘宝?如何使用阿里百川sdk做渠道授权,uniapp如何打开淘宝商品领券页面,自己开发APP，淘宝联盟怎么跟踪订单？等等

一、使用前的准备工作

首先到 阿里百川网站 ->注册->新建应用->填写好相关应用的包名-> 获取应用的 安全图片 用于验证应用使用的合法性

二、必须要开通《 百川电商SDK 》 ，否则授权会出问题，如果不做返利模式,直接打开领券页面的可以忽略此步骤

三、获取应用安全图片

1. 选择自己要使用的应用,生成对应的安全图片.
2. 百川更新到 4.0 以上版本后，统一使用了 V5 版本安全图片。
3. 安卓 Android 需要上传apk 安装包来获取安全图片,apk安装包, 使用你的安卓证书, 提交云打包生成apk 安装包后,再到百川上传来获取安全图片.如包名或证书有更改 都需要重新获取安全图片,不然会初始化会失败,这里上传的时候可以直接上传空包,百川只校验签名信息.

刚开通百川电商SDK以后,可以过十几分钟在获取安全图,百川可能有缓存会导致授权失败

四、插件配置

1. 打开插件地址，点击试用，
2. 选择一个要绑定的项目,然后输入APP的包名
   
3. 在uniapp项目根目录下创建nativeplugins 插件文件夹, 主要是存放安全图和插件的其他文件,包含 ios 和 android 子目录, 插件名称:xiguazhu_baichuan 文件夹名不能修改, 具体看图片所示.
   
   按照图中创建文件夹

提示：

如果需要使用支付宝功能，要把插件包中的 UTDID.framework 和 utdid4all-1.5.2.jar 文件删除掉，如果不需要则保留一起打包. UTDID.framework文件和 utdid4all-1.5.2.jar文件以及整个目录可以问百川插件作者要

第一种情况.

需要使用uniapp 官方的支付宝功能时	百川配置说明
IOS 苹果	在插件目录下保留安全图片即可:yw_1222_baichuan.jpg (名字必须叫这个)
Android 安卓	在插件目录下保留安全图片即可:yw_1222_baichuan.jpg (名字必须叫这个)

第二种情况.

未使用uniapp 官方的支付宝功能时	百川配置说明
IOS 苹果	在插件目录下保留文件: UTDID.framework +yw_1222_baichuan.jpg (名字必须叫这个)
Android 安卓	在插件目录下保留文件: utdid4all-1.5.2.jar + yw_1222_baichuan.jpg(名字必须叫这个)

4. IOS 端唤起淘宝客户端需要特别设置下,在配置 manifest.json 文件中,找到 ios 项,加入以下代码

 "ios" : {
                "urltypes" : [
                    {
                        "urlschemes" : [ "tbopen32470416" ] //tbopen+您应用的AppKey
                    }
                ],
                "urlschemewhitelist" : "tbopen,tmall"
            }

如下图:

urlschemes 的名称设置是 tbopen+AppKey, AppKey是百川AppKey ,一串数字,不要填错,否则会初始失败

五、阿里百川插件方法介绍

方法名	说明
login()	淘宝授权登录
logout()	退出登录
detailPage()	打开淘宝任意页面
shopPage()	打开店铺页面
OpenMyCart()	打开淘宝购物车
getUserInfo()	获取用户授权信息
checkSession()	检查用户登录状态
taobaoOauth()	渠道授权
getUtdid()	获取手机设备 UTDID 唯一码

六、使用案例

1. 实例化插件 ,在需要用到插件的页面引入

const baichuan = uni.requireNativePlugin('xiguazhu-baichuan');

2.淘宝授权登录 login() , 传入参数: 无

	baichuan.login({},result=>{
		console.log(result);				
	});  

• 授权成功后,返回数据格式

{
	"userinfo": {
		"topAccessToken": "63001084681b15666d9b50a0f64193354e0267457c2ba7b34****",
		"topExpireTime": "7776000",
		"userid": "3401100915",
		"avatarUrl": "https://wwc.alicdn.com/avatar/getAvatar.do?userIdStrV2=31CMmjAGPUw03*cOYWkyYNTT&type=taobao",
		"openSid": "9b7b973a1ab23f0de168318640cc8199fa353b470622d8e1195394718f531f8****",
		"topAuthCode": "bPDMxNN3UAEKu1cEbDrRSPhK30****",
		"openId": "AAHpJD0KANVDozhKB****",
		"nick": "c7****"
	},
	"code": 0,
	"msg": "登录成功"
}

3.退出登录 logout() , 传入参数: 无

• 用户取消 返回数据

{
	"code": 10004,
	"msg": "用户取消登录"
}

4.打开商品详情页 detailPage() , 打开商品详情页有两种方式

• openType=> 参数是打开的方式: 0=> 使用url打开,1=>使用ID打开
• itemid=> 商品 ID
• url=>商品链接

第一种,通过 商品 ID ,来打开详情页

   	baichuan.detailPage({
   					"itemid": "562161593312",
   					"openType": 1
   				}, result => {

   				});

第二种,通过商品链接,来打开详情页

   baichuan.detailPage({
        					url: "https://s.click.taobao.com/KWLkWbu",
        					"openType": 0
        				}, result => {

        				});

5.打开店铺 shopPage()

• openType => 参数是打开页面的方式: 0=> 使用APP端打开

• shopid=> 店铺ID

baichuan.shopPage({
					shopid: "67907495",
					"openType": 0
				}, result => {
					console.log(result);
				});

6. 打开我的购物车 shopCar()

baichuan.shopCar();		

7. 检查授权登录状态,checkSession() 传入参数:无

baichuan.checkSession({}, result => {
        					console.log(result);
        				});

• 返回数据参数

1.已经登录

{
   "code": 0,
   "msg": "登录成功"
}

2.登录失效

{
   "code": 1,
   "msg": "未登录"
}

8.获取用户已经授权的信息,getUserInfo() 传入参数:无

{
	baichuan.getUserInfo({}, result => {
        					console.log(result);
        				});
}

• 返回数据参数

1.成功获取

{
	"userinfo": {
		"topAccessToken": "63025041498269f01a2dbbe6c5448cee6122d3ed1****",
		"topExpireTime": "7776000",
		"userid": "3401100915",
		"avatarUrl": "https://wwc.alicdn.com/avatar/getAvatar.do?userIdStrV2=31CMmjAGPUw03*cOYWkyYNTT&type=taobao",
		"openSid": "af3afc198f6f4e4ea542bfb3423ee996edb3f58c84a44d1eda173d45f8ea1e6d2****",
		"topAuthCode": "2qdoIZJcrf00mhyTIvF7J2****",
		"openId": "AAHpJD0KANVDozhK****",
		"nick": "c7****"
	},
	"code": 0,
	"msg": "登录成功"
}

2.获取失败

{
	"code": 1,
	"msg": "未登录"
}

9.获取用户设备 UTDID 码

baichuan.getUtdid(result => {
					console.log(result);
				});

• 返回数据

{
	"utdid": "YSRqDyGmBjADADi5****"
}

九、淘宝渠道授权说明(返利功能需要用到渠道ID跟踪订单的)

1. H5 使用 code 方式授权

https://oauth.taobao.com/authorize?response_type=code&client_id=2948****&redirect_uri=http://你的域名/&state=1212&view=wap

把网址中的参数，替换成自己的即可.

baichuan.taobaoOauth({
             			"url": "https://oauth.taobao.com/authorize?response_type=code&client_id=294****&redirect_uri=http://你的域名/&state=1212&view=wap"
             				}, result => {
             					console.log(result);
             				});

链接获取授权码参数

参数名字	参数选项	参数值	参数释义
client_id	必选		联盟媒体key
response_type	必选	code
redirect_uri	必选		参见redirect_uri的定义
state	必选		传入值与返回值保持一致。
view	必选	默认为web	移动端 wap

1.授权成功 返回参数:

暂无

2. 其他的返回

暂无

2. H5 使用 token 方式授权(推荐使用)

授权网址

https://oauth.taobao.com/authorize?response_type=token&client_id=2948****&state=1212&view=wap

链接获取授权码参数

参数名字	参数选项	参数值	参数释义
client_id	必选		联盟媒体key
response_type	必选	token
state	必选		传入值与返回值保持一致。
view	必选	默认为web	移动端 wap

1.授权成功 返回参数:

{
	"info": {
		"expires_in": "2592000",
		"taobao_open_uid": "AAEAWObHANZeVL1YKsd****",
		"r1_expires_in": "1800",
		"w2_expires_in": "0",
		"refresh_token": "6101303057813b26f0954a9a5acd7194fff62be3e9390493****",
		"access_token": "6101d0302741aab1596335b19cee233835e8641e285b5****",
		"state": "1212",
		"top_sign": "59C789C51A82C6D1F6DEAB9375****",
		"taobao_user_id": "3401100****",
		"taobao_user_nick": "c7****",
		"w1_expires_in": "1800",
		"re_expires_in": "2592000",
		"r2_expires_in": "0",
		"token_type": "Bearer"
	},
	"code": 0,
	"msg": "授权成功"
}

2. 其他的返回

无

uniapp 原生插件如何使用，可以参考这个：https://ask.dcloud.net.cn/article/36106

拉起手淘失败,一般是安全图片的问题，更新安全图片之后再尝试一下

总结

文中提到的uniapp百川地址

有不懂的可以加微 shenlailai6 咨询，
加好友备注csdn阿里百川咨询,否则不通过

作者简介:从事淘客行业多年~