支付寶：web頁面掃碼支付、網站支付、支付寶即時到賬 + springmvc

阿新 • • 發佈：2019-01-18

一、場景：公司需要在網站上進行支付寶支付。
二、API：使用支付寶開放平臺的支付能力-即時到賬介面。支付寶開放平臺連結
三、分析：

1、支付寶的文件比較容易看，主要是有相應的DEMO，我這裡看的DEMO是 JAVA-UTF-8版本。
這裡寫圖片描述
2、匯入DEMO，在com.alipay.config中填入對應的partner和key（在對應的商戶後臺獲取）就可以直接運行了解支付流程了。

3、改寫：我這邊使用的是springmvc+mybatis。商品發起購買（走支付寶支付）、跳轉到支付寶、支付寶回撥支付狀態。

四、實現：

1、商品發起購買請求（將DEMO中的頁面直接拿過來用了）。
[javascript] view plain copy
<body>  
    <div class="header" 
>  
        <div class="container black">  
            <div class="qrcode">  
                <div class="littlecode">  
                    <img width="16px" src="img/little_qrcode.jpg" id="licode">  
                    <div class="showqrs" id="showqrs">  
                        <div class="shtoparrow" 
></div>  
                        <div class="guanzhuqr">  
                            <img src="img/guanzhu_qrcode.png" width="80">  
                            <div class="shmsg" style="margin-top:5px;">  
                            請掃碼關注  
                            </div>  
                            <div class="shmsg" 
 style="margin-bottom:5px;">  
                                接收重要資訊  
                            </div>  
                        </div>  
                    </div>  
                </div>        
            </div>  
        </div>  
        <div class="container">  
            <div class="nav">  
                <a href="https://www.alipay.com/" class="logo"><img src="img/alipay_logo.png" height="30px"></a>  
                <span class="divier"></span>  
                <a href="http://open.alipay.com/platform/home.htm" class="open" target="_blank">開放平臺</a>  
                <ul class="navbar">  
                    <li><a href="https://doc.open.alipay.com/doc2/detail?treeId=62&articleId=103566&docType=1" target="_blank">線上文件</a></li>  
                    <li><a href="https://cschannel.alipay.com/portal.htm?sourceId=213" target="_blank">技術支援</a></li>  
                </ul>  
            </div>  
        </div>  
        <div class="container blue">  
            <div class="title">支付寶即時到賬(create_direct_pay_by_user)</div>  
        </div>  
    </div>  
    <div class="content">  
        <%-- <form action="${ctx}/aliPay/open" class="alipayform" method="POST" target="_blank"> --%>  
            <div class="element" style="margin-top:60px;">  
                <div class="legend">支付寶即時到賬交易介面快速通道 </div>  
            </div>  
            <div class="element">  
                <div class="etitle">商戶訂單號:</div>  
                <div class="einput"><input type="text" name="WIDout_trade_no" id="out_trade_no"></div>  
                <br>  
                <div class="mark">注意：商戶訂單號(out_trade_no).必填(建議是英文字母和數字,不能含有特殊字元)</div>  
            </div>  

            <div class="element">  
                <div class="etitle">商品名稱:</div>  
                <div class="einput"><input type="text" name="WIDsubject" id="WIDsubject" value="test商品123"></div>  
                <br>  
                <div class="mark">注意：產品名稱(subject)，必填(建議中文，英文，數字，不能含有特殊字元)</div>  
            </div>  
            <div class="element">  
                <div class="etitle">付款金額:</div>  
                <div class="einput"><input type="text" name="WIDtotal_fee" id="WIDtotal_fee" value="0.01"></div>  
                <br>  
                <div class="mark">注意：付款金額(total_fee)，必填(格式如：1.00,請精確到分)</div>  
            </div>  
            <div class="element">  
                <div class="etitle">商品描述:</div>  
                <div class="einput"><input type="text" name="WIDbody" id="WIDbody" value="即時到賬測試"></div>  
                <br>  
                <div class="mark">注意：商品描述(body)，選填(建議中文，英文，數字，不能含有特殊字元)</div>  
            </div>  
            <div class="element">  
                <input type="button" class="alisubmit" id="sbumitBtn" value ="確認支付">  
            </div>  
    </div>  
    <div id="returnAli"></div>  
    <div class="footer">  
        <p class="footer-sub">  
            <a href="http://ab.alipay.com/i/index.htm" target="_blank">關於支付寶</a><span>|</span>  
            <a href="https://e.alipay.com/index.htm" target="_blank">商家中心</a><span>|</span>  
            <a href="https://job.alibaba.com/zhaopin/index.htm" target="_blank">誠徵英才</a><span>|</span>  
            <a href="http://ab.alipay.com/i/lianxi.htm" target="_blank">聯絡我們</a><span>|</span>  
            <a href="#" id="international" target="_blank">International Business</a><span>|</span>  
            <a href="http://ab.alipay.com/i/jieshao.htm#en" target="_blank">About Alipay</a>  
            <br>  
             <span>支付寶版權所有</span>  
            <span class="footer-date">2004-2016</span>  
            <span><a href="http://fun.alipay.com/certificate/jyxkz.htm" target="_blank">ICP證：滬B2-20150087</a></span>  
        </p>  


    </div>  
