首先添加支付宝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>

自此完成

maui BlazorWebView+本地html (vue、uniapp等都可以) 接入支付宝sdk 进行支付宝支付 开发 Android app的更多相关文章

  1. vue+uni-app商城实战 | 第一篇:【有来小店】微信小程序快速开发接入Spring Cloud OAuth2认证中心完成授权登录

    一. 前言 本篇通过实战来讲述如何使用uni-app快速进行商城微信小程序的开发以及小程序如何接入后台Spring Cloud微服务. 有来商城 youlai-mall 项目是一套全栈商城系统,技术栈 ...

  2. 基于vue+uniapp直播项目|uni-app仿抖音/陌陌直播室

    一.项目简介 uni-liveShow是一个基于vue+uni-app技术开发的集小视频/IM聊天/直播等功能于一体的微直播项目.界面仿制抖音|火山小视频/陌陌直播,支持编译到多端(H5.小程序.Ap ...

  3. uni-app聊天室|vue+uniapp仿微信聊天实例|uniapp仿微信App界面

    一.介绍 运用UniApp+Vue+Vuex+swiper+uniPop等技术开发的仿微信原生App聊天室|仿微信聊天界面实例项目uniapp-chatroom,实现了发送图文消息.表情(gif图), ...

  4. 用vue开发一个app(3,三天的成果)

    前言 一个vue的demo 源码说明 项目目录说明 . |-- config // 项目开发环境配置 | |-- index.js // 项目打包部署配置 |-- src // 源码目录 | |-- ...

  5. 用vue开发一个app(4,一个久等了的文章)H5直播平台登录注册(1)

    我上一篇关于vue的文章和这一篇时间隔了有点久了.最近终于写完了. 因为我一直想写个有点实绩的东西,而不是随便写一个教程一样东西.结合最近在项目中学到的经验和我的一点创意. 首先介绍下这是个什么! H ...

  6. 如何优雅的使用vue+Dcloud(Hbuild)开发混合app

    如何优雅的使用vue+Dcloud(Hbuild)开发混合app 最近在做混合app,前端框架用的是vue,打包app使用的是Dcloud,不过在开发过程中有一点不爽的是,如果想使用Dcloud提供的 ...

  7. Android app启动activity并调用onCreate()方法时都默默地干了什么?

    Android app启动activity并调用onCreate() 方法时都默默地干了什么?   在AndroidManifest.xml文件中的<intent-filter>元素中有这 ...

  8. vue uni-app项目中的tabbar

    由于公司要求开发百度小程序,所以我们采用uni-app开发的方式,一套代码多个小程序都可以用,在开发小程序的时候我们也经常会使用到tabbar.当然自己写出来也是不错的.这个就来介绍uni-app中的 ...

  9. Vue | uni-app 中使用websocket

    @ 目录 首先在根目录下新建一个store文件夹,并新建一个websocket.js文件,代码如下: import Vue from 'vue' import Vuex from 'vuex' Vue ...

  10. gantt甘特图可拖拽、编辑(vue、react都可用 highcharts)

    前言   Excel功能强大,应用广泛.随着web应用的兴起和完善,用户的要求也越来越高.很多Excel的功能都搬到了sass里面.恨不得给他们做个Excel出来...程序员太难了... 去年我遇到了 ...

随机推荐

  1. ngnix开启高可用网关集群--好记性不如烂笔头

    #1.开启高可用网关集群--------------------好记性不如烂笔头--------------------------- #gzip on; #开启网关集群 upstream gatew ...

  2. eggjs中egg-mysql不支持mysql集群,代码修改为支持集群

    说明:暂不支持egg-mysql动态数据源,用到动态数据源请自行修改.欢迎各位大佬指导... 集群配置: exports.mysql = { // 单数据库信息配置 client: { db1: { ...

  3. noi 1.1 5 输出保留12位小数的浮点数

    描述 读入一个双精度浮点数,保留12位小数,输出这个浮点数. 输入 只有一行,一个双精度浮点数. 输出 也只有一行,保留12位小数的浮点数. 样例输入 3.1415926535798932 样例输出 ...

  4. CSR,SSR,PreRender原理解密

    CSR.SSR.Prerender 原理全解密   做前端的同学们肯定或多或少听说过CSR,SSR,Prerender这些名词,但是大多肯定只是停留在听说过,了解过,略懂一点,但是,你真的理解这些技术 ...

  5. git常用命令查询手册

    默认已经连接到远程仓库的情况下 本地文件夹初始化成git仓库.提交本地仓库并添加注释 git init git add 文件1(文件夹1) 文件2(文件夹2)... git commit -m &qu ...

  6. pycharm开发工具的介绍和使用

    pycharm开发工具的介绍和使用 PyCharm是常用的python开发工具之一,分为社区版和专业版,社区版只有基础的python环境,专业版的功能会多很多

  7. JS实现异步的方法:回调函数callback、事件监听、setTimeout、Promise、生成器Generators/yield、async/awt

    所有异步任务都是在同步任务执行结束之后,从任务队列中依次取出执行. 回调函数是异步操作最基本的方法,比如AJAX回调,回调函数的优点是简单.容易理解和实现,缺点是不利于代码的阅读和维护,各个部分之间高 ...

  8. 身为一个java开发人员对目前java开发的一些小小的认识

    为什么要学java? 第一要工作,第二想要高薪 首先身为java开发工作人员你的思想认知程度要搞,思想认知程度决定你的专业技能水平 JavaSE工程师     B/S 架构   ----    浏览器 ...

  9. 为什么javac后加.java,java后不加.class?

    Javac和java命令的用法:javac需要文件,Java需要执行类或jar文件javac用法: java用法 例子 Java命令后的"test.Test.class"会被认为是 ...

  10. homework2软件方法论

    什么是软件工程方法论? 1.软件工程是一个方法论,就是我们在开始一个项目时,大体框架一定要有这么一个概念,而具体实施时,必须根据公司一些特点,优化项目开发的流程,这样才是有实效而方法论只是软件工程的结 ...