小程式作為目前一種輕量、便捷的應用、目前應用越來越廣泛了。很多沒有開發經驗的開發同學可能初次接觸就是小程式開發，為了詳細講解下小程式開發的步驟，我會按照小程式的開發流程一步一步從零開始給大家介紹下如何開發支付寶小程式，後續教程中會更新最新版 demo 給到大家。 ...

小程式作為目前一種輕量、便捷的應用、目前應用越來越廣泛了。

很多沒有開發經驗的開發同學可能初次接觸就是小程式開發，為了詳細講解下小程式開發的步驟，我會按照小程式的開發流程一步一步從零開始給大家介紹下如何開發支付寶小程式，後續教程中會更新最新版 demo 給到大家。

今天我們所要講的內容就是開發小程式前，我們必須要做的一些準備工作。

下文將會從「小程式應用創建」、「小程式平臺配置信息介紹」以及「小程式開發者工具介紹」三個方面展開講解。

一、小程式應用創建

眾所周知，小程式最大的優勢就是依賴於背後的平臺，那麼基於平臺維度去產出的小程式的第一步就是要先進入支付寶開放平臺。

大家可以按照官方文檔去進行入駐：[如何入駐支付寶開放平臺]

ps：支付寶開放平臺的入駐對賬號沒有要求，只要是支付寶賬號就可以。

入駐成功之後我們就可以進入到開放平臺的首頁去創建小程式。

點擊【創建小程式】：

進入到小程式創建頁面之後，需要填寫【小程式名稱】以及【綁定主體賬號】，

綁定主體賬號直接選擇當前賬號：

⚠️ 註意（劃重點！！）：

這個「小程式名稱」就是對外展示小程式名稱；
此時名稱校驗通過並創建成功之後並不代表名稱沒有問題，只代表著你的名稱基本是沒有問題，後面是不是有問題還得看支付寶審核那邊的要求；
名稱要求比較多，總結起來就是不違法、不騙人、不雷同，可以參考小程式/生活號命名規範。

創建成功之後，就會跳轉到小程式的詳細信息界面了，這個時候我們就可以獲取到 APPID 了，如下圖：

這裡有一些常見的創建小程式相關問題彙總，供大家查閱：

二、小程式平臺配置信息介紹

創建小程式成功之後，我們可以看到平臺上有一大堆的「配置信息」和「設置信息」，下麵挑一些重點的配置來為大家介紹下~

1. 基礎信息

1.1 小程式信息

首先就是小程式信息，在小程式信息裡面大部分都是對外展示的，並且每次修改之後 需要跟隨小程式提交的版本一起審核，審核通過之後才會生效。

1.2 基礎設置

基礎設置中需要註意的是 搜索可見設置、小程式隱私政策。

搜索可見設置：預設是開啟的，關閉的情況下，用戶是無法搜到小程式的。如果遇到小程式上線之後無法搜到的情況，要到這個位置確認下設置的狀態；
小程式隱私政策：這個設置的作用在於展示給用戶看隱私政策授權協議內容，就是用戶授權時彈出的那個需要勾選【我同意】的協議，所以只要是接入有關用戶授權的內容，就必須要配置。

1.3 成員管理

正常小程式在未開發完成之前都是只有自己賬號才能看到的，但是如果別的支付寶賬號也要看到這個小程式就要用到成員管理的配置了，需要將其他人的支付寶賬號配置到成員管理裡面。

下麵簡單概括下許可權範圍

管理員：所有許可權都有（包含提交審核許可權）
開發成員：只有開發的許可權（沒有提交審核許可權，但是可以申請）
體驗成員：只有未上線前預覽小程式的許可權

這部分的涉及的許可權比較多，有興趣的小伙伴可以參考官方文檔成員管理。

2. 開發設置

開發設置中重點配置在「產品綁定」和「開發信息」兩塊內容～

2.1 產品綁定

產品綁定的作用就是告訴支付寶你的這個小程式需要調用哪些功能，只要綁定了並且產品狀態是已開通的，就表明可以正常接入這個 API。

大部分的小程式 API 的調用是不需要綁定，但是部分 開放能力的 API 需要綁定之後才能調用，具體看接入的 API 文檔是否有涉及到這部分，如下圖所示：

2.2 開發信息

開發信息這部分先重點介紹下 伺服器功能變數名稱白名單

伺服器功能變數名稱白名單 作用在於在小程式前端請求到後端伺服器的時候，需要將伺服器的功能變數名稱地址配置到這裡。不配置的話是無法請求成功的。

另外涉及的重點配置的內容就是「介面加簽方式」和「介面內容加密方式（AES）」。

這兩塊的配置也是主要作用於服務端，也就是數據傳輸到服務端後，服務端請求支付寶時所需要配置的內容。

介面加簽方式 的配置可以參考我之前寫的：

介面內容加密方式（AES） 是用於前後端敏感信息傳輸時加密的密鑰，詳細配置可參考[如何配置AES密鑰]

3. 審核/發佈管理

小程式開發完成，並且版本上傳之後，我們可以在平臺的 版本管理->開發版本 中看到我們上傳的小程式，並且可以讓體驗人員直接用支付寶掃碼進行體驗。確認無誤之後就可以提交審核了。

審核通過之後就可以線上上版本查看到了～

三、小程式開發者工具介紹

1. 開發工具安裝

小程式創建完成之後，我們就需要下載支付寶提供的小程式開發工具（IDE），根據自己的機型下載安裝。

後續我們小程式的開發和調試就完全是在這個工具中進行了。

2. 創建小程式項目

選擇【支付寶】：

IDE 提供了多個模板，我們創建一個空白模板：

輸入項目名稱以及項目路徑，註意項目路徑跟 IDE 安裝路徑不要一樣

創建完成之後我們就可以進入工具的開發頁面了：

這裡有一些小程式開發工具常見問題彙總，供大家查閱：

3. 工具綁定小程式

此時我們離開發還有兩個步驟，第一個就是登錄支付寶賬號。

我們點擊左上角的登錄按鈕，用支付寶賬號掃碼登錄，需要在手機上確認授權：

登錄成功之後，我們需要在 IDE 上關聯一下我們之前在平臺創建的小程式，點擊【選擇關聯應用】，找到我們創建的小程式進行關聯：

4. 項目目錄結構

接下來介紹小程式項目的目錄結構。

創建成功之後，預設的目錄結構如下所示：

├── mini.project.json 配置小程式全局環境（例如是否開啟組件、是否開啟基礎庫2.0版本等）
├── app.acss 全局樣式配置
├── app.js 小程式入口js
├── app.json 小程式的配置
└── pages 存放頁面文件夾
    └── index 首頁
        ├── index.acss 首頁的樣式
        ├── index.axml 首頁的模板
        ├── index.js 首頁的業務邏輯
        └── index.json 首頁的配置

5. 新建頁面

如果需要新建一個小程式頁面，需要在對應目錄上右擊，點擊【新建小程式頁面】：

生成的頁面會預設包含.json、.js、.axml、.acss 四個文件：

此時在 app.json 文件中我們會發現自動載入了新建的 log 文件：

這裡 pages 配置中，哪個頁面路徑在最上面，哪個頁面就是首頁～

到這裡，我們開發前的所有準備都已經完成了，下一篇將會詳細講解下「如何調試小程式」，記得收藏哦

最新demo版｜如何0-1開發支付寶小程式之前期準備篇（一）