基于PHP在微信公众号上运行的H5牛牛游戏，放在wamp的www目录下，用谷歌浏览器打开项目（会提示请在微信客户端中打开），

因为这个H5游戏接入了微信的接口，就必须在微信客户端上运行才达到预期的调试效果，那怎么办呢？

有两个办法：

① 在电脑安装Windows的微信客户端。

② 用花生壳的内网穿透（利用外网访问本地地址localhost）+手机微信客户端。

接下来就和大家分享一下搭建H5微信公众号游戏和配置环境的各种坑。

工具

花生壳（www.oray.com）

首先必须注册一个账号，然后点击内网穿透，新建个映射如下图

映射类型 ： 网站80端口

选择域名 ： 这个是注册的时候花生壳送你的（我注册的时候好像要交6块什么什么费，不记得了）

应用名称 ： web

内网主机 ： 127.0.0.1

内网端口 ： 80

最后确定，至此，你wamp里面www文件夹下的项目就可以被你刚刚花生壳给你的域名访问了，前提是你安装了wamp后输入localhost能正常打开。

最后测试一下，

把 localhost/index.php 换成 花生壳给你的域名/index.php。是一样的效果的。

以上就是花生壳穿透内网步骤。

 

wampserver（我的版本是2.5）

：这东西必须安装完是绿色，浏览器输入localhost能正常打开哦，安装方法这里不多阐述，自己百度一下。

 

 

 微信公众号测试号（https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login）

appid和appscret是本来就配给你的，这两个东西是用来配置你游戏里面的参数的，可先不管

 

URL：http://刚刚花生壳的域名/wx_sample.php

liweijian(这个随便填，我先填这个了)

把wx_sample.php放在www文件夹下，附上代码，自己新建个php文件复制进去，最后点提交（显示配置成功才行）

<?php
/**
  * wechat php test
  */
