使用jQuery將本地MP3文件發送到API服務器

Question

我希望使用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"

我已經閱讀了curl文檔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進行此操作。 如果有人能對此有所啟示，將不勝感激。 請原諒我的無知。

Answer 1

cURL使用@前綴表示“命名文件的內容”，在AJAX請求中，您將@tambourineMan.mp3作為原義字符串發送。

一種簡單的完成任務的方法是在文件中輸入文件，並告訴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"
});

看看的的FileReader API ，並在該文章關於發送和接收二進制數據XMLHttpRequest