2019-01-16 23:05:33 weixin_44019016 阅读数 43
  • 微信h5支付开发-php开发微信h5支付demo

    会员免费看,http://edu.csdn.net/lecturer/842右侧可办理会员卡。微信h5支付开发是子恒老师《子恒说微信开发》视频教程的第17部。详细讲解了微信H5支付开发,内容包含开通H5支付,实现微信h5支付,订单查询,关闭订单等等。欢迎反馈,微信号:QQ68183131

    8026 人正在学习 去看看 秦子恒

做了一些时间微信开发。我单独完成了以下功能:

1)微信支付的功能实现
2)收货地址的功能实现
3) 与及完成的一个产品到支付的前后端功能。
虽然这些都有示例代码,但在做到实际项目中,要把这些功能融合进来,还是费了不少功夫。

比如,需要把微信支付的功能,融合到自己开发的产品中。
其中除了一些参数设置,也需要理解好他们的逻辑,才好融合进来。

那么对于微信开发这个比较封闭的环境,该怎么去调试呢?

首先,先说清楚微信的要求。

他要求微信支付也好,共享收货地址功能也好,都只能运行在微信浏览器内。
因此这是第一道约束:只能微信在微信浏览器。

第二道约束就是:微信开发要求运行的环境,必要是域名,且备案的域名(后来发现不用备案也可以)

现在再重申一下:
1)要求运行在微信浏览器内
2)要求运行的网址,是域名(配置在网页授权等设置的地方)

在这样要求的环境下。
一开始,我在调试微信支付时,真的好痛苦,a.我是在本地改好,b.发布,c.再FTP到服务器上,d.然后再通过手机微信去访问这个域名。

最最初级时,我使用response.write,response.end这样的方法去调试。但对于象微信支付这个功能。
他先访问示例的productpage.aspx页面,然后通过设置的参数跳转至微信的接口路径,后面又跳转回来,最终获得OPENID,象这种response.write很容易因跳转,而看不见内容。

后来,就用稍为好一点的方法,通过记录整个代码流程,写日志方式:
代码如下:
在这里插入图片描述

这样,就可以记录任何一步流程中,变量等的输出,可以看到所有的变化。
但是,对于上面说的a,b,c,d四点,还是很麻烦,没有省下哪一个步骤。

于是,我开始想在本地搭一个。那首先解决第一个问题,域名问题。

怎样在本地弄一个域名,在任何地方都可以访问。于是我想到花生壳。直接去花生壳网站,注册一个帐号,申请一个域名,然后直接选内网穿透。弄了半天没成功,申请了个工单,结果是,重新一下花生壳就生效了。

这样,我就可以直接通过花生壳的域名访问我本地机器了。把我的本地机器当成服务器用。那么a,b,c,d四步中,我就可以去掉两步(打包,上传)这两步。大大节省了一些时间。

由于调试的必要环境,还有一个:在微信内访问。
因此,有两种方式:
1)普通的:直接通过手机微信打开链接
2)通过开发者工具(微信提供),去调试,(但是还是没办法断点调试.net后台代码)
(开发者工具只是比较方便调试和查看前端代码)
明天再研究一些,有没有可能实现:1.在VS中,点运行,运行的域名,2.直接在微信浏览器中打开(或模拟出来)这个估计难。

但无论如何,还有一种方案就是:可以先调通好获取openID或token之后的功能,好了之后,把他们屏掉(这样就不依赖于微信了),这样,我们就可以把OPENID作为一个写死的值,然后去继续断点调试我们的功能流程,业务逻辑。

第二天,
终于通过把VS项目,里的调试,把w3wp.exe附加到进程,完成了,无论从手机微信,或微信开发者工具都 可以进行的断点调试,(包括前后端)

把图贴给大家:

在这里插入图片描述

2016-09-06 16:07:59 chen517611641 阅读数 4422
  • 微信h5支付开发-php开发微信h5支付demo

    会员免费看,http://edu.csdn.net/lecturer/842右侧可办理会员卡。微信h5支付开发是子恒老师《子恒说微信开发》视频教程的第17部。详细讲解了微信H5支付开发,内容包含开通H5支付,实现微信h5支付,订单查询,关闭订单等等。欢迎反馈,微信号:QQ68183131

    8026 人正在学习 去看看 秦子恒

##准备工作
1.ngrok,微信的接口有一些是被动的接收从微信服务器发送的消息的,所以需要提供一个域名给微信服务器,ngrok可以将本机的指定端口,映射到一个域名。花生壳什么的也可以。
2.微信web开发者工具,微信官方的调试工具
##测试账号配置
###测试账号信息
在测试账号管理界面,你可以获取到AppID和APPSecret。
###接口配置信息
这里写图片描述

