小程序,英文名Mini Program,是一種不需要下載安裝即可使用的應用,它實現了應用「觸手可及」的夢想,用戶掃一掃或搜一下即可打開應用。也體現了「用完即走」的理念,用戶不用關心是否安裝太多應用的問題。應用將無處不在,隨時可用,但又無需安裝卸載。對於開發者而言,小程序開發門檻相對較低,難度不及APP,能夠滿足簡單的基礎應用,適合生活服務類線下商鋪以及非剛需低頻應用的轉換,也比較適合初創公司創業階段用來「試錯」的產品,在開發成本、用戶體驗、運營方式、迭代更新方面小程序都很有優勢。
小程序現在非常火爆,有微信小程序、百度小程序、支付寶小程序、今日頭條小程序等,小程序已經擁有1.7億日活用戶,上線58萬個小程序,吸引了超過100萬個開發者,2300個第三方開發平臺加入,有hishop小程序、有贊小程序、曉商+小程序、微盟小程序、微塵小程序、青芒小程序、勝贊小程序、點點客小程序、品玩小程序、有店小程序......近兩年,小程序電商快速崛起,小程序電商之所以被看好,根本原因在於微信的社交優勢。微信擁有超過10億人次的日活躍用戶,對於網際網路商業來說,這是一個巨大的增量。相比PC和APP時代,小程序大幅降低了做生意的門檻,諸多數據也一再印證了小程序在電商領域的巨大潛力。
用戶在小程序上購買商品後,售後不能得到保障,這裡包括,訂單管理、物流跟蹤、退換貨等等。小程序開發者的「發貨」是一個難題,要麼需要逐一連接多家快遞公司進行發貨,每對接一個快遞公司就要開發十餘個接口,開發工作量繁瑣複雜。要麼選擇用類似快遞鳥這樣第三方的物流接口對接,快遞鳥快遞物流查詢API接口,支持418家快遞物流公司接口,高實時、高穩定、高並發,也可以對接自動識別快遞公司接口,支持申通、順豐、圓通、宅急送、韻達、中通、百世、天天、四通一達、京東、EMS等國內/國際主流快遞查詢,比較全面、支持的快遞公司多、接口穩定性、及時性都有保障,電子面單和物流軌跡查詢接口都是免費的,小程序對接了物流接口,就可以通過物流助手推送物流軌跡狀態信息了,用戶也可以在小程序查詢快遞到哪了。快遞鳥可以免費幫助有物流需求的開發者,快速高效對接多家物流公司,並通過微信服務通知接收實時物流狀態,進行物流的全流程跟蹤,讓商家更省事兒。
申請快遞鳥接口後,小程序開發者無需對接不同快遞公司的接口,只需調通快遞鳥物流接口,即可連接多家快遞公司進行發貨查單跟蹤。同時,小程序開發者和用戶都可以通過快遞鳥API物流接口獲取訂單的實時物流狀態,便於用戶查看和開發者跟蹤顧客服務,用戶點擊物流信息後可回訪小程序查看該訂單,大大提升用戶回訪率。
快遞鳥API接入流程也非常簡單:小程序開發者只需在快遞鳥網站註冊申請接口Key和ID,根據技術文檔和DEMO對接後就可以使用了。目前,已有N多家小程序用戶接入快遞鳥接口,最快半天即可輕鬆接入,下面我就分享下小程序如何對接快遞鳥物流接口:
1. 免費獲得快遞鳥用戶ID和APIKey,免費訂購會員套餐,用戶ID和APIKey對應各demo中的EBusinessID、AppKey。
2. 構建物流查詢界面
1)創建頁面
在小程序中,創建新頁面,用來做物流查詢。
app.json文件,為了方便,直接放在第一頁即可:
2)構建頁面結構
在express.wxml文件中構建物流查詢的界面格式:
編譯預覽:
3. 物流單號暫存到交互層
在界面層中輸入快遞物流單號,需要將物流單號暫存到交互層(express.js)中。
界面層(wxml)中操作的數據,如果向交互層(js)有反應,都是通過事件來驅動的。 因此為文本框添加事件,將物流單號暫存到交互層。
①為文本框添加事件(express.wxml)
②在交互層中設置數據
③ 編譯預覽
注意:
1. 在交互層定義的數據,可以在控制臺的AppData下看到。
4. 發起請求
在界面層點擊「查詢」按鈕後,需要調用接口,根據物流訂單號查詢物流。
①為按鈕添加事件(express.wxml)
②在交互層定義事件(express.js)
5. 物流接口
①接口的信息
調用接口也就是調用物流接口,接口的地址、請求類型、返回類型等信息。a、查詢接口支持按照運單號查詢(單個查詢)。b、接口需要指定快遞單號的快遞公司編碼,格式不對或則編碼錯誤都會返失敗的信息。如:EMS物流單號應選擇快遞公司編碼(EMS)查看快遞公司編碼c、返回的物流跟蹤信息按照發生的時間升序排列。d、接口指令8001或1002或1008或8008,具體到快遞鳥網站了解api文檔,不同指令對應不同類型接口。e、接口支持的消息接收方式為HTTP POST,請求方法的編碼格式(utf-8):"application/x-www-form-urlencoded;charset=utf-8"。f、接口地址:API測試地址:http://sandboxapi.kdniao.com:8080/kdniaosandbox/gateway/exterfaceInvoke.jsonAPI正式地址:http://api.kdniao.com/Ebusiness/EbusinessOrderHandle.aspx
接口需要傳的參數:
請求內容欄位定義:
返回參數定義:
②接口的用法及DEMO
申請的接口給出了使用接口的示例,但是沒有小程序的,我們看一下PHP的,具體完整的demo在快遞鳥網站可以下載查看。
EBusinessID跟APIKey您在快遞鳥網站註冊之後快遞鳥分配的密鑰(對應官網上的用戶ID和API key),用於保證應用來源的可靠性,避免應用偽造,被不法使用。
6. 小程序API
在小程序交互層進行調用接口時,需要使用小程序的API。
小程序常用的API就是wx.request(object)(發起網絡請求),類似於ajax。
Object參數說明:
1)在小程序交互層中調用接口(express.js)
2)編譯預覽
3)合法域名校驗出錯
①在點擊「查詢」按鈕時,會出現「合法域名校驗出錯」問題。
小程序的程序是放在微信的伺服器的,所有不是所有外部接口都允許請求,需要在小程序後臺配置安全伺服器。
配置安全伺服器位置:設置=》開發設置=》伺服器域名
點擊「開始配置」進行配置安全伺服器:
配置安全伺服器時,伺服器需要支持https服務,都是https服務的域名。
②開發時,可以設置不校驗伺服器
將「不校驗安全域名、web-view域名、TLS版本以及HTTPS證書」選上。
4)查詢結果
輸入訂單號後,點擊「查詢」按鈕。
屬性data的完整信息:
5)設置物流信息
查詢返回的數據,需要的就是res.data.result.list下的物流信息數據,要將數據展示到界面層,那麼就要將數據賦值給交互層的頁面初始化數據data下的參數。
①為data添加物流信息參數
②將返回的數據設置到dataList中
但要注意,由於function層數過多,此時this已經不再指代Page函數了。
在query事件中,將this保存到一個新參數中,再使用。
編譯預覽:
6)界面層展示物流信息
①獲取物流信息後,在界面層展示物流信息。(express.wxml)
注意:1. wx:key的值要唯一,沒有主鍵的時候,可以使用索引index。
②編譯預覽
7. 全局js
在查詢物流信息時,會有下拉頁面刷新的情況,因此當頁面下拉刷新時,需要重新獲取物流信息。
下拉刷新時重新獲取數據:
在onPullDownRefresh中重新獲取數據,只需將query事件中的程序複製粘貼到用戶下拉動作事件中即可。
但是此時同樣的程序寫了兩遍,這種重複性代碼需要進行封裝。
1)封裝
在小程序中utils/util.js文件為公共js文件。將獲取物流信息的程序封裝起來。
注意:1. 封裝時,需要傳參。$this代表交互層的this。
2)模塊導出
在util.js文件中定義好函數後,需要將函數導出才能使用。在util.js文件中已經寫好了模塊導出的方式。
只需要將定義好的函數,按照格式導出即可。
3)引入公共js文件
如果想在頁面的js文件中使用util.js文件中的函數,需要在頁面的js中間中使用require方法引入util.js文件。
4)調用
在頁面js文件中引入util.js文件後,可以調用其文件中的函數。
express.js文件中的query事件:
在下拉刷新事件onPullDownRefresh中調用函數。
編譯預覽:
注意:1. 在公共js文件中封裝函數並使用的流程:①在util.js中封裝函數②導出封裝的函數③使用的頁面js文件中引入util.js文件④調用
如果小程序對接快遞鳥物流快遞單號查詢接口遇到疑問,可以在快遞鳥網站加技術qq群溝通。