領導第一次讓我做h5支付寶支付的時候，去了支付寶開放平台，一頓上上下下左左右右，看完了長呼一口氣。
這個支付好像沒我啥事兒啊！小伙伴兒們自行查看：https://opendocs.alipay.com/open/203/105285
關於手機網頁內支付寶支付，核心代碼就是，后端會返回給你一個form，然后你拿着這個form去調用就行了。
這樣就需要你准備兩網頁。一個是你寫好的盛裝后台返回的支付頁面，一個是支付成功后，給return_url跳轉的成功頁面。
並且你可以通過獲取網頁url參數的方法去根據參數在這個回調頁面里做些什么。
首先，我們先請求后端給我們的支付接口。
//點擊支付業務頁面<template><div><button @click="handlePay" class="pay_money_button" type="info" :loading="load" loading-text="支付中">去支付</button></div></template><script>export default {data(){return {load:false}},methods:{//點擊支付handlePay(){this.load = true;//請求支付參數let data = {orderId:this.payForm.orderId}aliPaySignH5(data).then((res) => {if (res.status == 1000) {if (res.data !== null) {//這里我用了緩存來處理返回值，用router傳參，一個會顯示在瀏覽器上，//一個強制刷新會消失參數，而且form表單過長。個人喜好，自行更改sessionStorage.setItem('html',res.data);this.$router.push({path:'/bigdatapay'})}}}).finally((res)=>{this.load = false;Toast.fail(res.data.msg);}).catch((err) => {//你想吃點啥吃點啥吧})},}}</script>
//支付寶返回表單前端調用頁面<template><div class="container"><div v-html="apply"></div></div></template><script>export default {data(){return {apply:'',}},mounted(){let form = sessionStorage.getItem('html')this.apply = form;this.$nextTick(()=>{document.forms[0].submit()})},methods:{}}</script>
這里還有一個地方就是，支付寶支付是無法在微信環境內打開的，所以你需要在支付頁面加一個判斷，如果是微信環境，就給用戶一個操作提示，打開右上角，去在瀏覽器里打開頁面。判斷微信環境的方法之前我們已經封裝好了，這里不重復寫出，朋友們自行前去查看即可（前面的文章，微信分享和支付中都有這個方法）。好了，到這里，我們的支付寶和微信常用的幾個接口我們都做完了。