使用jquery将本地mp3文件发送到api服务器

时间:2015-03-23 10:13:59

标签: javascript jquery json curl

我希望使用echoprint - http://echoprint.me/start - 它允许我在发布请求中从我的计算机本地发送一个mp3文件,并从他们的服务器返回一个json对象,包括歌曲的详细信息。

我正在尝试使用jquery发出此帖子请求,以便允许我检索包含歌曲详细信息的json对象,然后允许我在浏览器的控制台中查看此内容。

echoprint网站 - http://developer.echonest.com/docs/v4/track.html - 解释了如何使用curl发布此帖子请求。以下代码适用于命令行。这将返回一个json对象,但是会在终端中返回。

curl -F "api_key=#############" -F "filetype=mp3" -F "track=@tambourineMan.mp3" "http://developer.echonest.com/api/v4/track/upload"

我已经阅读了卷曲文档http://curl.haxx.se/docs/httpscripting.html#POST来尝试理解curl和jquery之间存在相关性的位置,但不幸的是,我在解决这两个问题时遇到了困难并且理解-F的含义。

我的目标是使用jquery发出这个帖子请求,这样我就可以使用上面的curl提出相同的请求,并在浏览器的控制台中检索json数据。

从我上面提到的上一个问题我已经尝试采用该答案中的逻辑并使用以下代码,但是这会返回一个错误,即文件无法编码。我已尝试使用和未指定内容类型,但两种方法都失败。

   $.post("http://developer.echonest.com/api/v4/track/upload", {
              "api_key":"##################",
              "track":"@tambourineMan.mp3",
              "filetype":"mp3",
              "contentType:" "application/octet-stream"
          },
          function( data ) {
                  console.log(data)
          },
          "JSON" );

这里有说明http://developer.echonest.com/docs/v4/track.html,但他们只解释了如何使用curl执行此操作。如果有人能够对此有所了解,我将不胜感激。请原谅我的无知。

1 个答案:

答案 0 :(得分:1)

cURL使用@前缀表示“指定文件的内容”,在您发送@tambourineMan.mp3作为文字字符串的AJAX请求中。

完成任务的一个简单方法是在文档中放置文件输入,并告诉jQuery使用该文件中的数据:

var file = document.getElementById('myFileInput').files[0];
$.post("http://developer.echonest.com/api/v4/track/upload", {
    "api_key":"##################",
    "track":file,
    "filetype":"mp3",
    "contentType:" "application/octet-stream"
});

查看有关XMLHttpRequest

中发送和接收二进制数据的FileReader APIthis文章