美文网首页我爱编程
微信JSSDK实现微信分享

微信JSSDK实现微信分享

作者: theache | 来源:发表于2018-04-15 20:56 被阅读0次

前两天是试了试微信分享,看看文档感觉挺简单的一个东西,但是写写的时候 费了好大的劲。


大概效果是这样的

首先查看文档,按照里面的要求引入JS文件并且通过config接口注入权限验证配置


这里其他都还好一般出问题的都是这个signature。查看文档获取signature之前需要有access_token和jsapi_ticket。前者用于获取jsapi_ticket,而jsapi_ticket用于加密生成signature。

这里我踩到的坑是其中的url,我的网址是http://wx.zhaobo1.cn/jsshare。我很理所当然的使用这个网址作为url的值去生成signature。然后就是一直报invalid signature。然后突然想到会不会是网址的关系(因为看到了下面的网址和我的不一样)。多了一个form,然后试着那原来的url替换掉,然后就一点事情都没有了。

哦哦哦,,对了还有还有如果是订阅号使用测试号的话还有一个小坑。域名和网址的区别。域名不需要加上http://或者https://。- -虽然道理我也懂,但是做的时候,我是真的有点傻傻的分不清。



下面是用laravel实现的代码,可以参考

    /**
     * 获取access_token
     * @return mixed
     */
    function getAccessToken(){
        $url = 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=' . config('params.WXAPPID') . '&secret=' . config('params.WXAPPSCERET');
        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $url);
        curl_setopt($ch, CURLOPT_HEADER, 1);
        curl_setopt($ch, CURLOPT_HEADER, 0);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
        $res = curl_exec($ch);
        curl_close($ch);
        return json_decode($res,FALSE);
    }

    /**
     * 获取jsapi_ticket
     * @param $access_token
     * @return mixed
     */
    function getJsapiTicket($access_token){
        $url = 'https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=' . $access_token .'&type=jsapi';
        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $url);
        curl_setopt($ch, CURLOPT_HEADER, 1);
        curl_setopt($ch, CURLOPT_HEADER, 0);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
        $res = curl_exec($ch);
        curl_close($ch);
        return json_decode($res,FALSE);
    }

    /**
     * 微信jssdk分享
     * @param Request $request
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
     public function jsShare(Request $request){
        //获取accesstoken
        $access_token = $request->session()->get('access_token','');
        if (!$access_token){
            $access_token = $this->getAccessToken()->access_token;
            $request->session()->put('access_token',$access_token);
        }

        //获取jsapi_ticket
        $jsapi_ticket = $request->session()->get('jsapi_ticket','');
        if (!$jsapi_ticket){
            $jsapi_ticket = $this->getJsapiTicket($access_token)->ticket;
            $request->session()->put('jsapi_ticket',$jsapi_ticket);
        }

        $arr = [
            'appid' => config('params.WXAPPID'),
            'timestamp' => (string) time(),
            'noncestr' => str_random(16),
        ];
        $arrTmp = [
            'jsapi_ticket'=>$jsapi_ticket,
            'noncestr'=>$arr['noncestr'],
            'timestamp'=>$arr['timestamp'],
            'url'=>$request->getUri()
        ];
        $tmp = '';
        foreach ( $arrTmp as $k => $v){
            $tmp .= $k . '=' . $v . '&';
        }
        $tmp = substr($tmp,0,strlen($tmp)-1);
        $arr['signature'] = sha1($tmp);
        return view('wx.jsshare',$arr);
    }

这里我把access_token和jsapi_ticket写在session里面了。也可以写到地方去的。您开心就好。

相关文章

  • 微信JSSDK实现微信分享

    前两天是试了试微信分享,看看文档感觉挺简单的一个东西,但是写写的时候 费了好大的劲。 首先查看文档,按照里面的...

  • 微信公众号配置

    微信授权配置(WEB端设置) 微信JSSDK配置(WEB端设置) 微信JSSDK配置(后台设置)

  • JSSDK 微信分享

    记录一下我前段时间做微信分享遇到的麻烦和坑。先说一下使用方式,最后写我遇到的坑 引入 JS 文件 我用的是 当然...

  • 微信分享jssdk

    官方文档[https://developers.weixin.qq.com/doc/offiaccount/OA_...

  • 微信jssdk 分享

    微信js-SDK手册地址: https://qydev.weixin.qq.com/wiki/index.php?...

  • 微信JSSDK分享功能使用

    微信jssdk初始化 微信支付调用

  • 关于前端微信分享jssdk config:invalid sig

    关于前端微信分享jssdk config:invalid signature 签名错误 这几天刚刚把微信写完,说出...

  • H5 页面在微信端的分享

    微信分享,咋一看好像很复杂,实则非常简单。只需要调用微信官方出的微信jssdk,加上些许配置,就可以实现h5页面在...

  • 微信分享

    微信分享,咋一看好像很复杂,实则非常简单。只需要调用微信官方出的微信jssdk,加上些许配置,就可以实现h5页面在...

  • Vue项目全局配置微信分享

    前言 这里总结一下微信分享怎么全局配置,这里只写代码,至于微信 JSSDK 的使用,可以参考我之前的文章 微信公众...

网友评论

    本文标题:微信JSSDK实现微信分享

    本文链接:https://www.haomeiwen.com/subject/herjkftx.html