2017-03-31 17:06:40 gb4215287 阅读数 1083
  • 带你玩转SVN

    SVN是版本控制利器,团队协作工具之一。本课程主要面向开发人员,帮助初学者意识到版本控制的重要性,掌握SVN环境的搭建,以及SVN客户端工具的使用。

    19223 人正在学习 去看看 刘运强

来源:http://www.cnblogs.com/Leo_wl/p/5983030.html

前几天写了一篇使用fiddler调试微信端页面的,然后博友评论说使用fiddler太麻烦了,推荐使用微信web开发者工具调试微信页面,这两天弄着玩了一下,很强大。这篇文章只是做一个记录,方便自己以后使用的时候看看,不对的地方请大家批评指正。放入官方的微信web开发者工具下载链接以及文档说明https://mp.weixin.qq.com/wiki/10/e5f772f4521da17fa0d7304f68b97d7e.html,参考这个文档,我又给细节化了一些内容。下载以后直接安装就好。

1.下载安装好以后,打开界面是这样的。

 

 

2.我们点击登录,会出现扫描二维码页面,用你自己的微信扫一下登录就可以

  

 

3.登录以后,就可以对我们的微信企业号页面进行调试,请注意!!!要想调试当前的企业号页面,你登录的微信号,必须是这个企业号的管理员(这在微信开发者工具的说明文档有写),如果不是,请在你们的企业号开发端把你的微信设置为管理员。否则在开发者工具里面将会出现下面这个页面,如图

 

   管理员设置界面如图:

   

 

在企业号管理页面添加完毕以后,会在你的手机微信端有提醒,记得按照他的提醒设置一下开发者工具的登陆密码,如果没有设置密码,你依然登陆不上去,如图所示:

 

设置完密码以后,我们点击登录,发现还是上不去,如图所示:

 

点进去以后,如图所示:

 

2.上面所有的都设置过以后,我们登陆开发工具,随意打开一个公众号的页面,复制链接放在开发工具的地址栏,现在基本上就可以在电脑上面进行调试了。页面如图:(关注一下移动调试)

 

3.这个工具更加强大的功能!点击窗口中的移动调试。

  3-1.如图所示,我们先选择Android设备调试--普通调试,

  

 

 

  接着我们只要按照他的提示--调试步骤设置我们的手机就可以,手机代理设置如图所示:

 

手机设置完毕代理以后,点击开发者工具页面中的开始调试就可以,很强大,我们选中的页面部分,会在手机上面实时显示出来。(自己体验一下。)

  3-2.如图所示,我们先选择Android设备调试--X5 Blink内核调试,这个功能更强大!

这一部分强烈建议看一下官网的文档说明,我先copy一下放在这。

移动调试

移动端网页的表现,通常和桌面浏览器上有所区别,包括样式的呈现、脚本的逻辑等等,这会给开发者带来一定的困扰。现在,微信安卓客户端 webview 已经开始全面升级至 X5 Blink 内核,新的内核无论在渲染能力、API 支持还是在开发辅助上都有很大进步。通过微信 web 开发者工具中的远程调试功能,实时映射手机屏幕到微信 web 开发者工具上,将帮助开发者更高效地调试 X5 Blink 内核的网页,具体步骤如下:

(1)准备工作

1. 安装0.5.0或以上版本的微信 web 开发者工具

2. 确认移动设备是否支持远程调试功能

  打开微信 web 开发者工具,选择“移动调试”tab,点击验证移动设备是否支持。随后使用移动设备扫描弹出的二维码,在设备上即可获得支持信息。

3. 打开移动设备中的 USB 调试功能

  1.打开移动设备,进入“设置”->“开发人员选项”

  2.勾选“USB 调试功能”

 

  需要注意的是,Android 4.2 之后的设备,开发人员选项默认是隐藏的,通过以下步骤可以打开:

  1.打开移动设备,进入“设置”->“关于手机”

  2.找到并单击“内部版本号”7次

4. 安装移动设备 USB 驱动

  通常开发者可以在移动设备厂商的官网中下载到相关驱动,或者使用腾讯手机管家来安装设备驱动。

5. 打开 X5 Blink 内核的 inspector 功能

  打开微信 web 开发者工具,选择“移动调试”tab ,使用设备扫描“调试步骤”中的二维码。

  如下图,勾选“是否打开 TBS 内核 Inspector 调试功能”,并重启微信。

  

(2)开始调试

