(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)

时间:2022-10-18 09:04:19
版本说明:
    V1: 
       2014-2-13更新,红色字体代表最近一次更新的内容。
    V2:
            2014-3-30  更新,上一版本有很多读者反应说最后还是无法通过微信 token 认证,此版本特意解决这个问题。红色字体代表最近一次更新的内容。
 
至读者:
    对于版本 v1 不能成功的问题,我对此深表歉意,版本 v2 通过我再三测试,肯定能通过微信的 token,版本 v1 不能不能成功的问原因是 eclipse 新建的工程不对, 导致部署不成功,读者可以留意一下这里。另外,要特意感谢一位朋友,他通过远程协助给我演示了一遍,才能让我把问题给解决了,同时还要感谢那些信任和支持我的朋友,感谢那些向我反映问题的读者。
 
 
前言: 
因为要进行微信开发,就必须要成为微信开发者,要想成为微信开发者,就必须要有服务器响应微信的 Token 验证,如果没有公网服务器环境,可以去了解下BAE、SAE或阿里云,这里以 BAE 为例。
 
前提条件:
    (1)拥有微信公众平台帐号(申请地址:https://mp.weixin.qq.com/)
     (2)拥有百度BAE开发者帐号(申请地址:http://developer.baidu.com/)

(3)搭建好 Java 开发环境,没有搭建好的可参考 Java 开发环境搭建

 
准备工作:
    下载一个集成好BAE开发环境的eclipse(也可以在线安装插件),在百度网页(http://developer.baidu.com/wiki/index.php?title=docs/cplat/ide/install)最下面有一键安装那里下载,这是已预装了Baidu Eclipse插件以及 svn 版本管理工具的Eclipse安装包,下载到本地解压即可用(有可能首次启动会报错 Eclipse is running in a JRE, but a JDK is required, 解决方法,点此进入)。非常简单,不建议自己安装插件,除非你很熟悉怎么去安装。
 
如果你已经有了 MyEclipse 工具,那么,恭喜你,你不需要安装 Baidu Eclipse 也可以搭建一个开发环境,具体操作,请看另外一篇博客。
 
步骤:
 
1、去BAE快速创建一个JAVA应用
    去到百度开放云首页 (http://developer.baidu.com/),点击右上角 “管理控制台” ,进入我的应用页面:如图 1
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                        图 1
    点击 “创建应用” 填上应用名称,点击“保存”,如图2
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                       图 2
 
    你就会看到你创建好的应用:(图 3)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                                  图 3
 
2、添加部署
    点击应用图标,查看应用信息,点击“应用引擎” 弹出“部署列表”页面:图 4
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                               图 4
 
    点击“添加部署”,按要求填写, 类型选择 Java-tomcat:图5
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                                                               图 5
 
    创建失败并提示警告,由于 bae 升级到 3.0 版本,实行分批制度,看公告:图 6
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                            图 6
 
        很悲剧,如果你没有抢到执行单元,那你就只能等抢到再说,否则你就无法部署你的代码。
        查看部署:BAE部署创建成功后,在部署列表中可看到刚创建的部署信息。
        注意:代码版本工具支持:svn和git,建议选择 svn 因为这样比较省事。
 
3、通过 SVN 检入工程
    在 bae 上的应用添加部署成功后,如图 7
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse) 
                                                     图 7
    点击“点击查看”按钮,会打开一个新页面,页面上会打印 “hello world” ,这是因为我们的应用包含有示例代码,也就是基础工程,我们要将这个工程导出到本地,然后添加我们自己的代码,我们点击“点击复制”复制 svn 的地址备用。
 
    启动我们安装好的 Eclipse, 点击 File -->new --> other,从弹出的窗口中选择 svn,如图 8
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                    图 8
 
   点击 “从 SVN检出项目” --> Next -->  创建新的资源库位置 --> Next --> 粘贴刚才复制的 SVN 的地址 --> 点击显示的地址 Next --> 验证后会看到检测出的项目,如图 9
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                   图 9
 
    点击选中项目 --> Next --> 选中“做为新项目检出,***”,如图 10
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                 图 10
 
    点击 “Finish”,弹出页面中选择 “Yes” ,如图 11
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                图 11
 
注意:选择 “Yes”后,如果要百度验证,记得填写有 user 时不能是中文,如果你的百度账号是中文登录,赶紧去账号里关联手机号或者Email,这样你就可以通过手机号或者 Email 来登录百度了。
 
(往下比更新前变动很大,各位多留意)
 
    在弹出的新建项目向导对话框中选择  Web --> Dynamic Web project (动态 web 工程),( 注意不要选择 Baidu --> BAE Project ,版本 v1 叫大家选择BAE Project 会发现很难打包) 如图12:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                     图 12
 
    接着会弹出一个进程框,如图13:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                                                   图 13
   
    然后在弹出的窗口中填上你的项目名称,如图 14:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                                                     图 14
  
    在弹出的窗口中选 Next,弹出如下窗口:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
 
 
    注意要选中复选框,生成 web.xml 文件,  点击 “Finish”按钮,如果弹出如图15 所示对话框:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                                                                       图 15
 
    点击“OK”按钮,接着就是等待检出项目。
    成功检出来的项目是默认已经连接了 svn 的,并且不会报错,有报错的话,请留言联系我。
 
4、在工程中添加代码,让其响应微信验证
 
    查看我们的工程,如图 17
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                             图 17
 
    新建一个 servlet 包,方法是:"src" --> 右键 --> new --> packages, 命名随意,例如 org.ivy.course.servlet,如图:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
 
往包里添加一个能够处理请求的Servlet 类,这次我采用向导的方式添加,如图所示:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
 
点击图中的 “Create a new Servlet ” ,在弹出窗口中填上类名 CoreServlet :
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
 
点击 Next,注意弹出的窗口中的 URL mappings,访问时要用到它:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
 
点击 Next 后点击 “Finish”得到通过向导新建的类 CoreServlet:
 
  1. package org.ivy.course.servlet;
  2. import java.io.IOException;
  3. import javax.servlet.ServletException;
  4. import javax.servlet.annotation.WebServlet;
  5. import javax.servlet.http.HttpServlet;
  6. import javax.servlet.http.HttpServletRequest;
  7. import javax.servlet.http.HttpServletResponse;
  8. /**
  9. * Servlet implementation class CoreServlet
  10. */
  11. @WebServlet("/CoreServlet")
  12. public class CoreServlet extends HttpServlet {
  13. private static final long serialVersionUID = 1L;
  14. /**
  15. * Default constructor.
  16. */
  17. public CoreServlet() {
  18. // TODO Auto-generated constructor stub
  19. }
  20. /**
  21. * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
  22. */
  23. protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  24. // TODO Auto-generated method stub
  25. }
  26. /**
  27. * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
  28. */
  29. protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  30. // TODO Auto-generated method stub
  31. }
  32. }
新建的类 Servlet 可能会报错,同时导入的头文件也会报错,如图:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
 
 
这是因为缺少 servlet-api.jar 这个包,网络上下载这个包,添加到工程中就行了,做法是直接复制这个包,然后再工程的 WebContent/WEB-INF/Lib 中右键选择 Paste 粘贴进去并右键刷新工程就行了,实在不行,请参考我的博客 【The import javax.servlet cannot be resolved 解决方法】。
 
 我们在 doGet 方法中添加我们的代码,完整如下:
 
  1. package org.ivy.course.servlet;
  2. import java.io.IOException;
  3. import java.io.PrintWriter;
  4. import javax.servlet.ServletException;
  5. import javax.servlet.annotation.WebServlet;
  6. import javax.servlet.http.HttpServlet;
  7. import javax.servlet.http.HttpServletRequest;
  8. import javax.servlet.http.HttpServletResponse;
  9. import org.ivy.course.util.SignUtil;
  10. /**
  11. * Servlet implementation class CoreServlet
  12. */
  13. @WebServlet("/CoreServlet")
  14. public class CoreServlet extends HttpServlet {
  15. private static final long serialVersionUID = 1L;
  16. /**
  17. * Default constructor.
  18. */
  19. public CoreServlet() {
  20. // TODO Auto-generated constructor stub
  21. }
  22. /**
  23. * 确认请求来自微信服务器
  24. * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
  25. */
  26. protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  27. // TODO Auto-generated method stub
  28. // my
  29. // 微信加密签名
  30. String signature = request.getParameter("signature");
  31. // 时间戮
  32. String timestamp = request.getParameter("timestamp");
  33. // 随机数
  34. String nonce = request.getParameter("nonce");
  35. // 随机字符串
  36. String echostr = request.getParameter("echostr");
  37. PrintWriter out = response.getWriter();
  38. // 通过检验 signature 对请求进行校验,若校验成功则原样返回 echostr,表示接入成功,否则接入失败
  39. if(SignUtil.checkSignature(signature, timestamp, nonce)){
  40. out.print(echostr);
  41. }
  42. out.close();
  43. out = null;
  44. }
  45. /**
  46. * 处理微信服务器发来的消息
  47. * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
  48. */
  49. protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  50. // TODO Auto-generated method stub
  51. // 消息的接收、处理、响应
  52. }
  53. }

