목차
서문
프로세스 구현
1. OAuth2.0 인증
를 얻는 것입니다. 2. 통합결제
3입니다.
4. 결제 알림
위챗 애플릿 위챗 개발 WeChat에서 개발한 JS API 결제 예시에 대한 자세한 설명

WeChat에서 개발한 JS API 결제 예시에 대한 자세한 설명

May 03, 2017 am 11:08 AM

키워드: WeChat 결제 WeChat 결제 v3 jsapi 결제 통합 결제 기본 결제 prepay_id

이 글에서는 WeChat 결제에서 jsapi 구현 프로세스를 소개합니다.

서문

WeChat 결제 방식은 v2 버전과 v3 버전으로 구분됩니다. 2014년 9월 10일 이전에 신청하신 분들은 v2 버전으로, 그 이후에 신청하신 분들은 v3 버전으로 진행됩니다. WeChat Pay V3 버전에는 paySignKey 매개변수가 없습니다. v2에 대한 관련 소개는 Fangbei Studio의 다른 기사를 참조하세요. 이 기사에서는 WeChat Pay v3를 소개합니다.

프로세스 구현

1. OAuth2.0 인증

JSAPI는 결제 전 사용자의 Openid를 얻기 위해 로그인 인증 인터페이스를 호출해야 합니다. 따라서 인증은 한 번만 수행해야 하며, 해당 인증에 대해서는 확인 상자가 나타나지 않습니다.
핵심은 사용자가

http://www.fangbei.org/wxpay/js_api_call.php
로그인 후 복사

에 접속하면

https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx8888888888888888&redirect_uri=http://www.fangbei.org/wxpay/js_api_call.php&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect
로그인 후 복사

로 점프하여 코드 매개변수를 얻고, 코드를 기반으로 인증된 access_token과 openid를 얻는 것입니다

자세한 구현 과정은 WeChat 공개 플랫폼 개발(71) OAuth2.0 웹 인증

을 참조하세요. WeChat Pay 데모에서 코드는

 1 //使用jsapi接口 2 $jsApi = new JsApi_pub(); 3  4 //=========步骤1:网页授权获取用户openid============ 5 //通过code获得openid 6 if (!isset($_GET['code'])) 7 { 8     //触发微信返回code码 9     $url = $jsApi->createOauthUrlForCode(WxPayConf_pub::JS_API_CALL_URL);10     Header("Location: $url"); 
