如果一个后端开发掌握了微信开发,甚至有微信开发上线项目,这在换工作的时候 还是有竞争力的。

微信开发的资料很多,但是用asp.net c#进行微信开发好像比较少,或者资料不够完整。

使用JS-SDK自定义分享功能,分享朋友圈,分享给朋友,这里基本上不涉及后端语言。

1、首先要绑定域名,当然域名得备案。

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

说明:设置此安全域名目的是为了当发现此公众平台发现诱导分享行为时,可以根据此域名追溯到所有分享出去的链接,以及通过这些链接增加的粉丝。

2、引入js文件

在需要调用JS接口的页面引入如下JS文件http://res.wx.qq.com/open/js/jweixin-1.0.0.js

说明:如果页面启用了https,务必要引入https://res.wx.qq.com/open/js/jweixin-1.0.0.js ,否则将无法在iOS9.0以上系统中成功使用JSSDK

3、通过config接口注入权限验证配置

在微信公众平台JSSDK说明文档是这样解释的:

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

4、通过ready接口处理成功验证

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

5、通过error接口处理失败验证

wx.error(function(res){  
// config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。  
});

分享接口

1、获取“分享到朋友圈”按钮点击状态及自定义分享内容接口

wx.onMenuShareAppMessage({  
    title: '', // 分享标题  
    desc: '', // 分享描述  
    link: '', // 分享链接  
    imgUrl: '', // 分享图标  
    type: '', // 分享类型,music、video或link,不填默认为link  
    dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空  
    success: function () {   
        // 用户确认分享后执行的回调函数  
    },  
    cancel: function () {   
        // 用户取消分享后执行的回调函数  
    }  
});

2、获取“分享给朋友”按钮点击状态及自定义分享内容接口

wx.onMenuShareAppMessage({  
    title: '', // 分享标题  
    desc: '', // 分享描述  
    link: '', // 分享链接  
    imgUrl: '', // 分享图标  
    type: '', // 分享类型,music、video或link,不填默认为link  
    dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空  
    success: function () {   
        // 用户确认分享后执行的回调函数  
    },  
    cancel: function () {   
        // 用户取消分享后执行的回调函数  
    }  
});

完整的代码如下:

<%--引入js文件--%>  
 <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>  
<%--通过config接口注入权限验证配置--%>  
     <script>  
        wx.config({  
            debug: false,  
            appId: '${shakeMap.appId}',  
            timestamp: '${shakeMap.timestamp}',  
            nonceStr: '${shakeMap.nonceStr}',  
            signature: '${shakeMap.signature}',  
            jsApiList: [  
                'checkJsApi',  
                'onMenuShareTimeline',  
                'onMenuShareAppMessage'  
            ]  
        });  
        wx.ready(function () {  
                <%--公共方法--%>  
            var shareData = {  
                title: '${title}',  
                desc: '${description}',  
                link: '${url}',  
                imgUrl: '${headImgUrl}',  
                success: function (res) {  
                    //alert('已分享');  
                },  
                cancel: function (res) {  
                }  
            };  
                <%--分享给朋友接口--%>  
            wx.onMenuShareAppMessage({  
                title: '${title}',  
                desc: '${description}',  
                link: '${url}',  
                imgUrl: '${headImgUrl}',  
                trigger: function (res) {  
                          //  alert('用户点击发送给朋友');  
                },  
                success: function (res) {  
                    //alert('已分享');  
                },  
                cancel: function (res) {  
                    //alert('已取消');  
                },  
                fail: function (res) {  
                    alert(JSON.stringify(res));  
                }  
            });  
                <%--分享到朋友圈接口--%>  
            wx.onMenuShareTimeline(shareData);  
        });  
          <%--处理失败验证--%>  
        wx.error(function (res) {  
            alert("error: " + res.errMsg);  
        });  
    </script>

C#示例 点此下载