验证URL有效性成功后即接入生效,成为开发者。如果公众号类型为服务号(订阅号只能使用普通消息接口),可以在公众平台网站中申请认证,认证成功的服务号将获得众多接口权限,以满足开发者需求。

此后用户每次向公众号发送消息、或者产生自定义菜单点击事件时,开发者填写的服务器配置URL将得到微信服务器推送过来的消息和事件,然后开发者可以依据自身业务逻辑进行响应,例如回复消息等。

下面的文档描述了这个接口的作用:
http://mp.weixin.qq.com/wiki/8/f9a0b8382e0b77d87b3bcc1ce6fbc104.html
###JS接口安全域名
这里写图片描述
配置在ngrok生成的域名,配置这个配置项的目的是让开发者可以在该域名下调用微信开放的JS接口。
JS-SDK相关的内容可以看这里:
http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
###测试账号二维码
这里写图片描述
用测试账号扫一下这个二维码,就能关注这个测试账号了,回复信息什么的就可以测试了。
###体验接口权限列表
这里写图片描述
测试账号默认大部分接口都是默认开启的,有几个需要手动开启。
这里需要注意的是网页授权获取用户基本信息这个。
这里写图片描述
如上所示,这里需要配置一个域名,网页授权成功回调的时候,必须是这个域名下的地址才行,不然就报scope参数错误或没有scope权限的错误。
至此,开发环境就搭建好了,可以按照微信公众平台开发文档里的微信网页开发部分写一个网页授权获取基本信息的demo了。

2017-07-20 10:48:12 yank1225 阅读数 179
  • 微信h5支付开发-php开发微信h5支付demo

    会员免费看,http://edu.csdn.net/lecturer/842右侧可办理会员卡。微信h5支付开发是子恒老师《子恒说微信开发》视频教程的第17部。详细讲解了微信H5支付开发,内容包含开通H5支付,实现微信h5支付,订单查询,关闭订单等等。欢迎反馈,微信号:QQ68183131

    8026 人正在学习 去看看 秦子恒

     最近做微信支付相关,会把遇到的问题等等总结一下.因为刚接触所以对我来说是问题的地方,大神们看着可能好笑,原谅我这个菜鸟吧.

    1.扫码支付

       最主要的是二维码的展示问题,bufferedimage没有实际生成图片,使用流的方式


    2.公众号支付

         很多代码就不写了...可以参照这个,已经写得比较清楚了.

         http://blog.csdn.net/aofavx/article/details/52220394

       

         微信开发 支付开发redirect_uri参数错误解决办法

         http://blog.csdn.net/wyx100/article/details/46755143



    3.微信中怎么在本地测试

        工具使用 -- fiddle

        使用方法--http://www.yyyweb.com/2782.html

        连不上服务器的问题解决---http://blog.csdn.net/lqfsharks/article/details/48845571

        本机host管理--SwitchHosts

        这样就可以在手机上打开微信连接本机了,调试方便.


本来想写个比较详细的来着,感觉很麻烦不写了,把之前用到的一些链接附上,有问题可以留言

---------

var el = document.createElement("a");
document.body.appendChild(el);
el.href = data.data; //url 是你得到的连接
el.click();
document.body.removeChild(el);



2015-10-01 11:06:08 qq_19687853 阅读数 3055
  • 微信h5支付开发-php开发微信h5支付demo

    会员免费看,http://edu.csdn.net/lecturer/842右侧可办理会员卡。微信h5支付开发是子恒老师《子恒说微信开发》视频教程的第17部。详细讲解了微信H5支付开发,内容包含开通H5支付,实现微信h5支付,订单查询,关闭订单等等。欢迎反馈,微信号:QQ68183131

    8026 人正在学习 去看看 秦子恒
说多了都是泪...
讲讲我的辛酸史吧!
人家开发好的项目,跑了.然后我就接收.
完全没有接触过微信支付,测试人员给了我一个提示"微信支付错误!";
开始大量找文档,找度娘,最后两Google 都用上了...
第一步:当然是找到微信官方文档https://pay.weixin.qq.com/wiki/doc/api/app.php?chapter=8_5
讲的很详细,参数也特别多.因为是人家做好的项目,还听说有运行成功过.很多东西都一略而过.(非常建议大家一定不能像我一样)
按照文档的方法到:
https://open.weixin.qq.com/cgi-bin/showdocument?action=dir_list&t=resource/res_list&verify=1&id=open1419319164&lang=zh_CN

下载

下载Dome,修改你的keystore
Eclipse --> Window -->Preferences-->Android-->Build--> Custom debug keystore 修改成你当前项目下的 debug.keystore 文件路径,

先运行,再下载签名生成器apk运行,将你注册的app的包名填写入APP生成签名,在https://open.weixin.qq.com 修改相应的字符串

