现在随着微信的慢慢普及，越来越多的人用微信了，所以一般的app 集成微信分享功能就越来越普遍。在sns中微信分享是最让人头疼的事情，android不能调试还只能等上线后才允许调试，简直是太tmd坑爹了。
下面贴出微信分享的代码：
 1.首先在application中添加：
public IWXAPI api;
public final static String APP_ID = "wx01337fe8eaa15eb9";
初始化 api = WXAPIFactory.createWXAPI(this, APP_ID);
2.分享到朋友圈：
if(mFTMSApplication.api.isWXAppInstalled()){
int wxSdkVersion = mFTMSApplication.api.getWXAppSupportAPI();
if(wxSdkVersion >= TIMELINE_SUPPORTED_VERSION){
WXWebpageObject webpage = new WXWebpageObject();
if(url!=null){
webpage.webpageUrl = url;
}
WXMediaMessage msg = new WXMediaMessage(webpage);
msg.title = "一汽丰田";
msg.description =text+url;
Bitmap thumb = BitmapFactory.decodeResource(context.getResources(), R.drawable.ic_launcher);
msg.thumbData = Util.bmpToByteArray(thumb, true);


SendMessageToWX.Req req = new SendMessageToWX.Req();
req.transaction = buildTransaction("webpage");
req.message = msg;
req.scene = true? SendMessageToWX.Req.WXSceneTimeline : SendMessageToWX.Req.WXSceneSession;
mFTMSApplication.api.sendReq(req);
// Toast.makeText(context, "发送到好友圈!", Toast.LENGTH_LONG).show();
}else{
Toast.makeText(context, "很抱歉,您的微信当前版本不支持发送到好友圈!", Toast.LENGTH_LONG).show();
}
}else{
Toast.makeText(context, "您没有安装微信,请您安装微信后分享", 1).show();
}

3.分享给好友：
if(mFTMSApplication.api.isWXAppInstalled()){
//分享给好友
//Toast.makeText(context, "分享给好友", 1).show();
//shareFriends(false);


WXWebpageObject webpage = new WXWebpageObject();

// webpage.webpageUrl = "http://as.baidu.com/a/item?docid=3033948&pre=web_am_se";
if(url!=null){
webpage.webpageUrl = url;
}
WXMediaMessage msg = new WXMediaMessage(webpage);
msg.title = "一汽丰田";
msg.description = text+url;
Bitmap thumb = BitmapFactory.decodeResource(context.getResources(), R.drawable.ic_launcher);//图片
msg.thumbData = Util.bmpToByteArray(thumb, true);


SendMessageToWX.Req req = new SendMessageToWX.Req();
req.transaction = buildTransaction("webpage");
req.message = msg;
req.scene = false? SendMessageToWX.Req.WXSceneTimeline : SendMessageToWX.Req.WXSceneSession;
mFTMSApplication.api.sendReq(req);


}else{
Toast.makeText(context, "您没有安装微信,请您安装微信后分享", 1).show();
}
如有详情可咨询我qq：506923004

在一个h5页面添加微信，分享给微信好友、朋友圈、腾讯微博

下面来实现 。

需要：

1、需要一个企业版的微信公众号（认证过的）

2、一台服务器

企业版的微信公众号原因：

在微信公众平台的接口权限内可以看到，个人版公众号是没有权限自定义微信分享的，所以需要企业版公众号并开通认证。







具体步骤：

步骤一：绑定域名

先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。

备注：登录后可在“开发者中心”查看对应的接口权限。（这一步骤应该没有什么问题）



步骤二：引入JS文件

在需要调用JS接口的页面引入如下JS文件，（支持https）：http://res.wx.qq.com/open/js/jweixin-1.4.0.js

如需进一步提升服务稳定性，当上述资源不可访问时，可改访问：http://res2.wx.qq.com/open/js/jweixin-1.4.0.js （支持https）。

备注：支持使用 AMD/CMD 标准模块加载方法加载（没问题，很简单，一个script就搞定了）

步骤三：通过config接口注入权限验证配置

所有需要使用JS-SDK的页面必须先注入配置信息，否则将无法调用（同一个url仅需调用一次，对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性，所以使用pushState来实现web app的页面会导致签名失败，此问题会在Android6.2中修复）。

wx.config({
    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
    appId: '', // 必填，公众号的唯一标识
    timestamp: , // 必填，生成签名的时间戳
    nonceStr: '', // 必填，生成签名的随机串
    signature: '',// 必填，签名
    jsApiList: [] // 必填，需要使用的JS接口列表
});

这一步就有很大的问题了，这么多的参数是从哪里来的！

