layui上传文件弹出请求上传接口出现异常的终极解决方案(v2.68版本、ajax底层逻辑修改、debug快速定位)

简介: layui上传文件弹出请求上传接口出现异常的终极解决方案(v2.68版本、ajax底层逻辑修改、debug快速定位)

项目说明

  • layui版本 v2.68;
  • 报错:请求上传接口出现异常;

原因说明

请求上传接口出现异常,基本上都是返回的参数,不是标准的json格式导致的。但是在上传文件的过程中,无法具体到时哪个环节导致的。

在layui的封装压缩js文件中,只做了错误提示,未将具体的原因,进行展示。在开发debug调试中,无法快速定位。


解决方案

1.打开layui.js压缩文件

2.搜索请求上传接口出现异常提示信息


请求上传接口出现异常,在layui中是无法直接搜索到的,layui进行unicode编码;

\u8bf7\u6c42\u4e0a\u4f20\u63a5\u53e3\u51fa\u73b0\u5f02\u5e38转换中文:请求上传接口出现异常

定位至改代码处:

error:function(){n++,a.msg("\u8bf7\u6c42\u4e0a\u4f20\u63a5\u53e3\u51fa\u73b0\u5f02\u5e38"),m(e),u()}};

这个里ajax典型的错误返回机制。

3.输出错误信息

error:function(err){
var dd=err.responseText.replace(/<\/?.+?>/g,"");
var text=dd.replace(/ /g,"");
n++,a.msg("\u8bf7\u6c42\u4e0a\u4f20\u63a5\u53e3\u51fa\u73b0\u5f02\u5e38"+text),m(e),u()}};


出现具体的错误提示

补充知识

Unicode字符编码

Unicode是一种字符编码标准,它为世界上几乎所有的字符(包括字母、数字、标点符号、表情符号和特殊字符)分配了一个唯一的数值标识,用于在计算机中表示和处理文本。


Unicode使用16进制表示每个字符的标识值,通常以前缀U+开头,例如U+0041表示大写字母"A"。Unicode标准定义了超过130,000个字符的编码。


你可以在网上找到Unicode字符编码表,以了解每个字符的Unicode编码值。例如,U+1F600表示笑脸表情符号😀。


在编程中,可以使用转义序列\u后跟4个十六进制数字来表示Unicode字符。例如,\u0041表示字符"A"。


在不同的编程语言中,可能会提供一些内置函数或方法来处理Unicode编码的转换、转义和操作。例如,在JavaScript中,可以使用String.fromCharCode()将Unicode编码转换为对应的字符,或者使用charCodeAt()获取字符的Unicode编码值。


总之,Unicode使得在计算机中处理和表示各种字符集变得简单和统一,使得不同国家和文化之间的文字交流成为可能。


@漏刻有时

相关文章
|
14天前
|
XML 前端开发 JavaScript
|
1月前
|
JSON JavaScript 前端开发
《进阶篇第6章:vue中的ajax》包括回顾发送ajax请求方式、vue-cli脚手架配置代理服务器、vue-resource
《进阶篇第6章:vue中的ajax》包括回顾发送ajax请求方式、vue-cli脚手架配置代理服务器、vue-resource
57 22
|
1月前
|
前端开发 JavaScript
回顾前端页面发送ajax请求方式
回顾前端页面发送ajax请求方式
37 18
|
1月前
|
前端开发 JavaScript Java
第6章:Vue中的ajax(包含:回顾发送ajax请求方式、vue-cli脚手架配置代理服务器)
第6章:Vue中的ajax(包含:回顾发送ajax请求方式、vue-cli脚手架配置代理服务器)
53 4
|
1月前
|
前端开发 JavaScript 数据处理
JQuery 拦截请求 | Ajax 请求拦截
【10月更文挑战第4天】
85 1
|
2月前
|
前端开发
React技术栈-react使用的Ajax请求库实战案例
这篇文章介绍了在React应用中使用Axios和Fetch库进行Ajax请求的实战案例,展示了如何通过这些库发送GET和POST请求,并处理响应和错误。
54 10
React技术栈-react使用的Ajax请求库实战案例
|
2月前
|
前端开发
React技术栈-react使用的Ajax请求库用户搜索案例
这篇文章展示了一个React技术栈中使用Ajax请求库(如axios)进行用户搜索的实战案例,包括React组件的结构、状态管理以及如何通过Ajax请求获取并展示GitHub用户数据。
33 7
React技术栈-react使用的Ajax请求库用户搜索案例
|
2月前
|
JSON JavaScript 前端开发
Jquery常用操作汇总,dom操作,ajax请求
本文汇总了jQuery的一些常用操作,包括DOM元素的选择、添加、移除,表单操作,以及如何使用jQuery发送Ajax请求,涵盖了GET、POST请求和文件上传等常见场景。
|
2月前
|
JSON 资源调度 JavaScript
Vue框架中Ajax请求的实现方式:使用axios库或fetch API
选择 `axios`还是 `fetch`取决于项目需求和个人偏好。`axios`提供了更丰富的API和更灵活的错误处理方式,适用于需要复杂请求配置的场景。而 `fetch`作为现代浏览器的原生API,使用起来更为简洁,但在旧浏览器兼容性和某些高级特性上可能略显不足。无论选择哪种方式,它们都能有效地在Vue应用中实现Ajax请求的功能。
42 4
|
4月前
|
XML 前端开发 JavaScript
JavaScript进阶 - AJAX请求与Fetch API
【7月更文挑战第9天】JavaScript进阶:AJAX与Fetch API对比。AJAX用于异步数据交换,XMLHttpRequest API复杂,依赖回调。Fetch API是现代、基于Promise的解决方案,简化请求处理。示例:`fetch(&#39;url&#39;).then(r =&gt; r.json()).then(data =&gt; console.log(data)).catch(err =&gt; console.error(err))`。注意点包括检查HTTP状态、错误处理、CORS、Cookie和超时。Fetch提高了异步代码的可读性,但需留意潜在问题。
101 0