</body>  

2、點選確認支付之後，這裡通過ajax請求後臺，將返回的一段html程式碼直接放到上面的<div id="returnALi"></div>中，這個表單會自動提交。
[javascript] view plain copy
$(function (){  
    $("#sbumitBtn").on('click', function(){  
        $.ajax({  
            type : "post",  
            data : {  
                WIDout_trade_no : $('#out_trade_no').val(),  
                WIDsubject : $('#WIDsubject').val(),  
                WIDtotal_fee : $('#WIDtotal_fee').val(),  
                WIDbody : $('#WIDbody').val()  
            },  
            url : "${ctx}/aliPay/open",  
            success : function(data) {  
                $('#returnAli').append(data.sHtmlText);  
            },  
            error : function(da){  
            }  
        });  
    })  

});  

3、後臺controller中，基本是將demo中的alipayapi.jsp直接拿來用了，不同的是，引數的傳遞是自己定義的，返回方式符合apringmvc要求，並且根據業務需求儲存了狀態為未支付的訂單資訊。
[javascript] view plain copy
@RequestMapping("open")  
public ResponseEntity<HttpEntity> open(Model model, String WIDout_trade_no, String WIDsubject, String WIDtotal_fee,  
        String WIDbody) {  

    //////////////////////////////////// 請求引數//////////////////////////////////////  

    // 商戶訂單號，商戶網站訂單系統中唯一訂單號，必填  
    String out_trade_no = WIDout_trade_no;  
    // 訂單名稱，必填  
    String subject = WIDsubject;  
    // 付款金額，必填  
    String total_fee = WIDtotal_fee;  
    // 商品描述，可空  
    String body = WIDbody;  

    // 把請求引數打包成陣列  
    Map<String, String> sParaTemp = new HashMap<String, String>();  
    sParaTemp.put("service", AlipayConfig.service);  
    sParaTemp.put("partner", AlipayConfig.partner);  
    sParaTemp.put("seller_id", AlipayConfig.seller_id);  
    sParaTemp.put("_input_charset", AlipayConfig.input_charset);  
    sParaTemp.put("payment_type", AlipayConfig.payment_type);  
    sParaTemp.put("notify_url", AlipayConfig.notify_url);  
    sParaTemp.put("return_url", AlipayConfig.return_url);  
    sParaTemp.put("anti_phishing_key", AlipayConfig.anti_phishing_key);  
    sParaTemp.put("exter_invoke_ip", AlipayConfig.exter_invoke_ip);  
    sParaTemp.put("out_trade_no", out_trade_no);  
    sParaTemp.put("subject", subject);  
    sParaTemp.put("total_fee", total_fee);  
    sParaTemp.put("body", body);  
    // 其他業務引數根據線上開發文件，新增引數.文件地址:https://doc.open.alipay.com/doc2/detail.htm?spm=a219a.7629140.0.0.O9yorI&treeId=62&articleId=103740&docType=1  
    // 如sParaTemp.put("引數名","引數值");  

    // 建立請求  
    String sHtmlText = AlipaySubmit.buildRequest(sParaTemp, "get", "確認");  
    model.addAttribute("sHtmlText", sHtmlText);  

    // 儲存支付記錄  
    hysWebMeetingAliService.insertSelective(sParaTemp);  
    return new ResponseEntity(model, HttpStatus.OK);  
}  