——1.先不管其他的，我们现在所需要的：（appId是微信公众号的appId，可以写死或者服务器返回）

  timestamp: , // 必填，生成签名的时间戳
    nonceStr: '', // 必填，生成签名的随机串
    signature: '',// 必填，签名

这样看来，其实真正需要的是 signature 签名

——2.看下signature 的生成流程：

生成签名之前必须先了解一下jsapi_ticket，jsapi_ticket是公众号用于调用微信JS接口的临时票据。正常情况下，jsapi_ticket的有效期为7200秒，通过access_token来获取。由于获取jsapi_ticket的api调用次数非常有限，频繁刷新jsapi_ticket会导致api调用受限，影响自身业务，开发者必须在自己的服务全局缓存jsapi_ticket 。

1.参考以下文档获取access_token（有效期7200秒，开发者必须在自己的服务全局缓存access_token）：../15/54ce45d8d30b6bf6758f68d2e95bc627.html

2.用第一步拿到的access_token 采用http GET方式请求获得jsapi_ticket（有效期7200秒，开发者必须在自己的服务全局缓存jsapi_ticket）：https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi

上面的是官方的文档，说要拿到并且缓存 access_token 接口调用凭据 和 jsapi_ticket 临时票据，拿着access_token 去获取jsapi_ticket ，获得jsapi_ticket之后，自己生成个随机字符串（不懂的，网上百度怎么搞）加上时间戳，加上url地址，自己拼接好，最后进行sha1处理，就得到signature， 很是扯皮！另外access_token 一天的次数2000次，jsapi_ticket 一天的次数是100万次，都缓存下来，也可以只缓存token；（我是只缓存了token）

——这里说一下 access_token 



access_token是公众号的全局唯一接口调用凭据，公众号调用各接口时都需使用access_token。开发者需要进行妥善保存。access_token的存储至少要保留512个字符空间。access_token的有效期目前为2个小时，需定时刷新，重复获取将导致上次获取的access_token失效。

公众平台的API调用所需的access_token的使用及生成方式说明：

1、建议公众号开发者使用中控服务器统一获取和刷新Access_token，其他业务逻辑服务器所使用的access_token均来自于该中控服务器，不应该各自去刷新，否则容易造成冲突，导致access_token覆盖而影响业务；

2、目前Access_token的有效期通过返回的expire_in来传达，目前是7200秒之内的值。中控服务器需要根据这个有效时间提前去刷新新access_token。在刷新过程中，中控服务器可对外继续输出的老access_token，此时公众平台后台会保证在5分钟内，新老access_token都可用，这保证了第三方业务的平滑过渡；

3、Access_token的有效时间可能会在未来有调整，所以中控服务器不仅需要内部定时主动刷新，还需要提供被动刷新access_token的接口，这样便于业务服务器在API调用获知access_token已超时的情况下，可以触发access_token的刷新流程。

公众号和小程序均可以使用AppID和AppSecret调用本接口来获取access_token。AppID和AppSecret可在“微信公众平台-开发-基本配置”页中获得（需要已经成为开发者，且帐号没有异常状态）。调用接口时，请登录“微信公众平台-开发-基本配置”提前将服务器IP地址添加到IP白名单中，点击查看设置方法，否则将无法调用成功。小程序无需配置IP白名单。

简单来说就是调用微信的分享接口，需要用到一个凭证access_token，而这个凭证是有数量和有效时间限制的，所以需要用自己的服务器做缓存处理，当access_token过期后再去请求新的access_token，需要一台服务器和配置ip白名单。

PHP来做的话：

 a. 先定义个access_tokenjson文件，我选择用json文件存，没有用数据库存

{
    "access_token": "xxx",
    "expires": 12345
}

 b.jssdk.php文件: 文件夹目录要有修改权限 sudo chmod -R 777 your_dir 

思路：先取缓存的token的时间，与现在的时间对比，如果现在的时间大于缓存时间，则把现在时间+7200赋给缓存的时间，如果超时请求新的token，如果没超时用缓存的token，再生成jsapi_ticket，生成signature签名。

步骤四：通过ready接口处理成功验证 又回到前端页面上

wx.ready(function(){
    // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
});

配置好就可以用分享接口了

分享接口

自定义“分享给朋友”及“分享到QQ”按钮的分享内容（1.4.0）

 

wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
    wx.updateAppMessageShareData({ 
        title: '', // 分享标题
        desc: '', // 分享描述
        link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
        imgUrl: '', // 分享图标
        success: function () {
          // 设置成功
        }
});

更多接口可以去文档里看

 

目录

安装微信开发SDK - easywechat

 

准备测试公众号 (已有公众号appid secret 且公众号已配置jsapi安全域名的此步骤可以忽略)

 

后端代码

 

前端代码

可能会出现的问题

