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

Question

假设我有一个 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？

Answer 1

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

然后我需要将 base64 直接转换为 ArrayBuffer。我发现了这个小 gem ( 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;

?>