4、回撥：也是直接將DEMO中的notify_url.jsp中的java程式碼拿來稍微做了修改和加上業務程式碼（修改狀態等）；

[javascript] view plain copy
@RequestMapping("notify")  
@ResponseBody  
public String notify(HttpServletRequest request){  
    //獲取支付寶POST過來反饋資訊  
    Map<String,String> params = new HashMap<String,String>();  
    Map requestParams = request.getParameterMap();  
    for (Iterator iter = requestParams.keySet().iterator(); iter.hasNext();) {  
        String name = (String) iter.next();  
        String[] values = (String[]) requestParams.get(name);  
        String valueStr = "";  
        for (int i = 0; i < values.length; i++) {  
            valueStr = (i == values.length - 1) ? valueStr + values[i]  
                    : valueStr + values[i] + ",";  
        }  
        //亂碼解決，這段程式碼在出現亂碼時使用。如果mysign和sign不相等也可以使用這段程式碼轉化  
        //valueStr = new String(valueStr.getBytes("ISO-8859-1"), "gbk");  
        params.put(name, valueStr);  
    }  

    //獲取支付寶的通知返回引數，可參考技術文件中頁面跳轉同步通知引數列表(以下僅供參考)//  
    //商戶訂單號  

    String out_trade_no = request.getParameter("out_trade_no");  

    //支付寶交易號  

    String trade_no = request.getParameter("trade_no");  

    //交易狀態  
    String trade_status = request.getParameter("trade_status");  

    //獲取支付寶的通知返回引數，可參考技術文件中頁面跳轉同步通知引數列表(以上僅供參考)//  

    if(AlipayNotify.verify(params)){//驗證成功  
        //////////////////////////////////////////////////////////////////////////////////////////  
        //請在這裡加上商戶的業務邏輯程式程式碼  

        //——請根據您的業務邏輯來編寫程式（以下程式碼僅作參考）——  
        boolean flg = false;  
        if(trade_status.equals("TRADE_FINISHED")){  
            //判斷該筆訂單是否在商戶網站中已經做過處理  
                //如果沒有做過處理，根據訂單號（out_trade_no）在商戶網站的訂單系統中查到該筆訂單的詳細，並執行商戶的業務程式  
                //請務必判斷請求時的total_fee、seller_id與通知時獲取的total_fee、seller_id為一致的  
                //如果有做過處理，不執行商戶的業務程式  

            //注意：  
            //退款日期超過可退款期限後（如三個月可退款），支付寶系統傳送該交易狀態通知  
        } else if (trade_status.equals("TRADE_SUCCESS")){  
            //判斷該筆訂單是否在商戶網站中已經做過處理  
                //如果沒有做過處理，根據訂單號（out_trade_no）在商戶網站的訂單系統中查到該筆訂單的詳細，並執行商戶的業務程式  
                //請務必判斷請求時的total_fee、seller_id與通知時獲取的total_fee、seller_id為一致的  
                //如果有做過處理，不執行商戶的業務程式  

            //注意：  
            //付款完成後，支付寶系統傳送該交易狀態通知  

            //根據訂單號將訂單狀態和支付寶記錄表中狀態都改為已支付  
            flg = hysWebMeetingAliService.changeOrderAndAliStatusSuccess(out_trade_no);  

        }  

        //——請根據您的業務邏輯來編寫程式（以上程式碼僅作參考）——  

        //out.print("success"); //請不要修改或刪除  
        if(flg){  
            return "success";  
        }else{  
            return "fail";  
        }  

        //////////////////////////////////////////////////////////////////////////////////////////  
    }else{//驗證失敗  
        //out.print("fail");  
        return "fail";  
    }  
}  