安装微信开发SDK - easywechat

根据php版本和安装中的因素 选择不同的easywechat版本 https://www.easywechat.com/docs/5.x/installation 文档地址，在这里我用5.0版本

composer require overtrue/wechat:~5.0 -vvv

分享具体参照文档地址 easywechat-jssdk

 

准备测试公众号 (已有公众号appid secret 且公众号已配置jsapi安全域名的此步骤可以忽略)

登录测试微信公众号
	
修改接口配置信息
	

	
JS接口安全域名
	


注意：复制测试公众号的appid与secret 配置完测试公众号的必要参数，务必要将测试分享的微信关注第3步骤的测试公众号，否则分享无效果。

 

后端代码

<?php

namespace app\wx\controller;

use EasyWeChat\Factory;
use think\Controller;

/**
 * Thinkphp 5.1
 * Class Index
 * @package app\wx\controller
 */
class Index extends Controller
{
    /**
     * Notes: 初始化加载分享页面
     * User: Jartin
     * Url: /index.php/wx/index/index
     */
    public function index()
    {
        if ($this->request->isAjax()) {
            $jssdk = $this->getJsapi();
            return json([
                'data' => $jssdk
            ]);
        }
        return view();
    }

    /**
     * Notes: 获取分享必要参数
     * User: Jartin
     */
    private function getJsapi()
    {

        $config = [
            'app_id' => '公众号APPID',
            'secret' => '公众号APPSECRET',
            'token' => '公众号配置的参数token',
            // 指定 API 调用返回结果的类型：array(default)/collection/object/raw/自定义类名
            'response_type' => 'array',
            'log' => [
                'level' => 'debug',
                'file' => __DIR__ . '/../../wechat.log',
            ],
        ];

        $app = Factory::officialAccount($config);
        $menu = array(
            'updateAppMessageShareData',
            'updateTimelineShareData',
            'onMenuShareTimeline',
            'onMenuShareAppMessage');
        
        // 以下参数的具体释义参考文档 https://www.easywechat.com/docs/5.x/basic-services/jssdk
        $jssdk = $app->jssdk->buildConfig($menu, true, false, false);
        return $jssdk;
    }

    /**
     * Notes: 微信公众号配置开发域名token验证地址（已验证的忽略该方法）
     * User: Jartin
     */
    public function wx_check()
    {
        $config = [
            'app_id' => '公众号APPID',
            'secret' => '公众号APPSECRET',
            'token' => '公众号配置的参数token',
            // 指定 API 调用返回结果的类型：array(default)/collection/object/raw/自定义类名
            'response_type' => 'array',

            'log' => [
                'level' => 'debug',
                'file' => __DIR__ . '/../../wechat.log',
            ],
        ];
        $app = Factory::officialAccount($config);
        $response = $app->server->serve();
        $response->send(); // Laravel 里请使用：return $response;
    }
}


 

前端代码

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
    ！！！！  ↓↓↓↓↓↓ 这个微信分享的js代码版本必须为 1.5.0 否则无效
    <script src="http://res.wx.qq.com/open/js/jweixin-1.5.0.js"></script>
    <title>标题</title>
</head>
<script>
    $(document).ready(function () {
        $.get('/wx/index/index', '', function (res) {
            wx.config({
                debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来。
                appId: res.data.appId, // 必填，公众号的唯一标识
                timestamp: res.data.timestamp, // 必填，生成签名的时间戳
                nonceStr: res.data.nonceStr, // 必填，生成签名的随机串
                signature: res.data.signature,
                jsApiList:['checkJsApi', 'updateAppMessageShareData', 'updateTimelineShareData']
            });
        })
        wx.ready(function () {
            wx.updateAppMessageShareData({
                title: '标题',
                desc: '描述文字'  ,
                link: 'http://域名/wx/index/index',
                imgUrl:'https://www.imooc.com/static/img/index/logo2020.png' ,
                success: function () {
                }
            });
            wx.updateTimelineShareData({
                title: '标题',
                desc: '描述文字'  ,
                link: 'http://域名/wx/index/index',
                imgUrl:'https://www.imooc.com/static/img/index/logo2020.png' ,
                type: 'link',
                dataUrl: '',
                success: function () {
                }
            });
        });
        wx.error(function (res) {
            console.log("shareerror")
            alert(res.errMsg);
        });
    })
</script>
<body>
</body>
</html>
 No newline at end of file


成功！



 

可能会出现的问题

旧的前端微信分享sdkjs链接未替换为最新而导致的分享失败
	
jsApiList列表中的行为不是微信最新分享的行为，要确保列表中有的 wx.方法都有
	
js代码置后而导致的加载异常导致的分享失败
 

 

 

