标签：
现在的网站基本上都需要接入微信分享功能，那么这个过程是怎么实现的咩，前几天做了这个功能，一直没来得及整理下，
今天大致把步骤写一写。
微信的官网文档给出了非常清晰具体的步骤 http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
（1）绑定域名
先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
备注：登录后可以在“开发者中心”查看对应的接口权限
（2）引入js文件，http://res.wx.qq.com/open/js/jweixin-1.0.0.js
将js下载后拷贝到app/assets/javascripts文件夹。
然后好要在application.js.coffee里引入一下哦，就是添加这句话
#= require jweixin-1.0.0
（3）增加初始化文件 vim initializers/weixin.rb
vim config/initializers/weixin.rb
然后加入下面的初始化内容
$client ||= WeixinAuthorize::Client.new(CONFIG[‘weixin‘][‘appid‘], CONFIG[‘weixin‘][‘secret_key‘],"")
在config/config.yml里加入配置（这里的是需要从微信申请的）
weixin:
appid: wfasfasfasdfxxxx
secret_key: 4cf4dfasfsdfsadfasdf5dasda
（4）通过config接口注入权限验证配置
所有使用JS-SDK的页面必须先注入配置信息，否则将无法调用（同一个url仅需调用一次，对于变化url的SPA的web app可在每次url变化时进行调用，目前Android微信客户端不支持pushState的H5新特性，所以使用pushState来实现web app的页面会导致签名失败，此问题会在Android6.2中修复）
vim app/views/share/_weixin_config.html.slim
加入对应的代码
- data = $client.get_jssign_package(request.url) javascript: wx.config({ debug: false, // true是开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印 appId: ‘#{data["appId"]}‘, // 必填，公众号的唯一标识 timestamp: ‘#{data["timestamp"]}‘, // 必填，生成签名的时间戳 nonceStr: ‘#{data["nonceStr"]}‘, // 必填，生成签名的随机串 signature: ‘#{data["signature"]}‘,// 必填，签名，见附录1 jsApiList: [‘onMenuShareTimeline‘, ‘onMenuShareAppMessage‘] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2 });
（5）app/views/layouts/application.html.slim页面添加按钮
.modal.fade id="shareModal" role="dialog" aria-labelledby="infoModalLabel" .modal-dialog role="document" .modal-content#share-web .modal-header button type="button" class="close" data-dismiss="modal" aria-label="Close" span aria-hidden="true" × .modal-title id="infoModalLabel" 微信扫一扫，分享给你的好友吧 .modal-body#share-qrcodeTable .modal-content#share-weixin .modal-body button type="button" class="close" data-dismiss="modal" aria-label="Close" span aria-hidden="true" × javascript: $(function() { $(‘[data-toggle="popover"]‘).popover(); }); jQuery(‘#share-qrcodeTable‘).qrcode({ render : "canvas", width : 260, height : 260, text : "http://aaa.com" }) var ua = window.navigator.userAgent.toLowerCase() if(ua.match(/MicroMessenger/i) == ‘micromessenger‘){ $(‘#share-web‘).addClass(‘hidden‘) }else{ $(‘#share-weixin‘).addClass(‘hidden‘) } $(‘#share‘).click(function(){ $(‘#shareModal‘).modal(‘show‘) })
(6)在对应的页面里增加配置，指定在转入朋友圈里链接显示的文字和图片
app/views/aaas/index.html.slim
javascript: // 首页的微信分享 wx.ready(function(){ wx.onMenuShareTimeline({ title: ‘来看看aaa！‘, link: window.location.href, imgUrl: ‘#{logo_url}‘ }); wx.onMenuShareAppMessage({ title: ‘这是标题‘, desc: ‘来看看aaa！‘, link: window.location.href, imgUrl: ‘#{logo_url}‘ }); });
标签：
原文地址：http://www.cnblogs.com/iwangzheng/p/4811207.html
