首先添加支付宝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. Java集合-LinkedHashSet

    LinkedHashSet 重点: LinkedHashSet 不允许重复元素,与 HashSet的区别是:它是有序的 LinkedHashSet 底层结构是 数组table + 双向链表 [介绍] ...

  2. SQL 用 in 大于 1000 问题解决

    -- 今天生成环境数据突然多,系统异常 解决方案(必须用in 业务情况),也可以用其他函数解决 union all  或者 exists 等 1:截取list List<Integer>  ...

  3. matlab 求解 f(x)=x(x+1)(x+2)(x+3)(x+4)...(x+n-2)(x+n-1)(x+n)的导数;

    matlab 求解 f(x)=x(x+1)(x+2)(x+3)(x+4)...(x+n-2)(x+n-1)(x+n)的导数; matlab diff() 问题的提出 问题 代码求解 clc; clea ...

  4. 解决未定义的count键“报错为："Uncaught ReferenceError: count is not defined"

    报错: 源码:Vuex仓库.js let state = {     count } export default state   解决:未赋值的count键

  5. libevent学习之入门--[02]从hello-world开始

    系列文章回顾 libevent学习之入门--[01]概述与安装 上一节介绍了libevent的下载和编译,从这节开始,我会从我学习的角度逐步探索libevent的源码,慢慢揭开它的神秘面纱. 面对几十 ...

  6. hive：使用concat_ws实现 array转string案例

    concat_ws(',',collect_set(if(step_name <> '',step_name,null))) AS step_names,

  7. geoserver leaflet 使用wms

    注意事项 1.  地址是 http://192.168.31.120:8080/geoserver/cite/wms   不需要后面 2. 名称 city:Polyline3 3.默认层级别调试为0  ...

  8. 升级openssl版本

    一.安装步骤 1.下载openssl安装包 2.编译安装 3.备份旧版本openssl 4.添加软连接 5.添加OpenSSL动态链接库并使其生效 二.下载openssl安装包 [root@local ...

  9. ios底部安全距离

    一.使用背景 苹果官方推荐:使用env(),constant()来适配,env()和constant(),是IOS11新增特性,用于设定安全区域与边界的距离 safe-area-inset-left: ...

  10. CSS 语法-熟悉样式规则

    CSS 规则: CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 样式规则: 以内嵌式样式表为例: (1)所有的css代码都必须书写在<head>标签内部的一对<sty ...