springmvc 结合jfinal及jfinal-weixin调用微信js-SDK

最近做基于微信公众号相关的项目，用到了微信的js-sdk。整合途中发现了开源框架jfinal以及基于jfinal的jfinal-weixin，并应用到项目中，在此感谢开源项目的作者以及开源的贡献者们。

微信js-sdk使用方法及步骤，传送门：点这里

jfinal 传送门：点这里

jfinal-weixin 传送门：点这里

由于我的项目不是有jfinal框架，用的是Springmvc 所以做了稍微的改造。

下面关键代码：

1、创建JSSDKInterceptor拦截器，配置使需要调用微信的js-sdk的方法都进入该拦截器，该拦截器主要作用是通过appid及appSecret等其他参数，通过微信提供的签名算法，生成签名，并传递到页面进调用。

注意我这是spring 的拦截器实现的是 HandlerInterceptor

public class JSSDKInterceptor implements HandlerInterceptor {

    此处代码省略。。。
}

//访问方法前
	@Override
	public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler)
			throws Exception {
		HandlerMethod methodObj;
		try {
			methodObj = (HandlerMethod) handler;
			System.out.println("MobileInterceptor methodObj : " + methodObj);
            //此处开始调用jfinal和jfinal-weixin
			ApiConfigKit.putApiConfig(getApiConfig());
			JsTicket jsApiTicket = JsTicketApi.getTicket(JsApiType.jsapi);
			String jsapi_ticket = jsApiTicket.getTicket();
			String nonce_str = create_nonce_str();
			// 注意 URL 一定要动态获取，不能 hardcode.
			String url = "http://" + request.getServerName() // 服务器地址
			// + ":"
			// + getRequest().getServerPort() //端口号
					+ request.getContextPath() // 项目名称
					+ request.getServletPath();// 请求页面或其他地址
			String qs = request.getQueryString(); // 参数
			if (qs != null) {
				url = url + "?" + (request.getQueryString());
			}
			System.out.println("url>>>>" + url);
			String timestamp = create_timestamp();
			// 这里参数的顺序要按照 key 值 ASCII 码升序排序
			// 注意这里参数名必须全部小写，且必须有序
			String str = "jsapi_ticket=" + jsapi_ticket + "&noncestr=" + nonce_str + "&timestamp=" + timestamp + "&url="
					+ url;
			String signature = HashKit.sha1(str);
			request.setAttribute("appId", ApiConfigKit.getApiConfig().getAppId());
			request.setAttribute("nonceStr", nonce_str);
			request.setAttribute("timestamp", timestamp);
			request.setAttribute("url", url);
			request.setAttribute("signature", signature);
			request.setAttribute("jsapi_ticket", jsapi_ticket);
		} catch (Exception e) {
			System.out.println("JSSDKInterceptor ClassCastException ---- handler:" + handler);
			System.out.println("JSSDKInterceptor Exception ---- :" + e.getMessage());
			response.sendRedirect(request.getContextPath() + "/rent/mobile/index/error?msg="+ URLEncoder.encode("微信JS接口获取异常","utf-8"));
			return false;
		}
		return true;
	}

    private static String create_timestamp() {
		return Long.toString(System.currentTimeMillis() / 1000);
	}

	private static String create_nonce_str() {
		return UUID.randomUUID().toString();
	}

getApiConfig() 代码如下：

public ApiConfig getApiConfig() {
		ApiConfig ac = new ApiConfig();

		// 配置微信 API 相关常量
		ac.setToken(Settings.getConfig("WX.JS.TOKEN"));//Settings.getConfig()是获取配置文件的方法，你可以用用你自己的或者jfinal提供的
		ac.setAppId(Settings.getConfig("WX.JS.APPID"));
		ac.setAppSecret(Settings.getConfig("WX.JS.APPSECRET"));

		/**
		 * 是否对消息进行加密，对应于微信平台的消息加解密方式： 1：true进行加密且必须配置 encodingAesKey
		 * 2：false采用明文模式，同时也支持混合模式
		 */
		ac.setEncryptMessage(Settings.getConfigBoolean("WX.JS.encryptMessage"));
		ac.setEncodingAesKey(Settings.getConfig("WX.JS.encodingAesKey"));
		return ac;
	}

spring-mvc.xml增加配置

<!-- wxjssdk视图拦截器 -->
		<mvc:interceptor>
			<mvc:mapping path="/**/wx/**" />
			<bean class="com.zykj.modules.interceptor.JSSDKInterceptor" />
		</mvc:interceptor>

controller方法

/**
	 * 微信demo
	 */
	@RequestMapping(value = "wx/wxdemo")
	public String wxdemo() {
		return "modules/common/wx/wxjsTest";
	}
	

jsp关键页面代码

//引入微信js
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
  <script>
  /*
   * 注意：
   * 1. 所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
   * 2. 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
   * 3. 常见问题及完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
   */
	 wx.config({
			      debug: true,
			      appId: '${appId}',//这些就是拦截器传入的
			      timestamp: '${timestamp}',//这些就是拦截器传入的
			      nonceStr: '${nonceStr}',//这些就是拦截器传入的
			      signature: '${signature}',//这些就是拦截器传入的
			      jsApiList: [
			        'checkJsApi',
			        'onMenuShareTimeline',
			        'onMenuShareAppMessage',
			        'onMenuShareQQ',
			        'onMenuShareWeibo',
			        'onMenuShareQZone',
			        'hideMenuItems',
			        'showMenuItems',
			        'hideAllNonBaseMenuItem',
			        'showAllNonBaseMenuItem',
			        'translateVoice',
			        'startRecord',
			        'stopRecord',
			        'onVoiceRecordEnd',
			        'playVoice',
			        'onVoicePlayEnd',
			        'pauseVoice',
			        'stopVoice',
			        'uploadVoice',
			        'downloadVoice',
			        'chooseImage',
			        'previewImage',
			        'uploadImage',
			        'downloadImage',
			        'getNetworkType',
			        'openLocation',
			        'getLocation',
			        'hideOptionMenu',
			        'showOptionMenu',
			        'closeWindow',
			        'scanQRCode',
			        'chooseWXPay',
			        'openProductSpecificView',
			        'addCard',
			        'chooseCard',
			        'openCard'
			      ]
			  });
   
  
</script>

自此整合完毕，就可以更具微信js-sdk的api，调用你想调用的接口啦～