当前位置: 首页 > news >正文

van-uploader 在app内嵌的webview中的一些坑

问题:

  1. 部分版本在ios 中没有问题,但是安卓中不触发图片选择和拍照(之前是可以的,可能是没有锁定版本,重新发版导致的)。
  2. 在ios中下拉文案是英文,html配置lang等于 zh 也没有用,ios里配置也无效。
  3. 我自己遇到的,ios中拍照上传图片点击使用图片之后会刷新整个页面。

解决方案:

  1. 安卓使用app 提供的原生方法上传图片(上传逻辑放在app完成,上传成功之后给h5 返回图片url)
    1-1:利用**@click.native** 的特性,会触发组件上传方法之前调用 clickUploader 方法,判断如果是安卓app,则阻止事件向内部传递,然后调用原生app提供的方法。
    1-2:app上传成功之后会调用前端绑定在window上的方法backImgUrlFromApp,然后把图片的url传给H5端。
    1-3:此种方法不会自动触发组件的afterRead方法了,需要自己手动调用。
    1-4:如果是在ios app中打开的H5, 则不会触发 event.preventDefault(),会走组件的触发ios上传功能
<van-uploaderv-model="uploader1"max-count="1":after-read="afterRead"upload-text="选择图片"@click.native="clickUploader($event, 'uploader1')"/>// 上传方法
clickUploader(event, formKey) {if (!this[formKey].length && inAndroidApp()) {event.preventDefault();window.nativeApp.callAlbum();(window as any).backImgUrlFromApp= async (url: string) => {console.log("拿到app返回的上传图片的url", url);this[formKey] = [{ url }];this.afterRead({ filePath: url }, true);};}},
  1. 在ios中下拉文案是英文这个问题,需要让ios在webview中设置一个属性(不太懂,可以直接把这个链接给ios开发看)
    参考来源:https://www.jianshu.com/p/9ed94a238e28
需要在info.plist 里面填加一个key表示app 使用系统的语言,
key为Localized resources can be mixed 设置为YES 就可以了

在这里插入图片描述
3. ios拍照上传会刷新整个页面问题:
先让ios排查webview中是否有调用触发刷新的方法

这个问题我是让ios排查的,因为很明显是触发了整个webview的刷新,
后面发现是他代码里写了进了某个生命周期,触发了整个页面的刷新,
历史遗留问题,是之前的开发写的,至于为什么,无从得知

相关文章:

van-uploader 在app内嵌的webview中的一些坑

问题&#xff1a; 部分版本在ios 中没有问题&#xff0c;但是安卓中不触发图片选择和拍照&#xff08;之前是可以的&#xff0c;可能是没有锁定版本&#xff0c;重新发版导致的&#xff09;。在ios中下拉文案是英文&#xff0c;html配置lang等于 zh 也没有用&#xff0c;ios里…...

使用Kotlin进行全栈开发 Ktor+Kotlin/JS

首发于Enaium的个人博客 前言 本文将介绍如何使用 Kotlin 全栈技术栈KtorKotlin/JS来构建一个简单的全栈应用。 准备工作 创建项目 首先我们需要创建一个Kotlin项目&#xff0c;之后继续在其中新建两个子项目&#xff0c;一个是Kotlin/JS项目&#xff0c;另一个是Ktor项目。…...

数据结构_带头双向循环链表

List.h 相较于之前的顺序表和单向链表&#xff0c;双向链表的逻辑结构稍微复杂一些&#xff0c;但是在实现各种接口的时候是很简单的。因为不用找尾&#xff0c;写起来会舒服一点。&#xff08;也可能是因为最近一直在写这个的原因&#xff09; #pragma once #include<std…...

常见的垃圾回收器(下)

文章目录 G1ShenandoahZGC 常见垃圾回收期&#xff08;上&#xff09; G1 参数1&#xff1a; -XX:UseG1GC 打开G1的开关&#xff0c;JDK9之后默认不需要打开 参数2&#xff1a;-XX:MaxGCPauseMillis毫秒值 最大暂停的时间 回收年代和算法 ● 年轻代老年代 ● 复制算法 优点…...

网桥的原理