使用 USB 数据线连接移动设备与 PC 或者 Mac 后,点击打开微信 web 开发者工具“移动调试”tab,选择 X5 Blink 调试功能,将会打开一个新窗口,在微信中访问任意网页即可开始调试。关于 X5 Blink 内核更多信息,可以查看官网介绍

在所有准备工作都完成的情况下,窗口中可以看到当前设备的基本信息:

点击任意页面的“inspect”,打开新窗口,开发者会看到熟悉的调试界面:

点击上图右上角的“手机”图标,将启用屏幕映射功能:

 

 

下面我来补充一下:

3-2-1.打开我们手机的调试USB调试功能,我的手机是三星S7,(高版本Android好像都这么弄,如果你的不可以,就问问度娘)找了半天没找到,问了度娘才找到。。。。写个记录

在下拉通知栏里面选择设置,如图:

                    

在版本号那里多点击几次,页面就会有提醒,再点击几次就可以打开开发者选项,打开以后,在我们设置里面就出现了开发者选项,点进去,把USB调试打开就好了。

额外内容----如何关闭开发者选项???如图所示

                

 

3-2-2打开 X5 Blink 内核的 inspector 功能

             打开微信 web 开发者工具,选择“移动调试”tab ,使用设备扫描“调试步骤”中的二维码。如下图,勾选“是否打开 TBS 内核 Inspector 调试功能”,并重启微信。

 

3-2-3开始调试

    上面的设置都弄完以后,点击页面的的开始调试按钮,手机上出现下面这个页面,如图,我们点击确定就可以。

 

然后我们的调试工具就会弹出这个页面:

此时基本上就可以了,我们在我们的手机上随意打开一个我们要调试的微信公众号的页面。如图

打开以后如图所示:左侧是我们的调试工具页面,右侧是我们的手机上显示的页面,是不是非常棒,哈哈哈哈,

           

 

点击调试工具页面右上角的手机图标,可以将手机页面映射到调试工具里面,如图所示:


2014-03-30 20:55:45 bingtianlong 阅读数 4616
  • 带你玩转SVN

    SVN是版本控制利器,团队协作工具之一。本课程主要面向开发人员,帮助初学者意识到版本控制的重要性,掌握SVN环境的搭建,以及SVN客户端工具的使用。

    19223 人正在学习 去看看 刘运强
转载请标明出处,谢谢! 
版本说明:
    V1: 
        2014-3-30 版

前言:
因为要进行微信开发,就必须要成为微信开发者,要想成为微信开发者,就必须要有服务器响应微信的 Token 验证,如果没有公网服务器环境,可以去了解下BAE、SAE或阿里云,这里以 BAE 为例。

