使用kotlin Jetpack Compose框架开发安卓app, webview中h5如何访问手机存储上传文件

简介: 在Kotlin和Jetpack Compose中,集成WebView以支持HTML5页面访问手机存储及上传音频文件涉及关键步骤:1) 添加`READ_EXTERNAL_STORAGE`和`WRITE_EXTERNAL_STORAGE`权限,考虑Android 11的分区存储;2) 配置WebView允许JavaScript和文件访问,启用`javaScriptEnabled`、`allowFileAccess`等设置;3) HTML5页面使用`<input type="file">`让用户选择文件,利用File API;

在Kotlin中开发Android应用时,如果你想要在WebView中处理HTML5的<input type="file">标签以触发文件选择器,你可以结合使用registerForActivityResult(也称为rememberLauncherForActivityResult,但在Fragment中更常用的是前者)和WebChromeClient。以下是一个在Activity中实现的示例代码,展示了如何设置WebView并处理文件选择。


在你的Activity中,设置WebView,并注册一个用于处理文件选择的ActivityResultLauncher,同时设置WebChromeClient以监听文件选择器的请求:

import android.content.Intent  
import android.net.Uri  
import android.os.Bundle  
import android.webkit.ValueCallback  
import android.webkit.WebChromeClient  
import android.webkit.WebView  
import android.webkit.WebViewClient  
import androidx.activity.result.ActivityResultLauncher  
import androidx.activity.result.contract.ActivityResultContracts  
import androidx.appcompat.app.AppCompatActivity  
  
class MainActivity : AppCompatActivity() {  
  
    private lateinit var webView: WebView  
    private lateinit var fileChooserLauncher: ActivityResultLauncher<Intent>  
  
    override fun onCreate(savedInstanceState: Bundle?) {  
        super.onCreate(savedInstanceState)  
        setContentView(R.layout.activity_main)  
  
        webView = findViewById(R.id.webview)  
  
        // 设置WebViewClient处理页面加载  
        webView.webViewClient = WebViewClient()  
  
        // 设置WebChromeClient处理文件选择等  
        webView.webChromeClient = object : WebChromeClient() {  
            override fun onShowFileChooser(  
                webView: WebView?,  
                filePathCallback: ValueCallback<Array<Uri>>?,  
                fileChooserParams: FileChooserParams?  
            ): Boolean {  
                // 创建Intent来启动文件选择器  
                val intent = Intent(Intent.ACTION_GET_CONTENT)  
                intent.type = "*/*" // 设置MIME类型,这里表示所有类型  
                intent.addCategory(Intent.CATEGORY_OPENABLE)  
  
                // 使用ActivityResultLauncher启动Intent  
                fileChooserLauncher.launch(intent)  
  
                // 必须返回true,表示文件选择器将被处理  
                return true  
            }  
        }  
  
        // 加载网页  
        webView.loadUrl("https://your-website.com/page-with-file-input.html")  
  
        // 注册ActivityResultLauncher以处理文件选择结果  
        fileChooserLauncher = registerForActivityResult(ActivityResultContracts.StartActivityForResult()) { result ->  
            if (result.resultCode == RESULT_OK) {  
                // 处理选择的文件,这里假设filePathCallback是全局可访问的  
                // 注意:在实际应用中,filePathCallback可能不是全局的,你需要通过其他方式传递它  
                // 例如,你可以将WebView的引用和filePathCallback一起传递给一个自定义的类,该类将处理文件选择  
                // 这里只是示例,所以省略了这部分逻辑  
  
                // 假设你有一个全局的filePathCallback变量  
                // filePathCallback?.onReceiveValue(arrayOf(result.data?.data))  
            }  
        }  
    }  
  
    // 注意:上面的filePathCallback处理是简化的,实际中你可能需要不同的逻辑  
    // 因为在WebChromeClient的onShowFileChooser方法中,filePathCallback是局部的  
    // 你需要找到一种方法来在文件选择结果返回时调用它  
  
    // 一种可能的解决方案是使用弱引用或全局变量(但请注意内存泄漏的风险)  
    // 或者,你可以将WebView的引用和filePathCallback一起封装在一个自定义的类中  
}

注意:上面的代码示例中,filePathCallback的处理是简化的,因为在实际情况下,filePathCallback是在onShowFileChooser的局部作用域中定义的,并且不是全局可访问的。因此,你需要找到一种方法来在文件选择结果返回时调用它。