网桥的原理 1.1 桥接的概念 简单来说&#xff0c;桥接就是把一台机器上的若干个网络接口“连接”起来&#xff0c;其结果是&#xff0c;其中一个网口收到的报文会被复制给其他网口并发送出去。以使得网口之间的报文能够互相转发。 交换机有若干个网口&#xff0c;并且这些…...

STM32 CAN过滤器细节

STM32 CAN过滤器细节 简介 每组筛选器包含2个32位的寄存器&#xff0c;分别为CAN_FxR1和CAN_FxR2&#xff0c;它们用来存储要筛选的ID或掩码 四种模式 模式说明32位掩码模式CAN_FxR1存储ID&#xff0c; CAN_FxR2存储哪个位必须要与CAN_FxR1中的ID一致 &#xff0c; 2个寄存器…...

网络编程(现在不重要)

目录 网络编程三要素与InetAddress类的使用 软件架构 面临的主要问题 网络编程三要素&#xff08;对应三个问题&#xff09; InetAddress的使用 TCP与UDP协议剖析与TCP编程案例&#xff08;了解&#xff09; TCP协议 UDP协议 例子 UDP、URL网络编程 URL&#xff1a;&…...

10-菜刀连接木马

找到了漏洞后&#xff0c;并且上传了木马之后才能使用的两款工具 中国菜刀和冰蝎 想办法获取别人的cookie&#xff0c;cookie中有session-id 一、中国菜刀 1、必须提前已经完成木马植入然后才能使用 2、木马必须是POST请求&#xff0c;参数自定义&#xff0c;在菜刀里给出…...

Unity数据持久化—Json存档

项目需求为&#xff1a; 1.实现存档列表&#xff0c;显示存档截图&#xff0c;可以查看之前保存的所有存档 2.点击存档直接加载到场景 首先&#xff0c;定义两个类&#xff0c;用于声明存档列表和存档所需要的List [System.Serializable] public class SaveData {//存储目标…...

基于SSM的在线学习系统的设计与实现(论文+源码)_kaic

基于SSM的在线学习系统的设计与实现 摘要 随着信息互联网购物的飞速发展&#xff0c;一般企业都去创建属于自己的管理系统。本文介绍了在线学习系统的开发全过程。通过分析企业对于在线学习系统的需求&#xff0c;创建了一个计算机管理在线学习系统的方案。文章介绍了在线学习系…...

数据库SQL语言实战(二)

目录 检索查询 题目一 题目二 题目三 题目四 题目五 题目六 题目七 题目八 题目九&#xff08;本篇最难的题目&#xff09; 分析 实现&#xff08;两种方式&#xff09; 模板 总结 检索查询 按照要求查找数据库中的数据 题目一 找出没有选修任何课程的学…...

idea错误地commit后如何处理

如果你想使用命令行重新初始化 Git 仓库&#xff0c;可以按照以下步骤进行&#xff1a; 删除该项目的.git文件夹 打开命令行终端。 切换到项目所在的目录&#xff0c;使用 cd 命令。 在项目目录下运行以下命令来重新初始化 Git 仓库 git init这将在当前目录下创建一个新的 Git …...

VRTK(Virtual Reality Toolkit)深入介绍

VRTK是一个为Unity引擎设计的开源虚拟现实&#xff08;VR&#xff09;开发框架&#xff0c;旨在简化和加速VR应用的开发过程。这个工具包包含了一系列的模块和预设&#xff0c;使得开发者可以快速集成标准的VR功能&#xff0c;如物体交互、环境导航、用户界面管理等。下面将对V…...

【LeetCode热题100】【贪心算法】划分字母区间

题目链接&#xff1a;763. 划分字母区间 - 力扣&#xff08;LeetCode&#xff09; 要将一个字符串划分为多个子串&#xff0c;要求每个字母只能出现在一个子串里面 如果一个字母的当前位置是它在这个字符串里面最后一次出现的位置&#xff0c;那么这里就应该划分出来成为子串…...

第二届数据安全大赛暨首届“数信杯”数据安全大赛数据安全积分争夺赛-东区预赛部分WP

