如何在 JavaScript ajax 调用中从 PHP passthru 获取二进制数据？

Posted 2023-02-25

【中文标题】如何在 JavaScript ajax 调用中从 PHP passthru 获取二进制数据？

【英文标题】：How can I get binary data from PHP passthru in JavaScript ajax call?

【发布时间】：2016-03-18 19:33:18

【问题描述】：

我想用 javascript 从服务器获取音频文件并播放它。但是我的代码中的 ajax 调用似乎从来没有回调，我也不确定我是否正确处理了 JavaScript 中的音频。

以下 php 文件返回服务器上的音频文件：

<?php
  header('Access-Control-Allow-Origin: *');
  $name = './audiofiles/audio.wav';
  $fp = fopen($name, 'rb');
  header("Content-Type: binary");
  header("Content-Length: " . filesize($name));
  fpassthru($fp);
  exit;
?>

使用 ajax 从 JavaScript 调用脚本，并在浏览器中重放返回的音频数据（至少应该是这样）：

function playSample(e,q) 
  console.log("requesting audio from server")
  $.ajax(
    url: "https://audioserver.com/getaudio.php",
    type: "GET",
    dataType: "arraybuffer",
    processData: false,
    success: function(result)
      console.log("received audio, starting to play now")
      var buffers = result;
      var newSource = audioContext.createBufferSource();
      var newBuffer = audioContext.createBuffer( 2, buffers[0].length, 16000 );
      newBuffer.getChannelData(0).set(buffers[0]);
      newSource.buffer = newBuffer;
      newSource.connect( audioContext.destination );
      newSource.start(0);
    
  );

我在这里做错了什么？

【参考方案1】：

jQuery ajax 不支持类型化响应，因此您将在成功回调中获取文本。

您可以使用纯 XMLHTTPRequest 获取二进制响应

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function()
    if (this.readyState == 4 && this.status == 200)
        //this.response is the array buffer for you to manipulate
    

xhr.open('GET', 'https://audioserver.com/getaudio.php');
xhr.responseType = 'arraybuffer';
xhr.send();      

还有一个插件可以修补 jquery 以支持它https://github.com/acigna/jquery-ajax-native

您的音频处理代码也看起来不正确。 buffers[0] 没有意义，因为数组缓冲区没有数字属性

【讨论】：

我根据您的建议调整了我的代码，现在我收到一个错误，即音频无法解码。任何想法如何解决这个问题？在@Musa 上方查看我的编辑

@user2212461 请不要完全改变问题。你可以做两件事之一。 1. 提出一个新问题或 2. 在问题底部添加一个编辑部分，其中包含您所做的更改。

在这里添加了我的后续问题：***.com/questions/36093768/…@Musa