先运行,再下载签名生成器apk运行,将你注册的app的包名填写入APP生成签名,在https://open.weixin.qq.com 修改相应的字符串

 ,Dome 下载地址 https://pay.weixin.qq.com/wiki/doc/api/app.php?chapter=11_1 跟你现在运行的Dome保持一致,按照Dome的提示修改PayActivity 的<data android:scheme="修改成你的AppId" />

有什么问题欢迎大家讨论


2018-06-29 14:40:50 u012274155 阅读数 940
  • 微信h5支付开发-php开发微信h5支付demo

    会员免费看,http://edu.csdn.net/lecturer/842右侧可办理会员卡。微信h5支付开发是子恒老师《子恒说微信开发》视频教程的第17部。详细讲解了微信H5支付开发,内容包含开通H5支付,实现微信h5支付,订单查询,关闭订单等等。欢迎反馈,微信号:QQ68183131

    8026 人正在学习 去看看 秦子恒

微信公众号支付开发-php

一、使用背景

1、在微信公众号内,打开H5商城网站,调用微信支付控件完成支付。

2、解决测试服跟正式服同用一个公众号进行公众号支付开发

注意:微信公众号支付与H5支付的区别在于:微信公众号支付是在微信浏览器中调用微信支付控件;H5支付是在非微信浏览器中调用微信支付控件。

二、准备工作

微信公众号支付需要在微信公众平台和商户平台完成以下配置,并获取相关开发配置数据。

1、公众平台上的APPID、APPsecret

2、商户平台下载证书、商户号、商户支付秘钥。

3、在商户平台进行业务配置:支付授权目录、设置JS安全接口域名。

1)支付授权目录:链接包括http或者https,以'/'结尾。

注意:该目录为发起支付下单的链接地址去除最后一个斜杠后面内容的部分。举例如下:

http://www.baidu.com/hello/elke/ekeke/pay/pay_sn/12333   那么该目录则是:http://www.baidu.com/hello/elke/ekeke/pay/pay_sn/

该例子中,pay_sn是参数名称,12333是参数值,因此该目录只需要最后一个斜杠之前的部分。在开发过程中,该链接中可能存在很多参数,比如:http://www.baidu.com/hello/elke/ekeke/pay/pay_sn/12333/order_sn/2445/state/4 对于这样的链接,参数部分是在变化的,不可能写死在支付授权目录中。那么对于这样的链接,建议使用问哈传参,改为http://www.baidu.com/hello/elke/ekeke/pay?pay_sn=12333&order_sn=2445&state=4 那么对于这个链接,支付目录则为http://www.baidu.com/hello/elke/ekeke/

此时一定要注意官方文档上说链接中不包括#号后面的部分,实际上也不包括问哈后面的部分

2)设置JS接口安全域名

位置:微信支付——>公共号设置——>功能设置——>JS接口安全域名

说明:设置JS接口安全域名后,公众号开发者可在该域名下调用微信开放的JS接口。

三、开发步骤

注意:如果是在测试环境的公众号与正式环境的公众号不同,测试环境的公众号又没有开通微信公众号支付功能,则需要使用正式环境中的微信公众号和商户号进行公众号支付开发,那在测试环境中配置正式环境的微信支付相关配置(在官网下载sdk,修改lib/WxPay.config.php中的参数为正式环境中的参数)。

先在正式环境授权登录,再根据参数不同,从而确定登录后跳转到正式服还是测试服。跳转到测试服时,需要将授权登录后的openid传到测试服,测试服再进行授权登录一遍。在测试服保存该用户的openid(该openid要作为后续支付接口调用的openid参数)。

比如:http://www.xxx.com/mobile/userinfo/login?type=2&newurl=http://shop.xxx.com/mobile/wx/user

如果不存在newurl则直接授权登录跳转到正式服,如果存在则跳转到所传参数地址(再次在测试服进行授权登录),并保存正式服所传的openid

 /**
     * @param array  $param
     * @param string $access_token
     * @param string $openid
     * @desc:正式服上授权登录后,根据回调参数中newurl是否为空确定是否跳转
     */
    public function transDev($param,$openid){
    	if(isset($param['newurl']) && !empty($param['newurl'])){
    		$access_token = $this->getWxAccessToken();
    		$param['access_token'] = $access_token;
    		$param['openid']	   = $openid;
    		$wxtest = new Wxtest();
    		$wxtest->setLog($param,'transDev param:');
    		$url = $param['newurl'];
	    	unset($param['newurl']);
	    	$httpParam = http_build_query($param);
	    	$url .= '?'.$httpParam;
	    	$this->redirect($url);
    	}
    	return;
    }

1、假设调用支付控件的页面是pay.html,则需要在该页面进行wx.config参数验证。获取调用微信支付控件的wx.config参数,此参数是在后台获取,然后传参形式传到页面上,进行js域名检测。wx.config参数如下:

wx.config({
            debug: false, // 开启调试模式,成功失败都会有alert框
            appId: "{$data.appId}", // 必填,公众号的唯一标识
            timestamp: "{$data.timeStamp}", // 必填,生成签名的时间戳
            nonceStr: "{$data.nonceStr}", // 必填,生成签名的随机串
            signature: "{$data.signature}",// 必填,签名
            jsApiList: ['chooseWXPay'] // 必填,需要使用的JS接口列表
        });

$data需先获取公众号支付的配置参数,该配置参数是需要在调用微信支付控件的js检测的。其中最主要的是获取参数获取如下:

/**
     *
     * @desc:获取公众号支付的配置文件
     */
    public function getWxConfig(){
       $wxpay = new Wxpay();
       $accessToken = $this->getAccessToken();
       //获取jsapi_ticket
       $ticket = $this->getJsapiTicket();
       $url = "http://";.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];
       $config = $wxpay->getWxPayJsConfig($accessToken,$ticket,$url);//进行数据前面验证并获取signature
       return $config;
    }
/**
     * @return mixed
     * @desc:获取js所使用的jsapi_ticket
     */
    function getJsapiTicket()
    {
       $jsapiTicket = cache('JSAPI_TICKET');
       if (empty($jsapiTicket)) {
           $accessToken = $this->getAccessToken();
           $ticketUrl = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token={$accessToken}&type=jsapi";
           //http_reqest是我自己封装的curl请求的函数
           $curl = new Curl();
           $ticketResult = $curl->get($ticketUrl);
           $this->setLog($ticketResult,'ticket:');
           $ticketArr = json_decode($ticketResult, true);
            if($ticketArr['errcode'] != 0){
               throw new Exception($ticketArr['errmsg']);
           }
           $jsapiTicket = $ticketArr['ticket'];
           cache('JSAPI_TICKET', $jsapiTicket, 7200);
       }
       return $jsapiTicket;
    }
/**
     * @return unknown[]|值[]
     * @desc:获取公众号支付配置
     */
    public function getWxPayJsConfig($accessToken,$jsapiTicket,$url){
       $appId = \WxPayConfig::APPID;
       $timeStamp = time();
       $nonceStr = \WxPayApi::getNonceStr();
       $params = [
               'jsapi_ticket' => $jsapiTicket,
               'noncestr' => $nonceStr,
               'timestamp' => $timeStamp,
               'url' => $url,
       ];
       
       $signature = $this->MakeSign($params);
       return ['appId'=>$appId,'timeStamp'=>$timeStamp,'nonceStr'=>$nonceStr,'signature'=>$signature,'url'=>$url,'ticket'=>$jsapiTicket];
    }

备注:该地址是jsapi_ticket的 校验工具https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign

2、在后台下单生成预付账单号prepay_id,然后根据prepay_id获取生成页面调用支付控件的chooseWXPay的参数,获取方法如下:

/**
     * @param unknown $prepay_id
     * @return string
     * @desc:jsapi支付调起支付控件的参数
     */
    public function getJsApiParam($prepay_id){
       $jsapi = new \WxPayJsApiPay();
        $jsapi->SetAppid(\WxPayConfig::APPID);
       $timeStamp = time();
       $jsapi->SetTimeStamp("$timeStamp");
        $jsapi->SetNonceStr(\WxPayApi::getNonceStr());
       $jsapi->SetPackage("prepay_id=" . $prepay_id);
       $jsapi->SetSignType("MD5");
        $jsapi->SetPaySign($jsapi->MakeSign());
       $parameters = $jsapi->GetValues();
       return $parameters;
    }

将getJsApiParam获取到的参数传递到pay.html页面,进行支付控件调用

wx.ready(function () {
            // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。            
 wx.chooseWXPay({
               timestamp: {$paramData.timeStamp}, // 支付签名时间戳,注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
               nonceStr: '{$paramData.nonceStr}', // 支付签名随机串,不长于 32 位
               package: '{$paramData.package}', // 统一支付接口返回的prepay_id参数值,提交格式如:prepay_id=\*\*\*)
               signType: '{$paramData.signType}', // 签名方式,默认为'SHA1',使用新版支付需传入'MD5'
               paySign: '{$paramData.paySign}', // 支付签名
               success: function (res) {
                   // 支付成功后的回调函数
                   console.log(res);
                   location.href = payOkUrl;
               },
               cancel:function(res){
                   location.href = "{:url('purchaseOrder/index',['order_state'=>10])}";
               },
               fail:function(res){
                   alert(JSON.stringify(res));
                  location.href = payFailUrl+'/msg/'+JSON.stringify(res);
               }
           });
        });
        wx.error(function (res) {
           alert('error');
            // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
        });

至此,微信支付控件即可调用支付了。

至此,微信公众号支付即完成支付控件调用

 

微信支付JSAPI支付

阅读数 1568

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