这里写目录标题 检材下载&#xff1a;1.理论题2.数据安全&#xff1a;pb:Sepack&#xff1a; 3.数据分析&#xff1a;数据分析&#xff08;1&#xff09;数据分析1-1:数据分析1-2:数据分析1-3: 数据分析&#xff08;3&#xff09;数据分析3-1&#xff1a;数据分析3-2&#xff1…...

如何在Python中使用matplotlib库进行数据可视化?

如何在Python中使用matplotlib库进行数据可视化&#xff1f; 在Python中使用matplotlib库进行数据可视化 数据可视化是将数据以图形或图像的形式展示出来的过程&#xff0c;它有助于我们更好地理解和分析数据。在Python中&#xff0c;matplotlib是一个非常受欢迎的数据可视化…...

网工基础协议——TCP/UDP协议

TCP和UDP的不同点&#xff1a; TCP(Transmission Control Protocol&#xff0c;传输控制协议)&#xff1b; UDP(User Data Protocol&#xff0c;用户数据报协议)&#xff1b; TCP&#xff1a;传输控制协议&#xff0c;面向连接可靠的协议&#xff0c;只能适用于单播通信&…...

ClickHouse--16--普通函数

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 一、日期函数1、时间或日期截取函数&#xff08;返回非日期&#xff09;2、时间或日期截取函数&#xff08;返回日期&#xff09;3、日期或时间日期生成函数 二、类…...

03-JAVA设计模式-组合模式

组合模式 什么是组合模式 组合模式&#xff08;Composite Pattern&#xff09;允许你将对象组合成树形结构以表示“部分-整体”的层次结构&#xff0c;使得客户端以统一的方式处理单个对象和对象的组合。组合模式让你可以将对象组合成树形结构&#xff0c;并且能像单独对象一…...

C++发票识别、发票查验接口示例,您的“发票管理专家”

发票识别发票查验接口。当财务人员在进行发票的数字化管理时&#xff0c;仅需一键上传发票图片&#xff0c;翔云发票识别接口即可快速、精准对发票的全票面信息进行提取&#xff0c;翔云发票查验接口可根据识别接口提取的发票信息实时联网进行真伪查验。助财务工作者从发票海洋…...

【电控笔记6.2】拉式转换与转移函数

概要 laplace&#xff1a;单输入单输出&#xff0c;线性系统 laplace 传递函数 总结...

第十五届蓝桥杯题解-数字接龙

题意&#xff1a;经过所有格子&#xff0c;并且不能进行交叉&#xff0c;走的下一个格子必须是当前格子值1%k&#xff0c;输出路径最小的那一条&#xff08;有8个方向&#xff0c;一会粘图&#xff09; 思路&#xff1a;按照8个方向设置偏移量进行dfs&#xff0c;第一个到达终…...

【vue】绑定事件 v-on

v-on 简写&#xff1a; clickkeyupkeydownkeyup.wkeyup.ctrl.a <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><…...

【应用】SpringBoot-自动配置原理

前言 本文简要介绍SpringBoot的自动配置原理。 本文讲述的SpringBoot版本为&#xff1a;3.1.2。 前置知识 在看原理介绍之前&#xff0c;需要知道Import注解的作用&#xff1a; 可以导入Configuration注解的配置类、声明Bean注解的bean方法&#xff1b;可以导入ImportSele…...

中文编程入门(Lua5.4.6中文版)第十二章 Lua 协程 参考《愿神》游戏

在《愿神》的提瓦特大陆上&#xff0c;每一位冒险者都拥有自己的独特力量——“神之眼”&#xff0c;他们借助元素之力探索广袤的世界&#xff0c;解决谜题&#xff0c;战胜敌人。而在提瓦特的科技树中&#xff0c;存在着一项名为“协同程序”的高级秘术&#xff0c;它使冒险者…...

C++笔记之注册回调函数常见的5种情况对比