本文主要介绍网页微信二次分享中楼主踩过的坑，希望对大家有所帮助，
之前写过的相关微信分享的文字这里指一下路：
微信分享 使用weixin js sdk 兼容 旧版本
【微信分享】 微信分享集成 使用weixin js sdk 兼容 旧版本 2
【cordova ionic2 微信分享】使用 cordova-plugin-wechat 做微信分享的注意点

微信官方文档指路：
微信JS-SDK说明文档

坑1：
公众号没有按时续费，
如果没有按时给公众号缴费，那么JS-SDK将无法正常工作，如果使用了JS-SDK中，即使是之前Debug打开时都报OK的，只要一旦公众号失效（没有缴费），Debug也会直接报错说无法使用

坑2：
公众号中对应位置的“JS接口安全域名”配置不正确
JS接口安全域名一般配置到一级域名即可，
还有另外一个业务域名不影响JS-SDK的调用，但是不配置业务域名，可能会造成分享到朋友圈打开时，微信给多包了一层丑丑的UI，或者在有输入框的时候顶部会弹安全提示
接着坑1造成的影响，如果之前都JS-SDK的分享都正常工作，而因为没有按时续费造成的公众号失效，那么当再次付费后，之前配置的JS接口安全域名和业务域名都需要重新配置

坑3：
确保没有踩坑1和坑2情况下，可能发生的JS-SDK的Debug报错：Sample中自动检测的Http和Https的坑，
如果你看了官方提供的Sample中的jssdk.php（楼主用php，Sample中的其它没有研究），
那么
// 注意 URL 一定要动态获取，不能 hardcode.
$protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
这个说不要HardCode到还不如HardCode，如果你的域名用了https的证书，并且用了强制跳转or服务器集群策略（将https的请求分发给内部多台服务器），php这里拿到的protocol是不正确的，将会拿到http，而实际地址上却是https
这个动态获取错误就会导致Debug报错，建议这里不HardCode话，可以在初始化时，和appid和appsecret一样从外部参数传入

坑4：
A分享给B时，Debug没报错，而分享的图片A和B都看不到，
可能原因1：A手速太快，还没等浏览器页面进入条走完就点了分享（进度条没走完，一般分享初始化也没完成），这个只能怪A手速太快，页面完全加载完成后再分享A和B应该就都能看到
可能原因2：图片路径错误，这个就是低级错误了
可能原因3：图片路径正确（在普通浏览器访问能访问得到），但是连接中存在特殊字符，比如|（ucloud的缩略图服务中带水印就会用到|符号），是在需要用这种连接地址的情况下，需要php（楼主就用的php，别的语言请自行测试）帮忙做一下跳转

坑5：（此坑不仅限于网页的二次分享，app分享到微信的链接也是同理）
A分享给B时，Debug没报错，分享的图片A自己能看到，B却不能看到，同样的图片作为朋友圈分享A和B却都能看到
恭喜你在分享文案中踩到了微信爸爸的敏感词
楼主碰到的不能碰的敏感词为“抢到了大红包”（在分享给朋友的描述中，desc那个字段，不知道title会怎样，楼主没有测试），“大红包”和“抢了大红包”的组合，目前在分享中能看到图片的
不太懂微信爸爸这个文案的敏感词为什么会影响分享的图片

关于坑5的更新：（2018-05-23）
微信爸爸出台明文规定，标题和描述不能写的太夸张，不然分享出去的链接中的标题、描述和图片都不按你设置的来（链接还是能正常工作，只是外部ui会变），具体请看
（以上新闻内容来源：泡面小镇公众号文章 点击左边蓝字可看链接内容）

坑6：
超过3个月未使用appsecret，系统已进行重新设置，
这时候需要去公众平台拿最新的appsecret，替换即可
https://blog.csdn.net/fjnjxr/article/details/78070348
这篇文章中说的是可以拿到appsecret，目前最新的政策是微信不再明文存储appsecret，所以需要去公众号自己重置并记好appsecret

新政策：
1 微信不再告知分享成功/失败（原成功和取消的回调会合并为一个）
相关政策链接：
https://mp.weixin.qq.com/cgi-bin/announce?action=getannouncement&announce_id=11526372695t90Dn&version=&lang=zh_CN


2 微信朋友圈外链禁止使用含有用户隐私数据的浮层
相关政策的链接：
https://mp.weixin.qq.com/s?__biz=MjM5NjM4MDAxMg==&mid=2655078183&idx=1&sn=29eb1516fc3044f8673bfb9eca4b8a58&pass_ticket=o%2BtPKbeTrk%2B6UlmBVW5377yDzy91C5a6322%2FTePg3aVaZbHOM0DarvAqxUGURFyZ


祝福大家都能顺利搞定微信分享