5、return_url:頁面跳轉同步通知頁面路徑,就是支付成功後，支付寶回跳的一個頁面。“需http://格式的完整路徑，不能加?id=123這類自定義引數，必須外網可以正常訪問”，支付寶明確規定了回跳的頁面後面不能自定義引數，那麼有的我們就是根據一些型別去判斷跳轉的就有點麻煩了。我這裡做了一個取巧的做法：先把return_url.jsp中的java程式碼也直接搬過來，略做修改（換成springmvc的方式），我的回跳地址就是IP/aliPay/returnUrl，然後再new ModelAndView("redirect:/meeting/info")進行重定向到我們想到的url中，（引數問題看下文總結第4點吧）。
[javascript] view plain copy
    @RequestMapping("returnUrl")  
    public ModelAndView returnUrl(HttpServletRequest request){  
        ModelAndView mv = new ModelAndView("redirect:/meeting/info");  

        //獲取支付寶GET過來反饋資訊  
        Map<String,String> params = new HashMap<String,String>();  
        Map requestParams = request.getParameterMap();  
        for (Iterator iter = requestParams.keySet().iterator(); iter.hasNext();) {  
            String name = (String) iter.next();  
            String[] values = (String[]) requestParams.get(name);  
            String valueStr = "";  
            for (int i = 0; i < values.length; i++) {  
                valueStr = (i == values.length - 1) ? valueStr + values[i]  
                        : valueStr + values[i] + ",";  
            }  
            //亂碼解決，這段程式碼在出現亂碼時使用。如果mysign和sign不相等也可以使用這段程式碼轉化  
            //valueStr = new String(valueStr.getBytes("ISO-8859-1"), "utf-8");  
            params.put(name, valueStr);  
        }  

        //獲取支付寶的通知返回引數，可參考技術文件中頁面跳轉同步通知引數列表(以下僅供參考)//  
        //商戶訂單號  

        String out_trade_no = request.getParameter("out_trade_no");  

        //支付寶交易號  

        String trade_no = request.getParameter("trade_no");  

        //交易狀態  
        String trade_status = request.getParameter("trade_status");  

        <span style="color:#ff0000;">String meetingId = request.getParameter("extra_common_param");  
        mv.addObject("meetingId", meetingId);</span>  

        //獲取支付寶的通知返回引數，可參考技術文件中頁面跳轉同步通知引數列表(以上僅供參考)//  

        //計算得出通知驗證結果  
        boolean verify_result = AlipayNotify.verify(params);  

        if(verify_result){//驗證成功  
            //////////////////////////////////////////////////////////////////////////////////////////  
            //請在這裡加上商戶的業務邏輯程式程式碼  

            //——請根據您的業務邏輯來編寫程式（以下程式碼僅作參考）——  
            if(trade_status.equals("TRADE_FINISHED") || trade_status.equals("TRADE_SUCCESS")){  
                //判斷該筆訂單是否在商戶網站中已經做過處理  
                    //如果沒有做過處理，根據訂單號（out_trade_no）在商戶網站的訂單系統中查到該筆訂單的詳細，並執行商戶的業務程式  
                    //如果有做過處理，不執行商戶的業務程式  
            }  

            //該頁面可做頁面美工編輯  
//          out.println("驗證成功<br />");  
            //——請根據您的業務邏輯來編寫程式（以上程式碼僅作參考）——  

            //////////////////////////////////////////////////////////////////////////////////////////  
        }else{  
            //該頁面可做頁面美工編輯  
//          out.println("驗證失敗");  
        }  

        return mv;  
    }  


五、總結：

1、支付寶整合比較簡答，稍微看下DEMO，跑一下了解了流程就比較容易了。
2、除錯的時候，特別是回撥，要把專案部署到能夠外網訪問的伺服器上。
3、我沒有遇到上面莫名其妙的問題，如果遇到了的話，可以聯絡我，或者看下Eclipse遠端debug這篇文章，進行問題的跟蹤。
4、做頁面跳轉同步通知頁面路徑時，需要傳遞引數怎麼辦，我一開始是自定義了一個引數，可是沒有取到，然後我看到DEMO中有一句註釋是這麼寫的：
[javascript] view plain copy
// 其他業務引數根據線上開發文件，新增引數.文件地址:https://doc.open.alipay.com/doc2/detail.htm?spm=a219a.7629140.0.0.O9yorI&treeId=62&articleId=103740&docType=1  
所以我開啟看了之後，選擇了公用回傳引數extra_common_param，我自己知道這個欄位對於我來說是什麼含義。不過也要注意，人家說明了：
[javascript] view plain copy
引數body（商品描述）、subject（商品名稱）、extra_common_param（公用回傳引數）不能包含特殊字元（如：#、%、&、+）、敏感詞彙，也不能使用外國文字（旺旺不支援的外文，如：韓文、泰語、藏文、蒙古文、阿拉伯語）；  

