IE9上传图片 json下载问题

2023-12-04 01:08

本文主要是介绍IE9上传图片 json下载问题,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

这东西,找的烧脑壳呦~

IE9上传图片需要前端后端配合,网上有很多方法,我这个是在github找的,地址放在下面,代码核心上传就是ajaxSubmit

加一句,【json下载】问题我这里只会在上传图片之后,后端返回【application/json】才会被IE9拦截后下载。

以及,看到这篇文章的人,应该已经知道IE9上file对象以及常用的那一堆方法不能用的事情了,我就不赘述了……

github地址:https://violay33.github.io/yyy-upload/

一.下面是根据他的代码做出的一些调整:

1.这两upload是要与调接口时候用的参数保持一致

 2.代码里【验证图片大小】这些都被我注释了,具体原因应该是IE或者IE9不支持某些方法

二.前端和后端需要做出什么调整

1.前端:

        ajaxSubmit里面有一条dataType,前端在IE9下上传时需要选用【html】或者【text】,后端的响应头类型,我让后端设置的是【text/html】,后端代码看第2条

我的前端dataType为 text 和 html 返回值:没什么不同

 ajaxSubmit代码:在yyy-upload.js里面,核心就是这个

tempForm.append('upload',opt.fileEle).ajaxSubmit({url: opts.url,type: "POST",timeout: 3000,dataType:"text",   // 是这里呦~success: function (data) {//将文件放回原位if (typeof opt.succCb !== 'undefined') {opt.succCb(data)}opt.fileEle.appendTo(opt.containerEle);tempForm.remove();},error: function (err) {if (typeof opt.failCb !== 'undefined') {opt.failCb(err)}opt.fileEle.appendTo(opt.containerEle);tempForm.remove();}
});

JQuery版本:

 <!-- jquery --> <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script><!-- jquery.form.js --><script src="https://cdn.bootcss.com/jquery.form/4.2.2/jquery.form.min.js"></script>

我的demo代码:和github示例好像一样→_→。。。

<template><div><div class="yyy-upload-box"></div></div>
</template><script>
export default {data () {return {obj: null,  }},methods: {},mounted () {$('.yyy-upload-box').imgUpload({immediatelyUpload: true,url: '/common/api/v1/file/uploadIE',maxSize: 0,imgType: ['gif', 'jpeg', 'jpg', 'png', 'bmp'],allowDrag: true,succCb:(data) => {console.log('前端html',data)}});},
}
</script><style></style>

PS:这里我用的是vue-cli4.x的vue框架,github上面下载的js和css文件我是直接丢public里和jquery一起引入了

2.后端(java):

其实我也看不懂java代码,但核心就是让java把上传图片接口的响应类型改成【text/html】,【text/plain】我就没试过了,但找资料看网上说这个也可以,不过懒得试了→_→。。。有一个能用就行

PS:文章来源找不到了,被我关标签页点x点的爽的时候顺手点掉了_(:з」∠)_,但总之就这一句,想办法让你后端加进去

 

三.杂谈

        这个是我做一个围绕富文本为核心的管理系统整出来的,当时客户问适配到IE9,我寻思,vue刚好能适配到IE9,我就答应了,那时候也没做过IE的适配,没想到,这么多问题。

        诶,千言万语汇成一句话,能不适配IE9以下就别适配,能不适配IE就不适配,作为必将被淘汰的IE(我也不知道是我先被淘汰还是IE先被淘汰_(:з」∠)_),诶……词穷了,IE别怪我,毕竟适配你真的还是蛮难受的……

        最后就是那个【IE9下富文本上传图片】,最后也没整出来,毕竟大概率是需要动富文本源码的事儿,简单试了试不行,就想还是算了吧,没那本事。

          以后要还有谁让我适配IE,我就一拳……捶我脑壳上,然后边适配边哭给他看

         TM怎么会有IE呢,诶我TM真是日了狗了,主要因为我写这篇文章的时候,那边IE和IE9还有一堆bug在等我修,诶woc啊啊啊啊啊啊啊!!!!!

 

 

