react native 实现MobSDK微信分享文件(专治各种坑)

照例写在前面的话,在之前做分享的时候,我用的是友盟的分享,这次换成了MOB的分享,碰到了很多的问题,这里给大家一一分享一下,那么我们开始吧!

http://www.mob.com/是他们的官方网站,我们的标题是react native来实现分享,实际上的操作时在react native层调用本地层的代码,也就是调用androidios层的代码来实现,中间的调用只是一个桥接,关键部分还是在native,所以这里大家关于react native调用android的源码,大家可以看我之前的这篇文章

那么,我们开始吧:

访问网站它们的官网,打开快速集成页面,就是这个地址,貌似他们的网页改版了。

现在的android已经不需要自己去下载jar包了,所以我们现在第一步是:

配置Gradle

第一步:

打开项目根目录的build.gradle,在buildscrip–>dependencies 模块下面添加 classpath 'com.mob.sdk:MobSDK:+':

buildscript {
    repositories {
        jcenter()
    }
 
    dependencies {
        ...
        classpath 'com.mob.sdk:MobSDK:+'
 
    }
}
image
第二步:

如果你的项目里集成了很多模块,那就记得哪个模块使用分享的sdk,就在哪个项目去集成:

在使用到Mob产品的module下面的build.gradle文件里面添加引用,例如:

apply plugin: 'com.mob.sdk'
image

说明:做完上面这两点,你就可以async了,这里有个坑就是,当你async完以后,要看一下这个包onKeyShare有没有添加到你的库里,有可能不存在。这个是分享要用到的,如果没有,后面就没有办法走了。如果真的不存在的话,在classpath 'com.mob.sdk:MobSDK:+'后面按个空格,在重新async几次就可以了。

第三步:

第三步,配置mobkey和秘钥 (与第2步是一个gradle中;注意:方法是配置到文件根目录,
与android并列,不要配置到android里面哦)

MobSDK {
    appKey "d580ad56b4b5"
    appSecret "7fcae59a62342e7e2759e9e397c82bdd"
 
    ShareSDK {
        //平台配置信息
        devInfo {
            SinaWeibo {
                appKey "568898243"
                appSecret "38a4f8204cc784f81f9f0daaf31e02e3"
                callbackUri "http://www.sharesdk.cn"
                shareByAppClient false
            }
            Wechat {
                appId "wx4868b35061f87885"
                appSecret "64020361b8ec4c99936c0e3999a9f249"
            }
            QQ {
                appId "100371282"
                appKey "aed9b0303e3ed1e27bae87c33761161d"
            }
            Facebook {
                appKey "1412473428822331"
                appSecret "a42f4f3f867dc947b9ed6020c2e93558"
                callbackUri "https://mob.com"
            }
        }
    }

上面的MobSDK下面的appKeyappSecret是你自己注册的账号里,添加的应用的appkey,和appSecret。而下面的各个平台的appkeyappSecret则需要你去对应平台的官网去注册。

申请Mob的appkey与appsecret请点击这里查看

第五步:

注:如果您没有在AndroidManifest中设置appliaction的类名,MobSDK会将这个设置为com.mob.MobApplication,但如果您设置了,请在您自己的Application类中调用:

MobSDK.init(this,appKey,appSecret);

不要用官网的:

MobSDK.init(this);

要不然会出现莫名其妙的问题。

在这里我们假设上面你添加的appKeyappSecret和各个平台的deviceInfo都没有问题,那么我们这里就可以调用代码了。
这里的代码是官网的那个,调用弹出框,然后出那个九宫格的,有很多平台的那个。

@ReactMethod
public void showShare() {
     OnekeyShare oks = new OnekeyShare();
     //关闭sso授权
     oks.disableSSOWhenAuthorize(); 
 
     // title标题,微信、QQ和QQ空间等平台使用
     oks.setTitle(getString(R.string.share));
     // titleUrl QQ和QQ空间跳转链接
     oks.setTitleUrl("http://sharesdk.cn");
     // text是分享文本,所有平台都需要这个字段
     oks.setText("我是分享文本");
     // imagePath是图片的本地路径,Linked-In以外的平台都支持此参数
     oks.setImagePath("/sdcard/test.jpg");//确保SDcard下面存在此张图片
     // url在微信、微博,Facebook等平台中使用
     oks.setUrl("http://sharesdk.cn");
     // comment是我对这条分享的评论,仅在人人网使用
     oks.setComment("我是测试评论文本");
    // 启动分享GUI
    oks.show(this);
}

官方的demo下载地址:ShareSDK-for-Android

如果上面你没有碰到坑,那么就能调出弹出框。下面我们说一下微信的分享,这里着重说一下微信的部分。

第一个坑:签名

1.当你发现你能调用起微信的登录界面时,说明你async的时候文件都在,然后也初始化了。

2.如果发现自己微信调用调起时一闪而逝,那么一定是签名的问题,微信的签名

3.如果你设置的微信的appKeyappSecet是正式版的,那么你在测试的时候需要打包在进行测试。

关于怎么弄微信签名,这里请自己百度。

我错了,我高估了我的脑子,我已经忘了这里怎么弄了!

闪一下就没反应了 是签名问题,微信需要签名打包才可以分享,签名不一致就会导致这样的问题。签名打包的意思是您
把应用打包成一个APK需要一个签名文件,这个签名文件里面有串MD5码,这个MD5码去掉全部的冒号,把全部的大写换
成小写,填写到微信开放平台那边的应用签名里面就行了。或者 利用签名工具获取(先将自己的工程打包apk安装到手机
上,然后输入包名同样可以获取签名)

[网址](https://open.weixin .qq.com/cgi-bin/readtemplatet=resource/app_download_android_tmpl&lang=zh_CN)

第二个坑:在MobSDK下的配置文件里。在各个平台的设置中,除了设置必要的的appKeyappSecet,还需要注意以下几个:

1.sortId可以用来配置在九宫格里显示的位置,数字越小越靠前。

2.shareByAppClient,布尔值,设置它为true表示需要客户端才可以分享。比如微信。

3.bypassApproval,布尔值,表示是否绕过审核。

如果你分享文本和图片,可以使用设置绕过审核,绕过审核的话,不检查appKeyappSecret,所以测试完毕以后,记得把这个字段设置为false.

4.enable表示是否启用该平台。

其他的字段大家可以查看官网...

分享文件的坑

//...
sp.setShareType(Platform.SHARE_FILE);
//#if def{lang} == cn
// 待分享文件的本地地址
//#elif def{lang} == en
// local path of the file to share
//#endif
sp.setFilePath(MainActivity.testImage);
sp.setImagePath(MainActivity.testImage);
//...

在官网的demo里只有三行代码。我们也可以给它添加上titletext.

知道为啥只有三行代码不,因为这三行代码是必须的。如果在测试的发现空指针的错误,就说明你设置的file_pathimage_path必然有一个是空的。

其他的一些坑

还有一个是,关于各个平台的配置名称的。官网上这样:

devInfo.png

大家想要使用什么分享,就配置各个平台的数据。这里的一个坑是这样的。。

Platform plat = ShareSDK.getPlatform(WechatMoments.NAME);

在上面的代码,我们直接调用的WechatMoments.NAME,然后如果你发现并没有这个WechatMoments的时候,说明你并没有在build.gradle中配置这个平台。

恩恩,差不多就是这样子...Over...

你可能感兴趣的:(react native 实现MobSDK微信分享文件(专治各种坑))