在doGet方法中调用了checkSignature方法,该方法还没有实现,我们新建一个包 org.ivy.course.util 作为一个工具包,并往该包中添加新类 SignUtil,添加类的方法是:包名右键 -->new --> class,填上类名,其它默认,完整代码如下:

 
 
  1. package org.ivy.course.util;
  2. import java.security.MessageDigest;
  3. import java.security.NoSuchAlgorithmException;
  4. import java.util.Arrays;
  5. public class SignUtil {
  6. /**
  7. * 与接口配置信息中的 token 要一致,这里赋予什么值,在接口配置信息中的Token就要填写什么值,
  8. * 两边保持一致即可,建议用项目名称、公司名称缩写等,我在这里用的是项目名称weixinface
  9. */
  10. private static String token = "weixinface";
  11. /**
  12. * 验证签名
  13. * @param signature
  14. * @param timestamp
  15. * @param nonce
  16. * @return
  17. */
  18. public static boolean checkSignature(String signature, String timestamp, String nonce){
  19. String[] arr = new String[]{token, timestamp, nonce};
  20. // 将 token, timestamp, nonce 三个参数进行字典排序
  21. Arrays.sort(arr);
  22. StringBuilder content = new StringBuilder();
  23. for(int i = 0; i < arr.length; i++){
  24. content.append(arr[i]);
  25. }
  26. MessageDigest md = null;
  27. String tmpStr = null;
  28. try {
  29. md = MessageDigest.getInstance("SHA-1");
  30. // 将三个参数字符串拼接成一个字符串进行 shal 加密
  31. byte[] digest = md.digest(content.toString().getBytes());
  32. tmpStr = byteToStr(digest);
  33. } catch (NoSuchAlgorithmException e) {
  34. // TODO Auto-generated catch block
  35. e.printStackTrace();
  36. }
  37. content = null;
  38. // 将sha1加密后的字符串可与signature对比,标识该请求来源于微信
  39. return tmpStr != null ? tmpStr.equals(signature.toUpperCase()): false;
  40. }
  41. /**
  42. * 将字节数组转换为十六进制字符串
  43. * @param digest
  44. * @return
  45. */
  46. private static String byteToStr(byte[] digest) {
  47. // TODO Auto-generated method stub
  48. String strDigest = "";
  49. for(int i = 0; i < digest.length; i++){
  50. strDigest += byteToHexStr(digest[i]);
  51. }
  52. return strDigest;
  53. }
  54. /**
  55. * 将字节转换为十六进制字符串
  56. * @param b
  57. * @return
  58. */
  59. private static String byteToHexStr(byte b) {
  60. // TODO Auto-generated method stub
  61. char[] Digit = {'0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'};
  62. char[] tempArr = new char[2];
  63. tempArr[0] = Digit[(b >>> 4) & 0X0F];
  64. tempArr[1] = Digit[b & 0X0F];
  65. String s = new String(tempArr);
  66. return s;
  67. }
  68. }