11 }else12 {13     //获取code码,以获取openid14     $code = $_GET['code'];15     $jsApi->setCode($code);16     $openid = $jsApi->getOpenId();17 }
로그인 후 복사

입니다. 이 단계의 최종 결과입니다. 현재 사용자의 openid

ou9dHt0L8qFLI1foP-kj5x1mDWsM
로그인 후 복사

를 얻는 것입니다. 2. 통합결제

통합결제는 다양한 JSAPI/NATIVE/APP 결제 시나리오에서 결제 주문을 생성하고 선결제 주문 번호를 반환하는 인터페이스입니다. 현재 모든 WeChat 결제 시나리오는 모두 이 인터페이스를 사용합니다
통합 결제에서 다음 매개변수는 구성에서 얻거나 클래스에서 자동으로 생성되며 사용자가 입력할 필요가 없습니다

$this->parameters["appid"] = WxPayConf_pub::APPID;//公众账号ID$this->parameters["mch_id"] = WxPayConf_pub::MCHID;//商户号$this->parameters["spbill_create_ip"] = $_SERVER['REMOTE_ADDR'];//终端ip        $this->parameters["nonce_str"] = $this->createNoncestr();//随机字符串$this->parameters["sign"] = $this->getSign($this->parameters);//签名
로그인 후 복사

JSAPI 결제 시 다음 매개변수를 추가로 입력하세요

//统一支付接口中,trade_type为JSAPI时,openid为必填参数!$unifiedOrder->setParameter("openid","$openid");//商品描述$unifiedOrder->setParameter("body","方倍工作室");//商品描述
//自定义订单号,此处仅作举例$timeStamp = time();$out_trade_no = WxPayConf_pub::APPID."$timeStamp";$unifiedOrder->setParameter("out_trade_no","$out_trade_no");//商户订单号 $unifiedOrder->setParameter("total_fee","1");//总金额$unifiedOrder->setParameter("notify_url",WxPayConf_pub::NOTIFY_URL);//通知地址 $unifiedOrder->setParameter("trade_type","JSAPI");//交易类型
로그인 후 복사

기타는 선택 매개변수입니다

//非必填参数,商户可根据实际情况选填
//$unifiedOrder->setParameter("sub_mch_id","XXXX");//子商户号  
//$unifiedOrder->setParameter("device_info","XXXX");//设备号 
//$unifiedOrder->setParameter("attach","XXXX");//附加数据 
//$unifiedOrder->setParameter("time_start","XXXX");//交易起始时间
//$unifiedOrder->setParameter("time_expire","XXXX");//交易结束时间 
//$unifiedOrder->setParameter("goods_tag","XXXX");//商品标记 
//$unifiedOrder->setParameter("openid","XXXX");//用户标识
//$unifiedOrder->setParameter("product_id","XXXX");//商品ID
로그인 후 복사

이 매개변수는 최종적으로 이러한 xml 데이터를 형성하며,

<xml>
  <openid><![CDATA[ou9dHt0L8qFLI1foP-kj5x1mDWsM]]></openid>
  <body><![CDATA[方倍工作室]]></body>
  <out_trade_no><![CDATA[wx88888888888888881414411779]]></out_trade_no>
  <total_fee>1</total_fee>
  <notify_url><![CDATA[http://www.fangbei.org/wxpay/notify_url.php]]></notify_url>
  <trade_type><![CDATA[JSAPI]]></trade_type>
  <appid><![CDATA[wx8888888888888888]]></appid>
  <mch_id>10012345</mch_id>
  <spbill_create_ip><![CDATA[61.50.221.43]]></spbill_create_ip>
  <nonce_str><![CDATA[60uf9sh6nmppr9azveb2bn7arhy79izk]]></nonce_str>
  <sign><![CDATA[2D8A96553672D56BB2908CE4B0A23D0F]]></sign></xml>
로그인 후 복사

는 이 데이터를 통합 결제 인터페이스

https://api.mch.weixin.qq.com/pay/unifiedorder
로그인 후 복사

는 다음 데이터를 반환합니다.

<xml>
  <return_code><![CDATA[SUCCESS]]></return_code>  
  <return_msg><![CDATA[OK]]></return_msg>  
  <appid><![CDATA[wx8888888888888888]]></appid>  
  <mch_id><![CDATA[10012345]]></mch_id>  
  <nonce_str><![CDATA[Be8YX7gjCdtCT7cr]]></nonce_str>  
  <sign><![CDATA[885B6D84635AE6C020EF753A00C8EEDB]]></sign>  
  <result_code><![CDATA[SUCCESS]]></result_code>  
  <prepay_id><![CDATA[wx201410272009395522657a690389285100]]></prepay_id>  
  <trade_type><![CDATA[JSAPI]]></trade_type> </xml>
로그인 후 복사

여기에는 가장 중요한 선불 ID 매개변수인 prepay_id가 포함되어 있으며 값은

wx201410272009395522657a690389285100
로그인 후 복사

3입니다.

이전 준비가 완료되면 JS API는 prepay_id를 기준으로 jsapi 결제 매개변수를 생성합니다
생성된 코드는 다음과 같습니다

//=========步骤3:使用jsapi调起支付============$jsApi->setPrepayId($prepay_id);$jsApiParameters = $jsApi->getParameters();
로그인 후 복사

생성된 json 데이터는 다음과 같습니다

{
    "appId": "wx8888888888888888",
    "timeStamp": "1414411784",
    "nonceStr": "gbwr71b5no6q6ne18c8up1u7l7he2y75",
    "package": "prepay_id=wx201410272009395522657a690389285100",
    "signType": "MD5",
    "paySign": "9C6747193720F851EB876299D59F6C7D"
}
로그인 후 복사

WeChat 브라우저에서 js 인터페이스를 디버그합니다. 코드는 다음과 같습니다

<html><head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
    <title>微信安全支付</title>
    <script type="text/javascript">
        //调用微信JS api 支付
        function jsApiCall()
        {
            WeixinJSBridge.invoke(                &#39;getBrandWCPayRequest&#39;,                <?php echo $jsApiParameters; ?>,                function(res){
                    WeixinJSBridge.log(res.err_msg);                    //alert(res.err_code+res.err_desc+res.err_msg);                }
            );
        }        function callpay()
        {            if (typeof WeixinJSBridge == "undefined"){                if( document.addEventListener ){
                    document.addEventListener(&#39;WeixinJSBridgeReady&#39;, jsApiCall, false);
                }else if (document.attachEvent){
                    document.attachEvent(&#39;WeixinJSBridgeReady&#39;, jsApiCall); 
                    document.attachEvent(&#39;onWeixinJSBridgeReady&#39;, jsApiCall);
                }
            }else{
                jsApiCall();
            }
        }    </script></head><body>
    </br></br></br></br>
    <p align="center">
        <button style="width:210px; height:30px; background-color:#FE6714; border:0px #FE6714 solid; cursor: pointer;  color:white;  font-size:16px;" type="button" onclick="callpay()" >贡献一下</button>
    </p></body></html>
로그인 후 복사

사용자가 "기여" 버튼을 클릭하면 WeChat 결제 플러그인이 팝업되고 사용자가 결제를 시작할 수 있습니다.

4. 결제 알림

결제가 성공한 후 알림 인터페이스에도 결제 성공에 대한 XML 알림이 수신됩니다.

<xml>
  <appid><![CDATA[wx8888888888888888]]></appid>  
  <bank_type><![CDATA[CFT]]></bank_type>  
  <fee_type><![CDATA[CNY]]></fee_type>  
  <is_subscribe><![CDATA[Y]]></is_subscribe>  
  <mch_id><![CDATA[10012345]]></mch_id>  
  <nonce_str><![CDATA[60uf9sh6nmppr9azveb2bn7arhy79izk]]></nonce_str>  
  <openid><![CDATA[ou9dHt0L8qFLI1foP-kj5x1mDWsM]]></openid>  
  <out_trade_no><![CDATA[wx88888888888888881414411779]]></out_trade_no>  
  <result_code><![CDATA[SUCCESS]]></result_code>  
  <return_code><![CDATA[SUCCESS]]></return_code>  
  <sign><![CDATA[0C1D7F2534F1473247550A5A138F0CEB]]></sign>  
  <sub_mch_id><![CDATA[10012345]]></sub_mch_id>  
  <time_end><![CDATA[20141027200958]]></time_end>  
  <total_fee>1</total_fee>  
  <trade_type><![CDATA[JSAPI]]></trade_type>  
  <transaction_id><![CDATA[1002750185201410270005514026]]></transaction_id> </xml>
로그인 후 복사

notification_url이 수신되면 확인 성공 메시지가 표시됩니다. WeChat 서버로 반환됩니다

<xml>
  <return_code><![CDATA[SUCCESS]]></return_code></xml>
로그인 후 복사

위 내용은 WeChat에서 개발한 JS API 결제 예시에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

인기 기사

R.E.P.O. 에너지 결정과 그들이하는 일 (노란색 크리스탈)
1 몇 달 전 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 최고의 그래픽 설정
1 몇 달 전 By 尊渡假赌尊渡假赌尊渡假赌
Will R.E.P.O. 크로스 플레이가 있습니까?
1 몇 달 전 By 尊渡假赌尊渡假赌尊渡假赌

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

WeChat 결제 비밀번호를 잊어버린 경우 어떻게 찾을 수 있나요? WeChat 결제 비밀번호를 잊어버린 경우 어떻게 찾을 수 있나요? Feb 23, 2024 pm 09:40 PM

WeChat에서 사용자는 결제 비밀번호를 입력하여 구매할 수 있습니다. 하지만 결제 비밀번호를 잊어버린 경우 어떻게 검색할 수 있나요? 사용자는 결제 비밀번호를 잊어버린 경우 내 서비스 - 지갑 - 결제 설정으로 이동하여 결제 비밀번호를 복구해야 합니다. 결제 비밀번호를 잊어버린 경우, 비밀번호를 찾는 방법에 대한 구체적인 운영 방법은 다음과 같습니다. 자세히 살펴보세요. WeChat 사용 튜토리얼 WeChat 결제 비밀번호를 찾는 방법 답변: 내-서비스-지갑-결제 설정-결제 비밀번호 찾기: 1. 먼저 내를 클릭하세요. 2. 내부의 서비스를 클릭하세요. 3. 안에 있는 지갑을 클릭하세요. 4. 결제 설정을 찾으세요. 5. 결제 비밀번호 찾기를 클릭하세요. 6. 확인을 위해 본인의 정보를 입력하세요. 7. 그런 다음 새 결제 비밀번호를 입력하여 변경하세요.

Meituan 테이크아웃을 위한 WeChat 결제 설정 방법 WeChat 결제 설정 방법 Meituan 테이크아웃을 위한 WeChat 결제 설정 방법 WeChat 결제 설정 방법 Mar 12, 2024 pm 10:34 PM

메이투안 테이크아웃 앱에는 다양한 음식 및 스낵 상점이 제공되며, 모든 휴대폰 사용자는 자신의 계정을 통해 로그인합니다. 개인 배달 주소와 연락처를 추가해 가장 편리한 테이크아웃 서비스를 즐겨보세요. 소프트웨어 홈페이지를 열고, 제품 키워드를 입력하고, 온라인으로 검색하여 해당 제품 결과를 찾으세요. 플랫폼은 제공된 배송 주소를 기반으로 리뷰가 높은 인근 레스토랑 수십 곳을 추천해 드립니다. 매장에서는 다양한 결제 방법을 설정할 수도 있으며, 한 번의 클릭으로 주문을 완료할 수 있으며, 라이더가 즉시 배송을 준비할 수 있으며, 다양한 종류의 테이크아웃 빨간 봉투도 있습니다. 이제 Meituan 테이크아웃 사용자를 위해 편집기가 온라인에 자세히 설명되어 있습니다. 1. 상품 선택 후 주문하기 클릭

Xianyu는 WeChat으로 결제할 수 있나요? WeChat 결제 방법으로 변경하는 방법은 무엇인가요? Xianyu는 WeChat으로 결제할 수 있나요? WeChat 결제 방법으로 변경하는 방법은 무엇인가요? Mar 12, 2024 pm 12:19 PM

모두가 할 일이 없을 때 Xianyu 플랫폼을 탐색하면 누구나 이 플랫폼에 많은 제품이 있다는 것을 알 수 있으므로 모든 사람이 중고 제품을 볼 수 있습니다. 손으로 만든 제품은 품질에 전혀 문제가 없기 때문에 누구나 안심하고 구입할 수 있습니다. 가격도 매우 저렴하며, 여전히 모든 사람이 직접 이러한 제품을 접할 수 있습니다. 모든 사람이 적절하게 협상하면 거래를 선택할 수 있으며, 모두가 여기에서 결제할 때 WeChat 결제를 원하지만 플랫폼에서는 허용되지 않는 것 같습니다. 편집자는 구체적인 상황이 무엇인지 확인합니다. 시안위

WeChat Pay로 환불을 신청하는 단계 공유 WeChat Pay로 환불을 신청하는 단계 공유 Mar 25, 2024 pm 06:31 PM

1. 먼저 휴대폰에서 WeChat 앱을 연 다음 클릭하여 WeChat 계정에 로그인하여 WeChat 홈페이지에 들어갑니다. 2. 위챗 홈페이지 우측 하단의 [나] 버튼을 클릭한 뒤, [결제] 옵션을 선택해 결제 페이지로 들어갑니다. 3. [결제] 페이지 진입 후 [지갑] 옵션을 클릭하여 진입한 후, [지갑] 페이지 우측 상단의 [청구서]를 클릭하세요.

알리바바에서 위챗으로 결제하는 방법_알리바바 1688에서 위챗으로 결제하는 방법 알리바바에서 위챗으로 결제하는 방법_알리바바 1688에서 위챗으로 결제하는 방법 Mar 20, 2024 pm 05:51 PM

알리바바 1688은 구매 및 도매 사이트로, 이곳의 상품은 타오바오보다 훨씬 저렴합니다. 그렇다면 Alibaba는 WeChat 결제를 어떻게 사용합니까? 편집자는 여러분과 공유할 관련 콘텐츠를 편집했습니다. 도움이 필요한 친구들이 와서 살펴볼 수 있습니다. 답변: 당분간 WeChat 결제는 사용할 수 없습니다. 1. 상품 구매 페이지에서 [결제 방법 변경]을 클릭합니다. 2. 팝업 페이지에서 결제 수단 변경만 가능합니다. [Alipay, 단계적 결제, 캐셔]로 이동하여 선택할 수 있습니다.

권장 사항: 우수한 JS 오픈 소스 얼굴 감지 및 인식 프로젝트 권장 사항: 우수한 JS 오픈 소스 얼굴 감지 및 인식 프로젝트 Apr 03, 2024 am 11:55 AM

얼굴 검출 및 인식 기술은 이미 상대적으로 성숙하고 널리 사용되는 기술입니다. 현재 가장 널리 사용되는 인터넷 응용 언어는 JS입니다. 웹 프런트엔드에서 얼굴 감지 및 인식을 구현하는 것은 백엔드 얼굴 인식에 비해 장점과 단점이 있습니다. 장점에는 네트워크 상호 작용 및 실시간 인식이 줄어 사용자 대기 시간이 크게 단축되고 사용자 경험이 향상된다는 단점이 있습니다. 모델 크기에 따라 제한되고 정확도도 제한됩니다. js를 사용하여 웹에서 얼굴 인식을 구현하는 방법은 무엇입니까? 웹에서 얼굴 인식을 구현하려면 JavaScript, HTML, CSS, WebRTC 등 관련 프로그래밍 언어 및 기술에 익숙해야 합니다. 동시에 관련 컴퓨터 비전 및 인공지능 기술도 마스터해야 합니다. 웹 측면의 디자인으로 인해 주목할 가치가 있습니다.

Didi Chuxing에서 WeChat 결제를 설정하는 방법 WeChat 결제를 설정하는 방법 Didi Chuxing에서 WeChat 결제를 설정하는 방법 WeChat 결제를 설정하는 방법 Mar 13, 2024 pm 01:22 PM

Didi Chuxing 앱은 모든 사람의 일상 여행에 더 많은 편의를 제공합니다. 원하는 곳 어디든 갈 수 있으며, 모든 Didi 차량이 대기 중입니다. 소프트웨어 홈페이지를 열고 개인 여정에 따라 출발지와 목적지를 입력하고 바로 아래에서 다양한 가격대의 차량을 자유롭게 선택하세요. 한 번의 클릭으로 주문하면 Didi 운전자가 몇 초 만에 주문을 받습니다. 가능한 한 빨리 지정된 장소에 도착하세요. 버스에 탑승하기 전에 휴대폰 번호를 확인하시면 됩니다. 물론 요금을 지불하는 방법은 WeChat, Alipay 등 다양하지만 대부분은 WeChat을 사용합니다. 이제 한 번의 클릭으로 간편하게 결제를 설정할 수 있습니다. 이제 편집자가 온라인에 접속하여 여행 사용자들이 WeChat 결제 설정 방법을 하나씩 가져옵니다. 1. 우리는 휴대폰을 사용하고 있다

위챗페이를 활성화하는 방법은 무엇입니까? 위챗페이 활성화 설정 위챗페이를 활성화하는 방법은 무엇입니까? 위챗페이 활성화 설정 Mar 14, 2024 am 10:00 AM

WeChat은 Tencent가 출시한 인스턴트 메시징 애플리케이션으로, 교차 플랫폼 및 통신사 간 메시지 전송 및 수신을 지원하며, Moments에서 음성, 영상 채팅, 공유 등 다양한 기능을 갖추고 있습니다. WeChat Pay는 WeChat Wallet의 결제 기능으로 사용자에게 보다 편리한 결제 경험을 제공합니다. WeChat Pay를 활성화하는 방법을 알아 보겠습니다. 위챗페이를 활성화하는 방법은 무엇입니까? WeChat Pay 활성화 설정 1. 휴대폰에서 WeChat을 열고 오른쪽 하단의 [나]를 클릭하여 개인 홈페이지에 들어갑니다. 2. [서비스] 옵션을 클릭합니다. 3. [지갑] 아이콘을 클릭하세요. 4. [지갑] 항목에서 [분할결제]를 클릭하여 소개페이지로 진입합니다. 5. 결제소개 페이지 하단의 [나의 결제한도 보기] 버튼을 클릭하세요. 6. 분포를 주의 깊게 읽으십시오

See all articles