参考链接:

github地址:https://violay33.github.io/yyy-upload/

 

 

 

这篇关于IE9上传图片 json下载问题的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/451551

相关文章

Kotlin Map映射转换问题小结

《KotlinMap映射转换问题小结》文章介绍了Kotlin集合转换的多种方法,包括map(一对一转换)、mapIndexed(带索引)、mapNotNull(过滤null)、mapKeys/map... 目录Kotlin 集合转换:map、mapIndexed、mapNotNull、mapKeys、map

nginx中端口无权限的问题解决

《nginx中端口无权限的问题解决》当Nginx日志报错bind()to80failed(13:Permissiondenied)时,这通常是由于权限不足导致Nginx无法绑定到80端口,下面就来... 目录一、问题原因分析二、解决方案1. 以 root 权限运行 Nginx(不推荐)2. 为 Nginx

解决1093 - You can‘t specify target table报错问题及原因分析

《解决1093-Youcan‘tspecifytargettable报错问题及原因分析》MySQL1093错误因UPDATE/DELETE语句的FROM子句直接引用目标表或嵌套子查询导致,... 目录报js错原因分析具体原因解决办法方法一:使用临时表方法二:使用JOIN方法三:使用EXISTS示例总结报错原

Windows环境下解决Matplotlib中文字体显示问题的详细教程

《Windows环境下解决Matplotlib中文字体显示问题的详细教程》本文详细介绍了在Windows下解决Matplotlib中文显示问题的方法,包括安装字体、更新缓存、配置文件设置及编码調整,并... 目录引言问题分析解决方案详解1. 检查系统已安装字体2. 手动添加中文字体(以SimHei为例)步骤

Spring Boot 结合 WxJava 实现文章上传微信公众号草稿箱与群发

《SpringBoot结合WxJava实现文章上传微信公众号草稿箱与群发》本文将详细介绍如何使用SpringBoot框架结合WxJava开发工具包,实现文章上传到微信公众号草稿箱以及群发功能,... 目录一、项目环境准备1.1 开发环境1.2 微信公众号准备二、Spring Boot 项目搭建2.1 创建

SpringSecurity整合redission序列化问题小结(最新整理)

《SpringSecurity整合redission序列化问题小结(最新整理)》文章详解SpringSecurity整合Redisson时的序列化问题,指出需排除官方Jackson依赖,通过自定义反序... 目录1. 前言2. Redission配置2.1 RedissonProperties2.2 Red

nginx 负载均衡配置及如何解决重复登录问题

《nginx负载均衡配置及如何解决重复登录问题》文章详解Nginx源码安装与Docker部署,介绍四层/七层代理区别及负载均衡策略,通过ip_hash解决重复登录问题,对nginx负载均衡配置及如何... 目录一:源码安装:1.配置编译参数2.编译3.编译安装 二,四层代理和七层代理区别1.二者混合使用举例

SQL server数据库如何下载和安装

《SQLserver数据库如何下载和安装》本文指导如何下载安装SQLServer2022评估版及SSMS工具,涵盖安装配置、连接字符串设置、C#连接数据库方法和安全注意事项,如混合验证、参数化查... 目录第一步:打开官网下载对应文件第二步:程序安装配置第三部:安装工具SQL Server Manageme

基于Python实现一个图片拆分工具

《基于Python实现一个图片拆分工具》这篇文章主要为大家详细介绍了如何基于Python实现一个图片拆分工具,可以根据需要的行数和列数进行拆分,感兴趣的小伙伴可以跟随小编一起学习一下... 简单介绍先自己选择输入的图片,默认是输出到项目文件夹中,可以自己选择其他的文件夹,选择需要拆分的行数和列数,可以通过

怎样通过分析GC日志来定位Java进程的内存问题

《怎样通过分析GC日志来定位Java进程的内存问题》:本文主要介绍怎样通过分析GC日志来定位Java进程的内存问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录一、GC 日志基础配置1. 启用详细 GC 日志2. 不同收集器的日志格式二、关键指标与分析维度1.