商戶已有H5商城網站，用戶通過消息或掃描二維碼在微信內打開網頁時，可以調用微信支付完成下單購買的流程。

步驟（1）：如圖7.1，商戶下發(fā)圖文消息或者通過自定義菜單吸引用戶點擊進入商戶網頁。

步驟（2）：如圖7.2，進入商戶網頁，用戶選擇購買，完成選購流程。

圖7.1 商戶自定義消息界面

圖7.2 商戶網頁下單

步驟（3）：如圖7.3，調起微信支付控件，用戶開始輸入支付密碼。

步驟（4）：如圖7.4，密碼驗證通過，支付成功。商戶后臺得到支付成功的通知。

圖7.3 用戶確認支付，輸入密碼

圖7.4 用戶支付成功提示

步驟（5）：如圖7.5，返回商戶頁面，顯示購買成功。該頁面由商戶自定義。

步驟（6）：如圖7.6，公眾號下發(fā)消息，提示發(fā)貨成功。該步驟可選。

圖7.5 返回商戶頁面提示

圖7.6 用戶收到發(fā)貨微信通知

注意：商戶也可以把商品網頁的鏈接生成二維碼，用戶掃一掃打開后即可完成購買支付。

交互細節(jié)：

以下是支付場景的交互細節(jié)，請認真閱讀，設計商戶頁面的邏輯：

（1）用戶打開商戶網頁選購商品，發(fā)起支付，在網頁通過JavaScript調用getBrandWCPayRequest接口，發(fā)起微信支付請求，用戶進入支付流程。

（2）用戶成功支付點擊完成按鈕后，商戶的前端會收到JavaScript的返回值。商戶可直接跳轉到支付成功的靜態(tài)頁面進行展示。

（3）商戶后臺收到來自微信開放平臺的支付成功回調通知，標志該筆訂單支付成功。

注：（2）和（3）的觸發(fā)不保證遵循嚴格的時序。JS API返回值作為觸發(fā)商戶網頁跳轉的標志，但商戶后臺應該只在收到微信后臺的支付成功回調通知后，才做真正的支付成功的處理。