如何将原始二进制数据从 PHP 脚本传递到 JavaScript ArrayBuffer？答案

【问题标题】：How can I pass raw binary data from a PHP script to a JavaScript ArrayBuffer?如何将原始二进制数据从 PHP 脚本传递到 JavaScript ArrayBuffer？
【发布时间】：2016-10-11 11:19:37
【问题描述】：

假设我有一个 PHP 脚本，其中包含一堆二进制数据，需要在 JavaScript 客户端进行处理。

<?php
$binary_data = file_get_contents( "file.data" );
?>

我有一个 JavaScript 函数，旨在从 ArrayBuffer 处理它：

<script type="text/javascript">
function processData( arrayBuffer ) {
...
}
</script>

直接传递它是行不通的，因为它是二进制数据，所以这行不通：

<?php

$binary_data = file_get_contents( "file.data" );

echo <<<EOF

<script type="text/javascript">

var binaryData = '{$binary_data}';

processData( binaryData );

function processData( arrayBuffer ) {
...
}
</script>

EOF;

?>

如何在单页加载中将 PHP 变量 $binary_data 传递给 JavaScript 变量 ArrayBuffer？

【问题讨论】：

标签： javascript php

【解决方案1】：

我刚刚将数据转换为 base64，然后在我的代码中使用它。我想也许我也可以直接创建一个数组缓冲区并用数字字节对其进行初始化，但这最终会在 HTML 中变得更长。根据这篇文章 (Base64: What is the worst possible increase in space usage?)，我认为 base64 将是“最便宜”的字节数。

然后我需要将 base64 直接转换为 ArrayBuffer。我找到了这个小宝石 (https://gist.github.com/borismus/1032746)，我对它做了一些修改。

最终代码（根据原文）：

<?php

$binary_data = base64_encode( file_get_contents( "file.data" ) );

echo <<<EOF

<script type="text/javascript">

var binaryData = base64ToArrayBuffer( '{$binary_data}' );

processData( binaryData );

/**
 * Process the binary data ArrayBuffer
 */
function processData( arrayBuffer ) {
...
}

/**
 * Convert a base64 string to an ArrayBuffer
 */
function base64ToArrayBuffer( base64 ) {
    var raw = window.atob( base64 );
    var rawLength = raw.length;
    var array = new Uint8Array( new ArrayBuffer(rawLength) );

    for( i = 0; i < rawLength; i++ ) {
        array[ i ] = raw.charCodeAt( i );
    }
    return( array.buffer );
}

</script>

EOF;

?>

【讨论】：