首先添加支付宝sdk的绑定库
nuget 包：Chi.MauiBinding.Android.AliPay
项目地址：https://github.com/realZhangChi/MauiBinding
新建maui Blazor应用，在根目录创建一个静态类PublicMethods.cs （类名位置都可以自定义，这个静态类主要给html js 调用使用的，js调用服务端方法 从 ASP.NET Core Blazor 中的 JavaScript 函数调用 .NET 方法 | Microsoft Learn）
注意其中的 #if ANDROID IOS 指在不同的平台下执行操作
using Microsoft.JSInterop;
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Text;
using System.Text.Encodings.Web;
using System.Text.Json;
using System.Text.Unicode;
using System.Threading.Tasks;
using static System.Runtime.InteropServices.JavaScript.JSType;
namespace MauiApp7
{
public static class PublicMethods
{
[JSInvokable]
public static async Task AliPays(IJSObjectReference objRef,string aliPayStrs)
{
#if ANDROID
_ =Task.Run(async () =>
{
string con = aliPayStrs;//调用支付宝app支付接口返回的内容
var options = new JsonSerializerOptions
{
Encoder = JavaScriptEncoder.UnsafeRelaxedJsonEscaping
};
var act = Microsoft.Maui.ApplicationModel.Platform.CurrentActivity;
Com.Alipay.Sdk.App.PayTask pa = new Com.Alipay.Sdk.App.PayTask(act);
var result = pa.PayV2(con, true);
var resultStatus = result.TryGetValue("resultStatus",out string resultStatusDic)? resultStatusDic:"-1";
var memo = result.TryGetValue("memo",out string memoDic)? memoDic:"";
if (resultStatus == "9000")
{
memo = "支付成功";
}
else if (resultStatus == "-1")
{
memo = "支付失败";
}
//执行前端html window上注册的回调方法
await objRef.InvokeVoidAsync("aliPayCallBack", new { resultStatus = resultStatus, memo = memo });
});
#endif
}
}
}
1.修改MainPage.xaml 中的代码，删除BlazorWebView 下子内容，修改后的代码为
<BlazorWebView x:Name="blazorWebView" HostPage="wwwroot/index.html" BlazorWebViewInitialized="blazorWebView_BlazorWebViewInitialized"> </BlazorWebView>
修改MainPage.xaml.cs中代码添加BlazorWebViewInitialized 事件，此事件是允许BlazorWebView在Android平台下能够同时访问http和https的混合请求，需搭配android:usesCleartextTraffic="true" 使用 具体参考 maui BlazorWebView Android 中混合使用https和http - 落叶子 - 博客园 (cnblogs.com)
private void blazorWebView_BlazorWebViewInitialized(object sender, Microsoft.AspNetCore.Components.WebView.BlazorWebViewInitializedEventArgs e)
{
#if ANDROID
e.WebView.Settings.MixedContentMode = Android.Webkit.MixedContentHandling.AlwaysAllow;
#endif
}
2. 修改 wwwroot下的index.html 具体代码为：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<title>MauiApp3</title>
<base href="/" />
<!--引用jquery 可以自行引入-->
<script src="lib/jquery.min.js"></script>
</head>
<body>
<button style="width: 100%;background: rgb(5, 200, 235);border: 0rem;" id="zhifuapp">支付宝App支付</button><br /><br />
<script src="_framework/blazor.webview.js" autostart="false" crossorigin="anonymous"></script>
<script>
$(function () {
var jsObjectReference;
$("#zhifuapp").click(function () {
// 调佣服务接口获取支付宝app支付需要的请求字符串（res） returnUrl quitUrl参数忽略这是我自己测试用的
$.post("https://xxxx/ali/create-maui-app", { returnUrl:"", quitUrl: "" }, function (res) {
jsObjectReference = DotNet.createJSObjectReference(window);
DotNet.invokeMethodAsync('MauiApp7', 'AliPays', jsObjectReference, res)
.then(data => {
console.log(data);
});
}).error(function (res) {
alert("出现错误:" + JSON.stringify(res));
})
})
//window上注册支付回调方法
window.aliPayCallBack = (res) => {
if (jsObjectReference) {
DotNet.disposeJSObjectReference(jsObjectReference);
}
alert("执行了支付宝支付回调" + JSON.stringify(res));
}
})
</script>
</body>
</html>
自此完成
标签：支付宝,vue,uniapp,res,System,resultStatus,using,Android From： https://www.cnblogs.com/lkd3063601/p/17241939.html