一种常见的做法是将WebView的引用和filePathCallback一起封装在一个自定义的类中,该类将负责处理文件选择请求和结果。这样,你就可以在文件选择结果返回时,通过该类的实例来调用filePathCallback

相关文章
|
14天前
|
存储 开发工具 Android开发
使用.NET MAUI开发第一个安卓APP
【9月更文挑战第24天】使用.NET MAUI开发首个安卓APP需完成以下步骤:首先,安装Visual Studio 2022并勾选“.NET Multi-platform App UI development”工作负载;接着,安装Android SDK。然后,创建新项目时选择“.NET Multi-platform App (MAUI)”模板,并仅针对Android平台进行配置。了解项目结构,包括`.csproj`配置文件、`Properties`配置文件夹、平台特定代码及共享代码等。
|
2月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
70 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
1月前
|
API 调度 Android开发
告别回调地狱,拥抱流畅开发体验:Kotlin协程带你解锁异步编程新姿势,让App响应速度飙升!
【9月更文挑战第11天】随着移动互联网的发展,用户对应用体验的要求不断提高,异步编程因此变得尤为重要。Kotlin凭借简洁的语法和强大的功能,在Android开发中脱颖而出。协程作为Kotlin的核心特性之一,简化了异步代码编写,提高了程序性能与可维护性。
28 5
|
28天前
|
移动开发 定位技术 Android开发
「揭秘高效App的秘密武器」:Kotlin Flow携手ViewModel,打造极致响应式UI体验,你不可不知的技术革新!
【9月更文挑战第12天】随着移动开发领域对响应式编程的需求增加,管理应用程序状态变得至关重要。Jetpack Compose 和 Kotlin Flow 的组合提供了一种优雅的方式处理 UI 状态变化,简化了状态管理。本文探讨如何利用 Kotlin Flow 增强 ViewModel 功能,构建简洁强大的响应式 UI。
33 3
|
2月前
|
开发框架 .NET Windows
【App Service】在App Service中配置Virtual applications and directories,访问目录中的静态文件报错404
【App Service】在App Service中配置Virtual applications and directories,访问目录中的静态文件报错404
|
2月前
|
安全 网络安全 Windows
【Azure App Service】遇见az命令访问HTTPS App Service 时遇见SSL证书问题,暂时跳过证书检查的办法
【Azure App Service】遇见az命令访问HTTPS App Service 时遇见SSL证书问题,暂时跳过证书检查的办法
【Azure App Service】遇见az命令访问HTTPS App Service 时遇见SSL证书问题,暂时跳过证书检查的办法
|
2月前
|
存储 XML Linux
深入理解操作系统:进程管理与调度策略探索安卓应用开发:从零开始构建你的第一个App
【8月更文挑战第28天】在数字世界里航行,操作系统是掌控一切的舵手。本文将带你领略操作系统的精妙设计,特别是进程管理和调度策略这两大核心领域。我们将从基础概念出发,逐步深入到复杂的实现机制,最后通过实际代码示例,揭示操作系统如何高效协调资源,确保多任务顺畅运行的秘密。准备好了吗?让我们启航,探索那些隐藏在日常电脑使用背后的奥秘。 【8月更文挑战第28天】在这个数字时代,拥有一款自己的移动应用程序不仅是技术的展示,也是实现创意和解决问题的一种方式。本文将引导初学者了解安卓开发的基础知识,通过一个简单的待办事项列表App项目,逐步介绍如何利用安卓开发工具和语言来创建、测试并发布一个基本的安卓应用
|
2月前
|
Java 程序员 Android开发
探索安卓开发:构建你的第一个App
【8月更文挑战第27天】在数字化时代的浪潮中,移动应用成为人们生活不可或缺的一部分。对于渴望进入软件开发领域的新手而言,掌握如何构建一款简单的安卓App是开启技术之旅的关键一步。本文旨在通过浅显易懂的语言和步骤分解,引导初学者了解安卓开发的基础知识,并跟随示例代码,一步步实现自己的第一个安卓App。从环境搭建到界面设计,再到功能实现,我们将一同揭开编程的神秘面纱,让每个人都能体会到创造软件的乐趣。
|
2月前
|
安全 前端开发 网络安全
【Azure App Service】访问App Service应用报错 SSL: WRONG_VERSION_NUMBER
【Azure App Service】访问App Service应用报错 SSL: WRONG_VERSION_NUMBER
|
4月前
|
网络协议 Android开发 数据安全/隐私保护
Android手机上使用Socks5全局代理-教程+软件
Android手机上使用Socks5全局代理-教程+软件
3357 2