//define your token
define("TOKEN", "liweijian");
$wechatObj = new wechatCallbackapiTest();
$wechatObj->valid();
class wechatCallbackapiTest
{
    public function valid()
    {
        echoStr=_GET["echostr"];
        //valid signature , option
        if($this->checkSignature()){
            echo $echoStr;
            exit;
        }
    }
    public function responseMsg()
    {
        //get post data, May be due to the different environments
        postStr=GLOBALS["HTTP_RAW_POST_DATA"];
          //extract post data
        if (!empty($postStr)){
                /* libxml_disable_entity_loader is to prevent XML eXternal Entity Injection,
                   the best way is to check the validity of xml by yourself */
                libxml_disable_entity_loader(true);
                  postObj=simplexmlloadstring(postStr, \'SimpleXMLElement\', LIBXML_NOCDATA);
                fromUsername=postObj->FromUserName;
                toUsername=postObj->ToUserName;
                keyword=trim(postObj->Content);
                $time = time();
                $textTpl = "<xml>
                            <ToUserName><![CDATA[%s]]></ToUserName>
                            <FromUserName><![CDATA[%s]]></FromUserName>
                            <CreateTime>%s</CreateTime>
                            <MsgType><![CDATA[%s]]></MsgType>
                            <Content><![CDATA[%s]]></Content>
                            <FuncFlag>0</FuncFlag>
                            </xml>";             
                if(!empty( $keyword ))
                {
                      $msgType = "text";
                    $contentStr = "Welcome to wechat world!";
                    resultStr=sprintf(textTpl, fromUsername,toUsername, time,msgType, $contentStr);
                    echo $resultStr;
                }else{
                    echo "Input something...";
                }
        }else {
            echo "";
            exit;
        }
    }
        
    private function checkSignature()
    {
        // you must define TOKEN by yourself
        if (!defined("TOKEN")) {
            throw new Exception(\'TOKEN is not defined!\');
        }
        
        signature=_GET["signature"];
        timestamp=_GET["timestamp"];
        nonce=_GET["nonce"];
                
        $token = TOKEN;
        tmpArr=array(token, timestamp,nonce);
        // use SORT_STRING rule
        sort($tmpArr, SORT_STRING);
        tmpStr=implode(tmpArr );
        tmpStr=sha1(tmpStr );
        
        if( tmpStr==signature ){
            return true;
        }else{
            return false;
        }
    }
}
?>

 

 

 域名：花生壳域名（不要加http）

 

 

至此，微信公众号测试号已经配置完

 你需要测试的微信人员，扫一扫加入就好了，如果没加入的话，就会访问不到项目里面的微信接口

这里按修改

 这里输入花生壳的域名 ，不加http

 

 下一步就是登录你的公众号了，记住是你的，不是这个测试号。

点击开发者工具

 

 

配置刚刚加入扫码那两个微信测试

 

 最后配置一下白名单，不懂的填什么的话，把有关IP都写上去把

接下来，关于php的一系列报错，我们下来配置一些东西

 

wamp配置ssl

下载openssl安装程序,安装完以后可以从根目录把libeay32.dll和ssleay32.dll copy到C:\wamp\bin\apache\apachex.x.xx\bin下.

apache需要有ssl_module.mo,php需要安装php_openssl.（百度即可）

 

一、设置环境变量 
1、管理员权限运行CMD，cd C:\wamp\bin\apache\Apache2.4.9\conf 
2、set OPENSSL_CONF=..\conf\openssl.cnf

二、生成server.key 
cd C:\wamp\bin\apache\Apache2.4.9\bin 
openssl genrsa 1024>server.key

三、生成server.csr 
openssl req -new -key server.key > server.csr 
需要用户输入国家代码之类的信息：CN—GD—DG—Relay2—OA—417930908@qq.com 
注意：其中的Common Name只能输入域名（花生壳域名）或IP
Common Name 必须和 httpd.conf 中 server name 必须一致， 否则 apache 不能启动（启动 apache 时错误提示为： server RSA certificate CommonName (CN) `Kedou’ does NOT match server name!? ） 
最后的密码和公司名称可以为空

四、生成server.crt 
openssl req -x509 -days 365 -key server.key -in server.csr > server.crt

在bin 目录下，找到 
server.crt 
server.csr 
server.key 
三个文件，将此三个文件复制到Apache的conf目录下

五、配置：C:\wamp\bin\apache\Apache2.4.9\conf\httpd.conf，取消注释： 
Include conf/extra/httpd-ssl.conf 
LoadModule ssl_module modules/mod_ssl.so

修改： 
“ 

Options FollowSymLinks 
AllowOverride None 
Order deny,allow 
Deny from all 

”中的Deny from all为Allow from all，另外几处Deny from all不用改 
我的版本中并不需要更改Deny from all这块

六、配置：C:\wamp\bin\apache\Apache2.4.9\conf\extra\httpd-ssl.conf 
“SSLCertificateKeyFile…..”这行改成SSLCertificateKeyFile “C:/wamp/bin/apache/apache2.4.9/conf/server.key”

SSLSessionCache这行改成SSLSessionCache “shmcb:c:/wamp/bin/apache/apache2.4.9/logs/ssl_scache(512000)”

找到这块内容 
修改DocumentRoot 为DocumentRoot “C:/wamp/www/” 
ServerName 花生壳域名:80 
ErrorLog “c:/wamp/bin/apache/apache2.4.9/logs/error.log” 
TransferLog “c:/wamp/bin/apache/apache2.4.9/logs/access.log”

SSLEngine on

SSLCertificateFile “C:/wamp/bin/apache/apache2.4.9/conf/server.crt”

SSLCertificateKeyFile “C:/wamp/bin/apache/apache2.4.9/conf/server.key”

七、重启wampserver。浏览器输入：https://192.168.1.4/index.php 
确保你www目录下有index.php文件

成功后显示 
这里写图片描述

搭建过程中遇到的问题，看一个程序员的水平主要是看他解决问题的能力，哈哈，小吹一下 
我也是第一次搭建https服务器，结果按照网上配置以后，apache怎么都启动不起来，查看错误日志呗

cmd命令行切换到C:\wamp\bin\apache\apache2.4.9\bin目录 
输入httpd -t命令 错误如下： 
1.Syntax error on line 92 of C:/Apache24/conf/extra/httpd-ssl.conf: 
SSLSessionCache: ‘shmcb’ session cache not supported (known names: ). Maybe you need to load the appropriate socache module (mod_socache_shmcb?

解决方法：在httpd.conf中找到下面这句话# 
LoadModule socache_shmcb_module modules/mod_socache_shmcb.so 
取消注释（删掉前面的”#”）

补充一个错误  打开conf/extra/httpd-ssl.conf

拉到最下面 搜索CustomLog

修改参数 为"c:/wamp/bin/apache/apache2.4.9/logs/ssl_request.log" \