C++笔记之注册回调函数常见的5种情况对比 —— 2024-04-10 code review! 文章目录 C++笔记之注册回调函数常见的5种情况对比1.五种情况2.示例2.1. `RegisterCallback` 和 `Callback` 都是普通函数2.2. `RegisterCallback` 是成员函数,`Callback` 是普通函数2.3. `RegisterC…...

人工智能揭示矩阵乘法的新可能性

人工智能揭示矩阵乘法的新可能性 数学家酷爱漂亮的谜题。当你尝试找到最有效的方法时&#xff0c;即使像乘法矩阵&#xff08;二维数字表&#xff09;这样抽象的东西也会感觉像玩一场游戏。这有点像尝试用尽可能少的步骤解开魔方——具有挑战性&#xff0c;但也很诱人。除了魔方…...

实在智能携手长江新零售俱乐部:探秘实在Agent数字员工,开启零售品牌增长新篇章

近日&#xff0c;实在智能携手长江新零售俱乐部成功举办了“AIGC&#xff1a;数字员工助力零售品牌新增长”主题活动&#xff0c;成功吸引了二十余家企业中高层管理精英的踊跃参与。在此次活动中&#xff0c;与会者围绕零售业数字化转型的当前态势、面临的挑战及其重要性进行了…...

计算机科学与导论 第十七 十八章 计算理论,人工智能

文章预览&#xff1a; 计算理论17.1 引言17.2 简单语言17.3 图灵机邱奇 -图灵 论题 人工智能引言18.1.1 什么是人工智能18.1.2 智能体18.1.3 编程语言 18.2 知识的表示18.2.1 语义网18.2.2 框架18.2.3 谓词逻辑18.2.4 基于规则的系统 18.2 专家系统18.3 语言理解18.4 搜索18.5 …...

linux 设置定时任务---学习

1、设置定时任务 crontab -e 设置格式参考&#xff1a;【Linux】Linux crontab 命令定时任务设置_crontab 设置每天10:30执行-CSDN博客 测试过程&#xff1a; */1 * * * * /root/cronjob.sh 脚本内容: echo "hell0 cronjob" >> /root/test/hello.txt 实现…...

美容培训东莞网站建设/广告投放平台有哪些

镜像翻转 flip()函数&#xff1a; flip函数是矩阵或者图像翻转&#xff0c;其实图像的本质也是矩阵。 void flip(InputArray src, OutputArray dst, int flipCode) 参数声明&#xff1a; src&#xff1a;输入矩阵 dst&#xff1a;翻转后矩阵&#xff0c;类型与src一致 flipCode…...

最早做网站的那批人/百度推广计划

Description N个政党要组成一个联合内阁&#xff0c;每个党都有自己的席位数. 现在希望你找出一种方案&#xff0c;你选中的党的席位数要大于总数的一半&#xff0c;并且联合内阁的席位数越多越好. 对于一个联合内阁&#xff0c;如果某个政党退出后&#xff0c;其它党的席位仍大…...

外贸网站建设高端的/百度网盘资源搜索

安装edX首先需要一台linux或Mac系统的电脑/服务器。 这里以常见的Ubuntu作为服务器系统。 Ubuntu的官方网站为http://www.ubuntu.com&#xff0c;中文网站为http://http://www.ubuntu.org.cn edX的安装分为Production Stack, Developer Stack &#xff0c;安装说明英文文档在此…...

内部网站 备案/上海百度推广优化公司

1 item方法 想对比__getattr__(), __setattr__() 和 __deltattr__()这三个通过属性的方式的三个方法 还有__getitem__(), __setitem__() 和 __delitem__()这三个函数, 是通过字典形式来处理属性 字典形式使用中括号的方式获取值 在实现__setitem__()的时候仍然需要使用__dict__…...

软件公司网站模板/竞价排名点击

方案主要介绍F5 LTM设备构建手机银行缓存服务器的负载均衡群集。提高缓存手机银行服务可用性的同时&#xff0c;提供易于横向扩展的群集架构。采用irules和ihealth&#xff0c;实时获知后端服务器的运行和负载情况&#xff0c;并通过合理的算法和策略&#xff0c;将用户端的请求…...

做网站广告联盟赚钱/宁波seo网络推广咨询热线

mdev是busybox自带的一个简化版的udev。 作用是在系统启动和热插拔 或动态加载驱动程序时&#xff0c;自动产生驱动程序所需的节点文件&#xff0c;在文件系统中的/dev目录下的设备节点都是由mdev创建的 mdev扫描/sys/class和/sys/block中所有的类设备目录&#xff0c;如…...