前提条件:
    (1)拥有微信公众平台帐号(申请地址:https://mp.weixin.qq.com/)
    (2)拥有百度BAE开发者帐号(申请地址:http://developer.baidu.com/)
    (3)搭建好 Java 开发环境,没有搭建好的可参考 Java 开发环境搭建

准备工作:
    下载安装 MyEclipse 工具,SVN 代码版本管理工具,SVN 在给百度 BAE 提交 war 包的方法请参考百度开发者文档 SVN 的使用 <http://developer.baidu.com/wiki/index.php?title=docs/cplat/rt/manage/svn#SVN.E5.AE.A2.E6.88.B7.E7.AB.AF.E4.BD.BF.E7.94.A8.E8.AF.B4.E6.98.8E>


详细步骤:

1、去BAE快速创建一个JAVA应用
    去到百度开放云首页 (http://developer.baidu.com/),点击右上角 “管理控制台” ,进入我的应用页面:如图 1

                                                图 1

    点击 “创建应用” 填上应用名称,点击“保存”,如图2

                                       图 2

    你就会看到你创建好的应用:(图 3)

                                                  图 3

2、添加部署
    点击应用图标,查看应用信息,点击“应用引擎” 弹出“部署列表”页面:图 4

                                               图 4

    点击“添加部署”,按要求填写, 类型选择 Java-tomcat:图5

图 5

如果部署失败并提示警告,由于 bae 升级到 3.0 版本,实行分批制度,看百度网站公告,如果你没有拿到 BEA 资源,就无法继续进行操作。

成功部署后,是这样的:



3、新建项目

    打开 MyEclipse ,新建一个 Web Project :



    新建一个 servlet 包,方法是:"src" --> 右键 --> new --> packages, 命名随意,例如 org.ivy.course.servlet

    通过向导往包里添加一个能够处理请求的Servlet 类,具体操作时包名右键 --> new --> Servlet:





    finish 后,就能看到建好的类,并配有示例代码:

package org.ivy.course.servlet;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class CoreServlet extends HttpServlet {

    /**
     * Constructor of the object.
     */
    public CoreServlet() {
        super();
    }

    /**
     * Destruction of the servlet. <br>
     */
    public void destroy() {
        super.destroy(); // Just puts "destroy" string in log
        // Put your code here
    }

    /**
     * The doGet method of the servlet. <br>
     *
     * This method is called when a form has its tag value method equals to get.
     * 
     * @param request the request send by the client to the server
     * @param response the response send by the server to the client
     * @throws ServletException if an error occurred
     * @throws IOException if an error occurred
     */
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        response.setContentType("text/html");
        PrintWriter out = response.getWriter();
        out.println("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");
        out.println("<HTML>");
        out.println("  <HEAD><TITLE>A Servlet</TITLE></HEAD>");
        out.println("  <BODY>");
        out.print("    This is ");
        out.print(this.getClass());
        out.println(", using the GET method");
        out.println("  </BODY>");
        out.println("</HTML>");
        out.flush();
        out.close();
    }

    /**
     * The doPost method of the servlet. <br>
     *
     * This method is called when a form has its tag value method equals to post.
     * 
     * @param request the request send by the client to the server
     * @param response the response send by the server to the client
     * @throws ServletException if an error occurred
     * @throws IOException if an error occurred
     */
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        response.setContentType("text/html");
        PrintWriter out = response.getWriter();
        out.println("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");
        out.println("<HTML>");
        out.println("  <HEAD><TITLE>A Servlet</TITLE></HEAD>");
        out.println("  <BODY>");
        out.print("    This is ");
        out.print(this.getClass());
        out.println(", using the POST method");
        out.println("  </BODY>");
        out.println("</HTML>");
        out.flush();
        out.close();
    }

    /**
     * Initialization of the servlet. <br>
     *
     * @throws ServletException if an error occurs
     */
    public void init() throws ServletException {
        // Put your code here
    }

}

    同时,配置文件 web.xml 也会自动添加 <servlet> 和 <servlet-mapping> 两个配置项:

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" 
    xmlns="http://java.sun.com/xml/ns/javaee" 
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
    http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">

  <servlet>
    <description>This is the description of my J2EE component</description>
    <display-name>This is the display name of my J2EE component</display-name>
    <servlet-name>CoreServlet</servlet-name>
    <servlet-class>org.ivy.course.servlet.CoreServlet</servlet-class>
  </servlet>

  <servlet-mapping>
    <servlet-name>CoreServlet</servlet-name>
    <url-pattern>/servlet/CoreServlet</url-pattern>
  </servlet-mapping>

  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>
</web-app

    如果你想看看这些代码有什么效果,你可以试着运行工程:run as --> MyEclipse server Appcation,弹出网页:



    我们在上图中的网址后面添加 <url-pattern> 中设定的值 /servlet/CoreServlet (见 web.xml 文件)并回车,效果如下:



   看到这些网页打印的信息,再对比一下代码,你应该能明白上述示例代码的用处了。

    我们按控制台那个红色方框,停止运行工程,回到类  CoreServlet,将 doGet 和 doPost 方法里面的代码删掉,并在 doGet 方法中国添加我们的代码:

// my
// 微信加密签名
String signature = request.getParameter("signature");
// 时间戮
String timestamp = request.getParameter("timestamp");
// 随机数
String nonce = request.getParameter("nonce");
// 随机字符串
String echostr = request.getParameter("echostr"); 

PrintWriter out = response.getWriter();
// 通过检验 signature 对请求进行校验,若校验成功则原样返回 echostr,表示接入成功,否则接入失败
if(SignUtil.checkSignature(signature, timestamp, nonce)){
   out.print(echostr);
}

out.close();
out = null; 

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

package org.ivy.course.util;

import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;
import java.util.Arrays;

public class SignUtil {
       /**
     * 与接口配置信息中的 token 要一致,这里赋予什么值,在接口配置信息中的Token就要填写什么值,
     * 两边保持一致即可,建议用项目名称、公司名称缩写等,我在这里用的是项目名称weixinface
     */
    private static String token = "weixinface";
    
    /**
     * 验证签名
     * @param signature
     * @param timestamp
     * @param nonce
     * @return
     */
    public static boolean checkSignature(String signature, String timestamp, String nonce){
        String[] arr = new String[]{token, timestamp, nonce};
        // 将 token, timestamp, nonce 三个参数进行字典排序
        Arrays.sort(arr);
        StringBuilder content = new StringBuilder();
        for(int i = 0; i < arr.length; i++){
            content.append(arr[i]);
        }
        MessageDigest md = null;
        String tmpStr = null;
        
        try {
            md = MessageDigest.getInstance("SHA-1");
            // 将三个参数字符串拼接成一个字符串进行 shal 加密
            byte[] digest = md.digest(content.toString().getBytes());
            tmpStr = byteToStr(digest);
        } catch (NoSuchAlgorithmException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        content = null;
        // 将sha1加密后的字符串可与signature对比,标识该请求来源于微信
        return tmpStr != null ? tmpStr.equals(signature.toUpperCase()): false;
    }
    
    /**
     * 将字节数组转换为十六进制字符串
     * @param digest
     * @return
     */
    private static String byteToStr(byte[] digest) {
        // TODO Auto-generated method stub
        String strDigest = "";
        for(int i = 0; i < digest.length; i++){
            strDigest += byteToHexStr(digest[i]);
        }
        return strDigest;
    }
    
    /**
     * 将字节转换为十六进制字符串
     * @param b
     * @return
     */
    private static String byteToHexStr(byte b) {
        // TODO Auto-generated method stub
        char[] Digit = {'0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'};
        char[] tempArr = new char[2];
        tempArr[0] = Digit[(b >>> 4) & 0X0F];
        tempArr[1] = Digit[b & 0X0F];
        
        String s = new String(tempArr);
        return s;
    }
}

   最后,看看代码,代码应该不会出错的了,但是,在类名 CoreServlet 上应该有个警告,根据编译器的提示,鼠标移到 CoreServlet 上,根据提示选择 add default serial Version ID 添加一个默认的 serialVersionUID。

    到此,代码的编辑工作完成了,下一步就是打包部署了。

4、打包并提交到百度 BAE
    
    工程右键打包一个 ROOT.war 包,名字必须是这个,保存地址建议保存到工程目录下,具体操作: 工程右键 -->  Export --> Java EE --> WAR file,根据提示来操作保存。

    到我们的 SVN 工作目录,新建一个文件夹,命名随意,例如 weixin0330,然后在文件夹上右键,选择 SVN CheckOut,填上 URL 地址,该地址可以到百度 BAE 上我们部署的应用中获得。

    Checkout 出来默认版本号是 1:



   进入CheckOut 的项目中,可以看到目录结构如下:



    鼠标选中 ROOT.war 文件,右键 --> TortoiseSVN --> Delect,将该文件删除,删除后,文件夹会有一个感叹号,我们在文件夹 weixin0330 上:右键 --> SVN Commit --> OK,目的是将百度 BAE 上面的 ROOT.war 删除掉:



    然后,我们回到 MyEclipse 的工作空间,将我们打包好的 ROOT.war 文件复制到 SVN 的工程目录下,复制进来的 ROOT.war 文件上会有个问号:



    我们在文件 ROOT.war 上右键 --> TortoiseSVN --> add,此时问号变成加号,然后在文件夹 weixin0330 上:右键 --> SVN Commit --> OK,将我们最新的ROOT.war 提交到百度 BAE 。

    然后回到百度 BAE 中查看我们的部署列表,会看到提示有“新版本” ,点击快捷发布。

    然后点击查看,在弹出网页的网址后面添加web.xml 文件中 <url-pattern> 设定的值“ /servlet/CoreServlet” 并回车,会看到如下页面:



   如果你看到了上述 500 画面说明你离成功只差一步了,记住复制此网页的地址备用。


5、成为微信开发者
    
打开微信公众平台 -> 高级功能 -> 开发者模式,见图:



    将我们刚才复制的地址黏贴到 URL ;

    在填写 Token 之前,回到我们的项目,在类 SignUtil 中有这么一句代码:

private static String token = "weixinface";

   代码中的 token 的值我们可以随意写,但是,这里是什么值,在微信平台上就要填写对应的内容,所有,在 Token 那里填上 weixinface,点击“提交”,如果代码没有问题,瞬间你就可以看到“你已成为开发者” 的提示,如图 :



   到此,所有的工作都已经完成,你可以不断丰富你的代码,实现不同的功能。你也可以在自己的微信中关注自己的订阅号,只需扫描公众平台的二维码就行了。    


欢迎关注我的订阅号:天龙智能
二维码:


郑重声明
    本博客的代码是来自柳老师的博客( http://blog.csdn.net/column/details/wechatmp.html )我只是作为一种补充,我希望以此方式来表达我对柳老师的感谢之情,完全没有盗版之意,如有侵犯,请联系我,谢谢!



2017-03-01 09:13:42 mqbeauty 阅读数 471
  • 带你玩转SVN

    SVN是版本控制利器,团队协作工具之一。本课程主要面向开发人员,帮助初学者意识到版本控制的重要性,掌握SVN环境的搭建,以及SVN客户端工具的使用。

    19223 人正在学习 去看看 刘运强

1、打开微信开发者文档,找到开始开发,接入指南,页面往下翻找到PHP示例代码下载,解压后文件为wx_sample.php:
这里写图片描述
2、复制wx_sample.php到开发目录下面,更名为api.php,并通过svn上传到服务器;
3、打开微信开发平台开发者中心(用微信公众号账号和密码登录),找到基本配置->修改配置:
这里写图片描述
define(“TOKEN”, “weixin”);
//实例化微信对象
wechatObj=newwechatCallbackapiTest();wechatObj->valid();
4、URL:回到百度云引擎部署列表,点击域名,在打开的页面复制网址,粘贴到微信配置URL,并加上/api.php;
5、Token:api.php中设置的秘钥;
这里写图片描述
6、点击生成随机数;
7、点击确定,如果失败可以多提交几次,PS:在提交之前不要改动api.php中内容,验证成功后再注释掉valid()方法;
8、提交成功后开启服务器配置功能,该功能开启后在后台定义的自动回复等功能失效;
9、此时微信公众号与自定义服务器对接成功;

2016-03-28 20:08:31 baidu_22522021 阅读数 512
  • 带你玩转SVN

    SVN是版本控制利器,团队协作工具之一。本课程主要面向开发人员,帮助初学者意识到版本控制的重要性,掌握SVN环境的搭建,以及SVN客户端工具的使用。

    19223 人正在学习 去看看 刘运强

前言:版本控制用的是SVN
先了解一下各个头文件所代表的不同文本类型:php中利用header设置content-type和常见文件类型的content-type

1.在此处添加:header(‘content-type:text’);

2.保存在验证就行了

补加一个问题:
如果出现配置失败,可能出现的问题:
1.服务器的URL不对
2.不同的公众号在同一个服务器上的token写一样了,这也会显示配置失败

2018-02-12 19:28:00 weixin_30954265 阅读数 7
  • 带你玩转SVN

    SVN是版本控制利器,团队协作工具之一。本课程主要面向开发人员,帮助初学者意识到版本控制的重要性,掌握SVN环境的搭建,以及SVN客户端工具的使用。

    19223 人正在学习 去看看 刘运强

1  作用

两个疑问:

  1. 什么是版本控制?
  2. 为什么要用版本控制工具?

作用:

  1. 受保护
  2. 受约束

合作开发中,版本控制工具更重要的作用就是让开发者更好地协作,每个人的代码既能互相调用,来共同完成一个较大的功能,又不会互相之间产生冲突。

至于用哪个工具去控制并不重要,工具只是个手段,只要这个工具能够让开发者们协作工作就可以。

2  SVN介绍

  • SVN客户端:TortoiseSVN:http://tortoisesvn.net/downloads.html
  • SVN服务端:VisualSVN:http://www.visualsvn.com/server/download

先安装服务端(需有可视化界面和PATH路径),注意安装路径和仓库路径。

注:仓库:所有上传的代码都在仓库中,若服务器仓库中的代码丢了,那就是真的丢了,找不回来。

如果仅仅是为了上传代码发布网页,则只需安装客户端就可以了。

3  使用

客户端安装完毕后,在需要存储代码的文件夹下右击鼠标,会有一个“SVN Checkont”,点击(只有第一次从服务器端获取代码,需要使用此选项)。

填写服务器端仓库的URL及下载到本地的存储路径,OK即可:

在本地仓库添加代码后,在文件夹下右击“SVN Commit”就可以上传代码到服务器了。

注:在本地仓库文件夹下新增、修改、删除文件,都属于本地操作,不属于SVN操作。也就是说,所有SVN操作必定是从右击“SVN Commit”下进行的

本地与服务器一致的文件,通常左下角会带有一个绿色的“√”,不一致的是红色的“×”。

“SVN Update”是从服务器端下载代码的。

可以这样理解,团队合作时,每天早上都要“SVN Update”从服务器端下载最新的程序,每天下班都要“SVN Commit”上传修改的代码。

需要注意,“TortoiseSVN”中的“Show log”可以查看历史版本、修改人、修改时间等各种记录。

转载于:https://www.cnblogs.com/qijunhui/p/8445376.html

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