代码添加完毕,工程右键,删除工程中的 ROOT.war 包,  然后工程右键重新打包一个 ROOT.war 包,名字必须和原来一样,保存地址也和原来一样,具体是,右键 -->  Export --> WAR file:

 
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
 
 
导出后,项目右键刷新工程,包 ROOT.war 就会重新出现在工程中,然后我们提交我们的工程到百度 BAE 上就行了,具体做法看下面。
 
 
5、提交修改后的代码
 
    工程右键 --> Team --> 提交 --> ok, 如图 18
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                图 18
 
     如果要验证,就输入你的百度账号密码,提交成功后,部署列表状态栏会显示“有新版”,此时点击“快捷发布”也等同上线。如图 19 所示:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                                                                         图 19
     发布后,点击查看,在弹出页面的地址中添加上面叫你记住的那个 URL mappings,如果你没有改过,默认是“/CoreServlet”,如果你 实在忘了,可以到你的类CoreServlet 中找到这个语句: @WebServlet("/CoreServlet"),就是这个后缀,举个例子,例如你点击查看的网站是  < http://weitest.duapp.com >  ,添加后缀后的地址是 < http://weitest.duapp.com /CoreServlet > 填完网址后回车,就能看到如下页面:
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
 
看到此画面就说明你离成功只差一步了,记住复制此网页的地址备用。
 
6、成为微信开发者
 
    打开微信公众平台 -> 高级功能 -> 开发者模式,见图 20:
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)                                                         图20
 
 
将我们刚才复制的地址黏贴到 URL
 
在填写 Token 之前,也回到我们的项目,在类 SignUtil 中有这么一句代码:
 
  1. private static String token = "weixinface";
    代码中的 token 的值我们可以随意写,但是,这里是什么值,在微信平台上就要填写对应的内容,所有,在 Token 那里填上 weixinface,点击“提交”,如果代码没有问题,瞬间你就可以看到“你已成为开发者” 的提示:如图 22
 
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
(转)微信公众平台开发之基于百度 BAE3.0 的开发环境搭建(采用 Baidu Eclipse)
                                                               图 22
 
       到此,所有的工作都已经完成,你可以不断丰富你的代码,实现不同的功能。你也可以在自己的微信中关注自己的订阅号,只需扫描公众平台的二维码就行了。
 
扩展说明:
    其实,上述提交代码到百度 BAE 中的这么一个操作,我觉得更多的是将 BAE 作为一个谷仓,就是一个存放代码的服务器来用,以方便我们在任何地方都可以通过 SVN 工具检出我们的代码,从而随时开始我们的项目,特别是多人一起做的项目,而微信 Token 认证访问的其实只有 ROOT.war 这个包,不信,你可以另外安装一个 SVN 工具,重新打包 ROOT.war,并通过 SVN 将 ROOT.war 这个包提交到 BAE 上,一样可以通过微信 Token 验证,我的另外一篇博客就是仅仅提交 ROOT.war 这个包的,有兴趣的可以去看看,但是,这是为什么?其实也很简单,我们打包的 ROOT.war 中其实已经有我们的所以源代码了,你可以解压 ROOT.war 文件,看看里面到底有些什么东西,你就会懂的。