问题

Ajax上传文件/照片时报错TypeError :Illegal invocation

解决

网上搜索问题,错误原因可能有以下几个,依次检查:

  1. 请求类型有误,如post请求,但在后台设置的是get请求
  2. 参数有误。 如没有传参,或是参数对应不上去
  3. File类型的参数被预先处理了
  4. 参见Ajax原理

检查后发现应该时原因3,故修改代码,设置$.ajax的processData: false:


getToken().then( res => {
console.log('获取七牛云token后上传图片')
if(!res.hasOwnProperty('data')) return
// 整理参数
var formData = new FormData()
formData.append('token', res.data)
formData.append('file', file)
$.ajax({
url: '',
type: 'POST',
contentType: 'multipart/form-data',
processData: false, // 增加这一行,不处理参数
data: formData,
success: function (result) {
console.log(result)
}
})
})

参考

  1. 使用AJAX实现文件上传时Illegal invocation错误
  2. jquery ajax报Uncaught TypeError :Illegal invocation

来源:https://segmentfault.com/a/1190000017832617

Ajax上传文件/照片时报错TypeError :Illegal invocation的更多相关文章

  1. jS Ajax 上传文件报错"Uncaught TypeError: Illegal invocation"

    使用jquery ajax异步提交文件的时候报Uncaught TypeError :Illegal invocation错误,报错信息如图: 错误原因: jQuery Ajax 上传文件处理方式,使 ...

  2. 打包新版本上传到AppStore时报错 ERROR ITMS-90034:

    今天打包新版本上传到AppStore时报错 ERROR ITMS-90034:"Missing or invalid signature.The bundle'com.xxx.xxx' at ...

  3. ajax上传文件及进度显示

    之前在博文:原生ajax写法就提及过ajax2.0与1.0的差别是多了FormData和利用FormData文件上传(当然还有跨域,但不是本文的重点). 那么具体怎么样实现ajax上传文件呢? 一般来 ...

  4. django系列6--Ajax05 请求头ContentType, 使用Ajax上传文件

    一.请求头ContentType ContentType指的是请求体的编码类型,常见的类型共有三种: 1.application/x-www-form-urlencoded 这应该是最常见的 POST ...

  5. ajax上传文件及nodeJS接收

    ajax文件上传需要用到FormData 官方介绍 FormData对象用以将数据编译成键值对,以便用XMLHttpRequest来发送数据.其主要用于发送表单数据,但亦可用于发送带键数据(keyed ...

  6. jQuery ajax上传文件实例

    jQuery ajax上传文件实例 <form id="form" enctype="multipart/form-data"><input ...

  7. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  8. springMVC+jsp+ajax上传文件

    工作中遇到的小问题,做个笔记 实现springMVC + jsp + ajax 上传文件 HTML <body> <form id="myform" method ...

  9. Ajax上传文件进度条显示

    要实现进度条的显示,就要知道两个参数,上传的大小和总文件的大小 html5提供了一个上传过程事件,在上传过程中不断触发,然后用已上传的大 小/总大小,计算上传的百分比,然后用这个百分比控制div框的显 ...

随机推荐

  1. Hbase与传统数据库的区别

    在说HBase之前,我想再唠叨几句.做互联网应用的哥们儿应该都清楚,互联网应用这东西,你没办法预测你的系统什么时候会被多少人访问,你面临的用户到底有多少,说不定今天你的用户还少,明天系统用户就变多了, ...

  2. springCloud 概念介绍

    微服务(Microservice) 那么首先介绍下微服务.微服务英文名称Microservice,Microservice架构模式就是将整个Web应用组织为一系列小的Web服务.这些小的Web服务可以 ...

  3. [转].NET Core配置文件加载与DI注入配置数据

    本文转自:http://www.cnblogs.com/skig/p/6079187.html .NET Core配置文件 在以前.NET中配置文件都是以App.config / Web.config ...

  4. centos6.3 配置防火墙,开启80端口、3306端口

    vi /etc/sysconfig/iptables -A INPUT -m state –state NEW -m tcp -p tcp –dport 80 -j ACCEPT(允许80端口通过防火 ...

  5. JavaSE之Java基础(1)

    1.为什么重写equals还要重写hashcode 首先equals与hashcode间的关系是这样的: 1.如果两个对象相同(即用equals比较返回true),那么它们的hashCode值一定要相 ...

  6. Eureka与ZooKeeper 的比较

    Eureka的优势 1.在Eureka平台中,如果某台服务器宕机,Eureka不会有类似于ZooKeeper的选举leader的过程:客户端请求会自动切换到新的Eureka节点:当宕机的服务器重新恢复 ...

  7. springmvc实现文件下载到Android手机设备pda端

    1:首先要添加相关得jar文件,在pom.xml中 <dependency> <groupId>commons-fileupload</groupId> <a ...

  8. LOJ#137. 最小瓶颈路 加强版(Kruskal重构树 rmq求LCA)

    题意 三倍经验哇咔咔 #137. 最小瓶颈路 加强版 #6021. 「from CommonAnts」寻找 LCR #136. 最小瓶颈路 Sol 首先可以证明,两点之间边权最大值最小的路径一定是在最 ...

  9. ps_cc:制作sprite拼贴图片

    我们的目标是: 将   合并为一张图片   step1:制作动作,便于批处理和重复使用 首先随便新建空白文档(建议:90x300px) 录制动作,alt+F9   上图中,可以新建分组前端,再新建动作 ...

  10. Linux 两组信号对比

    博客逐步迁移到,独立博客,原文地址 http://www.woniubi.cn/two_groups_signal_difference/ 之前看信号的时候,没有太注意不同信号的对比.今天再次看到的时 ...