div中的标题（“Content-Type：audio / mpeg”）

Question

我有一个文件speakWord.php：

<?php
header("Content-Type: audio/mpeg");
$voice = file_get_contents('http://translate.google.com/translate_tts?tl=' . urlencode($_POST['language']) . '&q=' . urlencode($_POST['word']) . '');
?>

<audio controls="controls" autoplay>
    <source src="<?php echo $voice; ?>"  />
</audio>

现在我想使用jquery加载这个mp3文件的结果并将其输出到div中：

$("#speakWord")
.load("speakWord.php", {
    language: "nl",
    word: "test"
});

当我检查div的来源时，它会变成奇怪的东西：

<source src="��@��#a�F(��y2i���Ǵ1�L A�@���'!D����΂��8" �="">

我认为在装入div时，speakWord.php中的标题信息丢失了，我想我错过了一个部分..

Answer 1

如果您真的必须通过脚本代理它（如果有任何Google API身份验证令牌），则将二进制数据打包为base64 data: src=属性的URL。

<?php
   // Content-Type for whole PHP output remains text/html 
   $voice = file_get_contents('http://translate.google.com/translate_tts?tl=' . urlencode($_POST['language']) . '&q=' . urlencode($_POST['word']) . '');
?>
<audio controls="controls" autoplay>
    <source src="data:audio/mpeg;base64,<?php echo base64_encode($voice); ?>"  />
</audio>

然而，这是一个更大的转移。

已经给出的实际答案是您应该分离内容类型。 您的脚本应仅返回音频数据，而不是混合的html和二进制内容。 本质上它应该只是：

<?php
  header("Content-Type: audio/mpeg");
  readfile('http://translate.google.com/translate_tts?tl=' . urlencode($_POST['language']) . '&q=' . urlencode($_POST['word']) . '');
?>

所以你必须通过jQuery构建<audio>标签（加载它的ajax）：

$("#speakWord")
.html("<audio... src='speakWord.php?language=nl&word=test'></audio>");

所以这个src=属性从speakWord脚本中检索输出，然后从translate服务中提取它。

Answer 2

src=意味着指向一个URL，而不是用二进制数据填充。

你必须要么

• 使用适当的标头发送二进制数据
• 或者发送一个HTML片段，引用（但不包含 ）二进制数据。

不是两个在同一时间。