open方法中設值：
[javascript] view plain copy
sParaTemp.put("extra_common_param", meetingId);  

returnUrl方法中取值，並作為重定向引數：
[javascript] view plain copy
String meetingId = request.getParameter("extra_common_param");  
        mv.addObject("meetingId", meetingId);

支付寶：web頁面掃碼支付、網站支付、支付寶即時到賬 + springmvc

一、場景：公司需要在網站上進行支付寶支付。二、API：使用支付寶開放平臺的支付能力-即時到賬介面。支付寶開放平臺連結三、分析： 1、支付寶的文件比較容易看，主要是有相應的DEMO，我這裡看的DEMO是 JAVA-UTF-8版本。 2、匯入DEMO

微信支付：手機系統自帶的瀏覽器，調用微信支付如何實現（非掃碼）

所有價格驗證返回調用 -i 是否為空支付申請 data- Q:翻看了微信支付的api沒發現支持h5調支付接口的情況（微信js除外），然後卻發現美團的支付成功調用了，這是怎麽實現的？ A: 使用微信H5支付即可。H5支付通過URL調起微信APP，

微信：微信掃碼支付、呼叫統一下單介面、網站支付 + springmvc

準備：根據統一下單介面API我先定義了三個物件：UnifiedOrderRequest（統一下單請求引數(必填)）、UnifiedOrderRequestExt（統一下單請求引數(非必填)）、UnifiedOrderRespose（統一下單返回引數）；具體如下程式碼，get、set方法可自行生產，太佔篇幅。

php實現支付寶當面付（掃碼支付）功能

