IDEA基於支付寶小程式搭建springboot專案

xiaokuli發表於2019-04-28

服務端

在平臺上建立springboot小程式應用

  • 建立小程式

    • 登入 螞蟻金服開放平臺,掃碼登入填寫資訊後,點選支付寶小程式,選擇立即接入 > 同意個人公測 > 開始建立 。
    • 填寫好小程式基本資訊後,點選建立按鈕,建立名為xxx小程式。
    • PS:一個賬號下最多可以建立10個小程式;未提交過稽核的小程式可以刪除,刪除的小程式不在計數範圍。
  • 建立雲應用後端服務

    • 在小程式頁面選擇剛建立的小程式,點選檢視,進入開發者頁面。
    • 在左側導航欄選擇雲服務(免費),點選建立雲服務,選擇建立雲應用,技術棧選SpringBoot,填寫好應用名,描述後即可完成建立雲應用。
  • 構建環境

    • 返回 雲服務(公測) 頁面,點選剛建立的雲服務卡片中的 構建環境 按鈕
    • 在 購買環境資源 頁面,選擇合適的環境配置方案,點選 同意《產品服務協議》 > 確認配置。

    說明: 此處選擇小程式雲應用入門(Mysql版),當前測試環境該方案免費提供,但若連續 7 日未部署過程式碼,環境會被自動回收。

    • 在 確認訂單 頁面,點選 確認購買。 購買成功後會自動進入 構建環境 頁面。構建過程會耗時幾分鐘,構建成功後,您可以選擇 檢視應用詳情 ,或者 返回應用列表。

在IDEA中安裝支付寶小程式開發工具

  • 點選 這裡 前往下載最新的外掛版本(com.alipay.devtools.idea-1.0.6.zip )進行下載。
  • 下載完成後,IDE 中 Preferences (Windows 下為 Settings) => Plugins => Install plugin from disk…,點選已下載的 Zip 包進行安裝,依照提示重啟 IDE 生效。
  • 中文亂碼解決方法: Appearance & Behavior => Appearance => UI Options -> Name 裡設定成中文字型,如 微軟雅黑(microsoft yahei light)、文泉驛(linux)

建立專案

  • file > new > project > Alipay DevTools,選擇springboot > next > finish;
  • 建立完後的效果:
    IDEA基於支付寶小程式搭建springboot專案
  • HelloController的程式碼:
    IDEA基於支付寶小程式搭建springboot專案

本地專案與平臺的雲應用對接

  • 在IDEA的小程式雲應用檢視中點選登入賬號然後用具有開發者許可權的使用者掃碼授權登入
    PS:新增開發者賬號的方式:我的小程式 =>檢視 => 成員管理 => 新增 => 要新增的賬號在客戶端找到對應的提示資訊並點選確認
  • 開始對接
    IDEA基於支付寶小程式搭建springboot專案
  • 彈出掃碼框,請使用具有開發者許可權的使用者支付寶掃碼登入。
  • 點選下方底欄的alipay devtools,先於自己的小程式關聯。
    IDEA基於支付寶小程式搭建springboot專案
  • 選中自己的小程式後,出現如下即關聯小程式成功。
    IDEA基於支付寶小程式搭建springboot專案
  • 選中關聯雲應用
    IDEA基於支付寶小程式搭建springboot專案
  • 彈出框選中之前在平臺建立的雲應用名稱
    IDEA基於支付寶小程式搭建springboot專案
  • 在下面alipay devtools中選擇雲端部署,出現如下即關聯成功
    IDEA基於支付寶小程式搭建springboot專案
  • 開始部署
    IDEA基於支付寶小程式搭建springboot專案
    IDEA基於支付寶小程式搭建springboot專案
    IDEA基於支付寶小程式搭建springboot專案
  • 開始部署後,雲應用管理 視窗會打出部署日誌。部署結束後會有訊息提示部署完成。

客戶端

  • 下載小程式開發者工具並安裝
    IDEA基於支付寶小程式搭建springboot專案
    IDEA基於支付寶小程式搭建springboot專案
  • 建立完成後編輯page/index/index.js
    IDEA基於支付寶小程式搭建springboot專案
  • 啟動模擬器測試如下:
    IDEA基於支付寶小程式搭建springboot專案
  • 開啟控制檯如下:
    IDEA基於支付寶小程式搭建springboot專案

至此IDEA支付寶小程式搭建springboot專案完成,後續有時間會推出支付寶授權,支付等文章,感謝大聲的觀看,如果錯誤,請在評論區指出來,我會校正,蟹蟹各位。

相關文章