jQuery Post blob 对象给出 Uncaught TypeError: Illegal invocation

Posted

技术标签:

【中文标题】jQuery Post blob 对象给出 Uncaught TypeError: Illegal invocation【英文标题】:jQuery Post blob object gives Uncaught TypeError: Illegal invocation 【发布时间】:2016-06-22 16:44:53 【问题描述】:

我正在尝试使用 jQuery post 发布文件,并获取 TypeError: Illegal invocation

function fbUpload(token)
  var dataURL = canvas.toDataURL('image/jpeg', 1.0)
  var blob = dataURItoBlob(dataURL)

  $.post( "https://graph.facebook.com/me/photos", 
    'access_token': token,
    'source': blob
  , function( data ) 
    console.log(data);
  );

可能是因为“blob”吗?

这工作正常:

function fbUpload(token)
  var dataURL = canvas.toDataURL('image/jpeg', 1.0)
  var blob = dataURItoBlob(dataURL)
  var formData = new FormData()
  formData.append('access_token', token)
  formData.append('source', blob)

  var xhr = new XMLHttpRequest();
  xhr.open( 'POST', 'https://graph.facebook.com/me/photos', true )
  xhr.onload = xhr.onerror = function() 
    console.log( xhr.responseText )
  ;
  xhr.send( formData )

【问题讨论】:

您需要使用$.ajax并将FormData对象提供给data参数。 试过$.post( "https://graph.facebook.com/me/photos", formData ...得到同样的错误 jsfiddle.net/ilyador/pLxpyvc8/1 【参考方案1】:

您需要使用$.ajax 并将FormData 对象提供给data 参数。 $.post 只将数据作为字符串或普通对象。试试这个:

function fbUpload(token)
    var dataURL = canvas.toDataURL('image/jpeg', 1.0)
    var blob = dataURItoBlob(dataURL)
    var formData = new FormData()
    formData.append('access_token', token)
    formData.append('source', blob)

    $.ajax(
        url: "https://graph.facebook.com/me/photos", 
        type: 'POST',
        data: formData,
        processData: false,
        contentType: false,
        success: function(data) 
            console.log(data);
        
    );

【讨论】:

contentType: false 阻止 $.ajax 设置内容类型标头。这将允许底层 xmlhttprequest 将内容类型设置为具有正确 boundary 的多部分表单数据

以上是关于jQuery Post blob 对象给出 Uncaught TypeError: Illegal invocation的主要内容,如果未能解决你的问题,请参考以下文章

使用 POST 表单发送 Blob 对象

Jquery Ajax post方法给出空值

React Native(Expo)文件对象与 Javascript(jQuery)文件对象 - Blob/文件大小不同(YouTube 数据 API)

JQuery Post到NodeJS返回MySQL值给出未定义?

Jquery POST在spring mvc中给出403禁止错误

利用 jQuery-photoClip插件 实现移动端裁剪功能并以Blob对象上传