環境依賴 PHP5.0以上，且需要開啟CURL服務、SSL服務。注意事項 1.檔案開頭的配置資訊必須完善 2.商戶私鑰需填寫對應簽名演算法型別的私鑰，如何生成金鑰參考： 2.1 生成RSA金鑰 2.2 建立應用 <?php header('Cont

支付寶線下門店掃碼支付開發

支付寶掃碼支付一.開發前準備 https://doc.open.alipay.com/doc2/detail.htm?spm=0.0.0.0.B6xA20&treeId=26&articleId=103239&docType=1 1.開通支

ASP.NET Core 2.0 支付寶當面付之掃碼支付

前言自從微軟更換了CEO以後，微軟的戰略方向有了相當大的變化，不再是那麼封閉，開源了許多東西，擁抱開源社群，.NET實現跨平臺，收購xamarin並免費提供給開發者等等。我本人是很喜歡.net的，並希望.net core能夠崛起。我是從.net core 1.1的時候開始

django2.0呼叫微信支付介面實現PC端掃碼支付

準備工作：程式碼實現：目錄結構 class WeChartPay(object): def __init__( self, appid, mch_id,

php微信支付（僅pc端掃碼支付模式二）詳細步驟

https://segmentfault.com/a/1190000008606526 一. 首先你們公司開通微信支付功能後，會收到一份郵件，裡面有賬戶相關資訊，一般有：微信支付商戶號，商戶平臺登入帳號，商戶平臺登入密碼，申請對應的公眾號，公眾號APPID。 1.下

專案總結1：微信掃碼自動識別裝置型別並跳轉到相應的應用下載頁面（apk或App Store）之解決方案

問題分析：普通頁面一般無法呼叫微信的掃一掃介面，從而否定通過微信掃一掃功能給我們判斷當前掃碼的裝置型別。解決方案：通過應用下載頁面自身來獲取當前訪問的客戶端裝置型別（iPhone、Android、iPad），然後分別跳轉到不同的下載連結。新建一個靜態頁面，如：down

android開發：web頁面喚起其他應用app

如何在webview載入的網頁，喚醒其他應用app？具體步驟：第一步：開啟AndroidMenifest.xml檔案，新增下面程式碼 <activity android:name=".MainActivity"> <intent-f

第三方登入：微信掃碼登入（OAuth2.0）

1、OAuth2.0 　　OAuth（開放授權）是一個開放標準，允許使用者讓第三方應用訪問該使用者在某一網站上儲存的私密的資源（如照片，視訊，聯絡人列表），而無需將使用者名稱和密碼提供給第三方應用。　　允許使用者提供一個令牌，而不是使用者名稱和密碼來訪問他們存放

轉：web頁面超時打出log

var lastTime = new Date().getTime(); var currentTime = new Date().getTime(); var timeOut = 1 * 60 * 1000; //設定超時時間： 10分 window.onload = function () { win

掃碼領紅包系統開發、瓶蓋掃一掃紅包開發

掃碼領紅包系統開發、掃碼領紅包軟體開發，掃碼領紅包平臺開發，掃碼領紅包瓶蓋掃一掃系統開發，掃碼領紅包小程式開發，掃碼領紅包公眾號系統開發。瓶蓋掃一掃系統開發 version: '3' services: filebeat: image: prima/filebeat:6

企業微信如何實現PC端掃碼登入第三方網站

1 登入企業微信 https://work.weixin.qq.com/ 建立應用 2 在應用裡需要配置工作臺應用主頁 (即掃碼後的跳轉地址) 和企業微信授權裡的授權回撥域 (必須跟跳轉地址是相同域名) 3 開始開發文件地址 <!DO

移動端web頁面知識小結之畫素密度、解析度、螢幕尺寸

一直以來，本人對移動端解析度、畫素等概念傻傻分不清，特查閱多位牛人部落格後總結如下要點，以便日後檢視。文件來源螢幕解析度是指螢幕上垂直方向和水平方向上的畫素個數，單位是px。常見取值 480X800,320X480等 IPhone手

Android 基於Zxing掃碼實現（三）、從相簿選取二維碼

前言本文的程式碼基於YZxing庫，如需查閱程式碼可前往GitHub上面檢視。專案地址如下： YZxing 內容從相簿獲取二維碼，主要涉及到幾大步驟。第一，進入相簿獲取照片。第二，對照片進行壓縮。第三，對照片上的二維碼進行de

pc端微信掃碼支付和支付寶在線支付（還未驗證先留著）

無需 host var efi 成功 raw func pwd 更改本DEMO演示了PHP支付寶和微信掃碼在線支付，支付成功後，在回調地址顯示支付相關信息。操作步驟： 1.修改配置文件 Application/common/conf/config.php $arr =

微信支付代理加盟支付寶掃碼支付申請條件

微信支付代理微信支付加盟支付寶支付掃碼申請我們先了解一下移動支付收單服務優勢吧？加入采寶移動支付收單的優勢：一、收單方式更為的快速，便捷，顧客只要在準備付錢時打開支付寶錢包或微信錢包給收銀員用掃描槍掃一下就完成交易了，不用找零，不用簽字，資金實時到賬，更杜絕了假幣風險。二、政

支付寶掃碼答奧數 5分鐘做出來可免單

html 免費 .cn mage ann ans bsp 可能 data-data 6月22日消息，支付寶是個很會玩的應用，支付寶掃碼支付已經成為大家的日常，但掃二維碼出現小學奧數題，答對吃飯免單還是頭一次。這樣的新玩法你見過嗎？會玩！支付寶掃碼答奧數 5分鐘做出來可免

微信支付寶二維碼支付代理加盟采寶二維碼掃碼POS

微信支付代理支付寶代理商智能POS代理現如今微信支付寶二維碼支付代理以及進入了支付潮流。如：銀幣、再到紙幣，演變到“錢”變得越來越輕薄。在現這個二維碼掃碼POS市場中，互聯網技術的支撐下，刷手機乘公交、刷支付寶買菜購物、繳水電費……日常生活中使用“現金”的場景，逐漸被手機各種支付方式取代，“無現金

支付寶：web頁面掃碼支付、網站支付、支付寶即時到賬 + springmvc

相關推薦