支付寶小程序 快速示例·線下買單

本示例僅支持企業(yè)支付寶賬號。

線下買單功能可將小程序與線下服務(wù)場景連接起來，給線下服務(wù)行業(yè)帶來極大便利。該功能可輕松實(shí)現(xiàn)查看商品列表、領(lǐng)取優(yōu)惠券、查看優(yōu)惠券、結(jié)算、付款、查看訂單列表、申請退款等人們廣為熟悉的消費(fèi)場景。

掃碼體驗(yàn)

效果示例

功能接口

前提條件

• 完成 開發(fā)者入駐 與 小程序創(chuàng)建。
• 安裝最新版 IDE，點(diǎn)擊下載。

獲取模板代碼

下載 線下買單 Demo.zip 文件，并解壓至本地。

使用步驟

添加功能

1. 登錄 小程序開發(fā)中心，在 我的小程序 中，選擇相應(yīng)的小程序，進(jìn)入該小程序詳情頁。

1. 在小程序詳情開發(fā)管理頁面的 功能列表 中，點(diǎn)擊右上角 添加功能 按鈕，添加 小程序支付功能、支付寶卡包功能。小程序支付功能需簽約后生效，請點(diǎn)擊功能列表最右側(cè)操作欄 簽約，完成產(chǎn)品簽約流程后，狀態(tài)顯示為 審核中，預(yù)計在一個工作日內(nèi)完成簽約審核；審核通過狀態(tài)顯示為 已生效，即可調(diào)用小程序支付。

數(shù)據(jù)準(zhǔn)備

在 sample 數(shù)據(jù)庫中，新建表 user_pay。

USE sample; 
CREATE TABLE `user_pay` (
 `id` int(11) NOT NULL AUTO_INCREMENT,
 `trade_no` varchar(200) DEFAULT NULL,
 `user_id` varchar(200) DEFAULT NULL,
 PRIMARY KEY (`id`)) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8;

在 sample 數(shù)據(jù)庫中，新建表 user_card。

USE sample; 
CREATE TABLE `user_card` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `user_id` varchar(200) DEFAULT NULL,
  `card_id` varchar(200) DEFAULT NULL,
  `card_status` varchar(200) DEFAULT NULL,
  `serial_number` varchar(200) DEFAULT NULL,
 PRIMARY KEY (`id`)) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8;

在 sample 數(shù)據(jù)庫中，新建表 user_order。

USE sample; 
CREATE TABLE `user_order` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `out_trade_no` varchar(200) DEFAULT NULL,
  `user_id` varchar(200) DEFAULT NULL,
  `card_id` varchar(200) DEFAULT NULL,
  `goods_detail` text,
 PRIMARY KEY (`id`)) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8;

在 sample 數(shù)據(jù)庫中，新建表 goods_info。

USE sample; 
CREATE TABLE `goods_info` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `goods_name` varchar(200) DEFAULT NULL,
  `goods_type` varchar(200) DEFAULT NULL,
  `goods_price` varchar(200) DEFAULT NULL,
  `goods_describe` varchar(200) DEFAULT NULL,
  `goods_num` varchar(200) DEFAULT NULL,
  `sell_num` varchar(200) DEFAULT NULL,
  `like_num` varchar(200) DEFAULT NULL,
 PRIMARY KEY (`id`)) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8;

后端開發(fā)

打開 server > src > main > resources > application.properties 文件，填入服務(wù)運(yùn)行所需的參數(shù)。

#應(yīng)用的私鑰，需要保管好，應(yīng)用的公鑰存儲在支付寶服務(wù)端
alipay.appconfig.privatekey=


#支付寶提供給這個應(yīng)用的公鑰，私鑰存儲在支付寶服務(wù)端中
alipay.appconfig.publickey=


#開放平臺申請應(yīng)用的Id
alipay.appconfig.appid=

spring.datasource.url=jdbc:mysql://${demo.mysql.address}:3306/sample?useUnicode=true&characterEncoding=utf8


#數(shù)據(jù)庫用戶名稱


spring.datasource.username=admin


#數(shù)據(jù)庫用戶密碼


spring.datasource.password=


#數(shù)據(jù)庫地址，由于數(shù)據(jù)庫跟應(yīng)用服務(wù)在同一個服務(wù)器，所以在服務(wù)器上運(yùn)行時可以設(shè)值為 localhost


demo.mysql.address=localhost

若小程序后端服務(wù)部署在云應(yīng)用上，參見 詳解 Todo 示例。

新建/打開項(xiàng)目

在 IDE 啟動界面新建 開放能力 > 線下買單 模板項(xiàng)目，或者打開獲取模板代碼中下載的 zip 文件內(nèi)容。

前端開發(fā)

將線下買單示例小程序 client > utils > api.js 文件中 API_HOST 修改為實(shí)際后端服務(wù)域名之后，即可開發(fā)小程序前端界面。