c#微信开发,使用JS-SDK自定义分享功能,分享朋友圈,分享给朋友等的更多相关文章

  1. ionic 实现微信朋友圈分享的完整开发流程

    最近开始要着手负责开发ionic的项目了,一直很好奇想实现一个微信朋友圈分享的功能,所以我就网上找了找文章来练手实现,果不其然,找到了几篇,但是发现它们的流程都不太详细,清楚,直接,还有不少坑. 今天 ...

  2. React Native微信分享 朋友圈分享 Android/iOS 通用

    超详细React Native实现微信好友/朋友圈分享功能-Android/iOS双平台通用   2016/06/16 |  React Native技术文章 |  Sky丶清|  暂无评论 |  1 ...

  3. 纯Java实现微信朋友圈分享图

    纯Java实现微信朋友圈分享图 1.实现分享图的效果 2.开发环境 2.1 JDK * oracle's jdk 1.8以上 2.2 字体 * 若选择了微软雅黑字体又是代码部署到Linux,则需要安装 ...

  4. android 微信朋友分享,朋友圈分享

    android 微信朋友分享,朋友圈分享 包名必须写成  com.weixin WXEntryActivity package com.weixin.wxapi; import android.app ...

  5. 微信 6.5.1 for iOS发布 可以在朋友圈分享相册中的视频

    今天微信 6.5.1 for iOS发布了,最主要的一个功能是可以在朋友圈分享相册中的视频,卖转发朋友圈视频软件的家伙估计要哭了.微信这次更新,更有利于个人号的运营,个人号的价值将更高.先定一个小目标 ...

  6. 微信分享功能引入页面-控制分享时候调用的标题、图片、url和微信按钮隐藏显示控制

    1.设置分享调用的标题.图片.url预览. 2.控制右上角三个点按钮的隐藏显示(和底部工具栏的显示隐藏--未测试). 3.判断网页是否在微信中被调用. <!doctype html> &l ...

  7. apiCloud 三方分享,微信好友分享,微信朋友圈分享,QQ分享,微博分享

    首先查看我的这篇有关三方登录的博客,地址是http://www.cnblogs.com/gqx-html/p/8303567.html,配置完三方数据后可以从上一篇文章中的链接跳转到各个登录查看api ...

  8. 微信分享缩略图,如何增加微信朋友圈分享链接的小图片? facebook、google+、twitter等分享的标签

    微信分享缩略图 如何增加微信朋友圈分享链接的小图片?在网页的头部<head>标签内加上以下代码,图片路径自行修改.<head><div id='wx_pic' style ...

  9. iOS - 社会化分享-微信分享,朋友圈分享

    我仅仅做了文字和图片分享功能 1. TARGETS - Info - URL Types identifier -> weixin URL Schemes ->  应用id 2.在AppD ...

  10. webapp项目vue框架点击按钮实现微信好友分享,朋友圈分享

    当时做这个这个效果真把人给*了,网上能搜到的基本是微信页面的分享,特征是方法是wx.**开头,不适用于app内.思路都是一样的,先调取服务(这里使用plus的内置方法),再发送分享请求 <tem ...

随机推荐

  1. wampserver实现外网访问

    1.打开运行WampServer3.0.4,鼠标移到wampserver上去,单击右键,出来个wamp Settings, 按照如图所示,选择Menu item : Online / Offline. ...

  2. iconfont的引入方法

    第一步:使用font-face声明字体@font-face {font-family: 'iconfont';src: url('iconfont.eot'); /* IE9*/src: url('i ...

  3. 第十篇--------javascript函数-参数

    javascript函数的参数:形参,实参 //function 参数 //形参列表 function test(a,b,c,d){ //alert(test.length); //形参个数,4个 / ...

  4. 重签名android测试包

    我的一个例子:jarsigner -digestalgSHA1 -sigalg MD5withRSA -keystore C:\Users\sunyang\.android\debug.keystor ...

  5. 解决Ubuntu系统的每次开机重启后,resolv.conf清空的问题和DNS域名解析问题(图文详解)

    不多说,直接上干货! 问题情况描述如下: 普及知识:   /etc/resolv.conf ,其实是一个Link .它其实指向的是 /run/resolvconf/resolv.conf.  Ubun ...

  6. ruby **option作为函数参数,map的key必须是符号

    # NEW UNNAMED KEYWORD ARGUMENTSdef new_way(**options)return options[:foo]end# => :new_waynew_way( ...

  7. python pip 安装OpenCV

    cmd pip install opencv-contrib-python -i https://pypi.mirrors.ustc.edu.cn/simple/

  8. SpringCloud - RestTemplate 的三种使用方式

    1. 直接使用 RestTemplate restTemplate = new RestTemplate(); String result = restTemplate.getForObject(&q ...

  9. XmlDocument.LoadXml和Load的区别

    LoadXml:从指定的字符串加载 XML 文档. eg:doc.LoadXml("<root>aa</root>"); .csharpcode, .csh ...

  10. mvc手把手教你写excel导入[mvc+三层,没用EF]

    实习狗的每天新知识日常 准备工作: 1.在项目中添加对NPOI的引用,NPOI下载地址:http://npoi.codeplex.com/releases/view/38113 2.NPOI学习系列教 ...