实现微信公众号自定义分享功能,分享给朋友,分享到朋友圈,点击链接,获取点击分享者的openid。

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/wangji201314/article/details/90669395

微信公众号自定义分享功能 与 获取点击分享者的openid,通过cookic校验,重新请求获取
引用的微信 js:

<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<script src="${ctx}/static/uselooper/js/jquery.cookie.js"></script>    

前端jsp 实现:

 <form id="bmform" onSubmit="javascript:savebaoming(this,event)" action="${ctx }/bm/savebaoming" method="post" enctype="multipart/form-data">
                      		<input type="hidden" name="weixinUsername" value="${openid}" id="weixinUsername"/>
							<input type="hidden" name="weixinNickname" value="${nickname}" id="weixinNickname"/> 
							<input type="hidden" name="weixinHeadImgUrl" value="${headImgUrl}" id="weixinHeadImgUrl"/> 
 </form>

前端js 实现代码:

 /* 微信获取登录者详情信息  */
$(document).ready(function(){
    	  	//这里的cookic 解决微信分享成功后,获取点击分享者的openid,让其重新请求获取就可以。
    	  	 var str=$.cookie('cookic');
    	  	 var openid=$("#weixinUsername").val();
    	  	 if(str=="" || str==undefined || openid==null || openid==''){
 	 	  		//获取网页地址
 	 	  		var url=window.location.href;
 	 	  	   //对网页地址进行处理
 	 	  		var repUrl = url.replace("&eId=", "_");
 	 	  		var index=url.indexOf("bm");
 	 	  		// 发送请求,后台处理,经过微信登录,授权,获取到登录者的详情信息。再重定向到这个页面。
 	 	  		var newurl=url.substring(0,index)+"weixin/palogin?redirect_uri="+repUrl+"&company="+'${activity.company}';
  	 	  		window.location.href=newurl;
  	 	  		//重新赋值,不是undefind就好,不然页面会一直刷新
  	 	  		$.cookie('cookic',"aaa")
 	 	  	}
 	 	=========================================================================  	
 /* 微信分享功能  */
			 //获取分享的地址,生成参数不能变,不能随便定义分享链接, ( 需要去微信公众号配置 JS安全域名。)
			var strurl=window.location.href.split('#')[0];
			//页面初始化发送请求,根据路径strurl 与根据你所需要的参数,获取wx.config的必要参数。注意请求回来的参数大小写
	   		$.get("${ctx}/pub/config",{"url":strurl,company:"${activity.company}"},function(data,status){
	   		if(status == "success"){
	   		wx.config({
			   			    debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
			   			    appId: data.appid, // 必填,公众号的唯一标识
			   			    timestamp: data.timestamp, // 必填,生成签名的时间戳
			   			    nonceStr: data.noncestr, // 必填,生成签名的随机串
			   			    signature: data.signature,// 必填,签名
			   			    jsApiList: [ 
 								          //把需要的接口加入至列表   全部用的旧的接口方法,新的可能不好使。
							              "onMenuShareTimeline", //分享到朋友圈
							              "onMenuShareAppMessage", //分享到朋友
							              "onMenuShareQQ", //分享到QQ
								       ]  // 必填,需要使用的JS接口列表,所有JS接口列表
										   			 
			   			});  
			   			wx.ready(function(){
				    			 wx.onMenuShareTimeline({
						    				 title: "活动报名,分享给朋友圈", // 分享标题
						    				 desc: "活动报名", // 分享描述
						    				 link: strurl, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
						    				 imgUrl:"", // 分享图标s
						    				 type: 'link', // 分享类型,music、video或link,不填默认为link
						    				 dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
						    				 success: function () {
						    				 	
						    				 },
						    				 cancel: function () {
					    				 		// 用户取消分享后执行的回调函数
						    					//alert("fail");
						    				 },
						    				 fail: function () {
							    				 	// 用户取消分享后执行的回调函数
								    			  //alert("fail");
								    		 },
				    				 });
						    		wx.onMenuShareQQ({
						    				 title: "活动报名,分享给好友", // 分享标题
						    				 desc: "分享描述", // 分享描述
						    				 link: strurl, // 分享链接,
						    				 imgUrl:"", // 分享图标s
						    				 type: 'link', // 分享类型,music、video或link,不填默认为link
						    				 dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
						    				 success: function () {
						    				 // 用户确认分享后执行的回调函数
						    					 //alert("OK");
						    				 },
						    				 cancel: function () {
					    				 	// 用户取消分享后执行的回调函数
						    					//alert("fail");
						    				 } ,
						    				 fail: function () {
							    				 	// 用户取消分享后执行的回调函数
								    			  // alert("fail");
								    		 },
				    				 });
						    	 wx.onMenuShareAppMessage({
						    				 title: "活动报名,分享给朋友哦", // 分享标题
						    				 desc: "分享描述", // 分享描述
						    				 link: strurl, // 分享链接,
						    				 imgUrl:"", // 分享图标s
						    				 type: 'link', // 分享类型,music、video或link,不填默认为link
						    				 dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
						    				 success: function () {
						    				 // 用户确认分享后执行的回调函数
						    					// alert("OK");
						    				 },
						    				 cancel: function () {
					    				 		// 用户取消分享后执行的回调函数
						    					//alert("fail");
						    				 },
						    				 fail: function () {
							    				 	// 用户取消分享后执行的回调函数
								    			   //alert("fail");
								    		 },
				    				 });
			   			});
			   			wx.error(function(res){
			   			    // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,
			   			    //也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
			   			   // alert("失败!");
			   			});
			   		}
	   		},"json");
  })

引用的jar包:

		<!-- 微信开发工具包 -->
        <dependency>
            <groupId>me.chanjar</groupId>
            <artifactId>weixin-java-mp</artifactId>
            <version>1.3.3</version>
        </dependency>
        <dependency>
            <groupId>me.chanjar</groupId>
            <artifactId>weixin-java-common</artifactId>
            <version>1.3.3</version>
        </dependency>

分享的后端代码:

	/**
	 * 
	 * 功能:微信分享接口,获取wx.config 所需的必要参数
	 * 作者:wj
	 * 日期:2019年5月23日上午9:22:13
	 */
	@RequestMapping(value = "/config", method = RequestMethod.GET)
	@ResponseBody
	public WxJsapiSignature wxJsSdkConfig(HttpServletRequest request,String url,String company) {
		WxMpService wxMpService = new WxMpServiceImpl();
		WxMpInMemoryConfigStorage config = new WxMpInMemoryConfigStorage();
		CustomConfig customConfig = SysConfigUtil.getSysConfigBySystem("weChatPaymentPlugin", company);
		//微信公众号的appid
		String AppId = customConfigService.findByKey("wx_app_id_"+company).getParaKeyValue();
		// 微信公众号的app corpSecret
		String Secret = customConfigService.findByKey("wx_app_secrate_"+company).getParaKeyValue()
		wxMpService.setWxMpConfigStorage(config);
		try {  // 直接调用wxMpServer 接口 
			WxJsapiSignature wxJsapiSignature = wxMpService.createJsapiSignature(url);
			return wxJsapiSignature;
		} catch (WxErrorException e) {
		e.getMessage();
		System.out.println(e.getMessage());
			return null;
		}
	}

微信号公共平台:

https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1445241432

成功页面展示;
描述,名称,

展开阅读全文

没有更多推荐了,返回首页