后端输出二进制数据,前端fetch接受二进制数据,并转化为字符输出

在PHP中,你可以将字符串或其他数据类型转换为二进制数据,并通过HTTP响应发送给前端。

php 复制代码
<?php
//设置正确的Content-Type头部,以便前端可以正确处理二进制数据
header('Content-Type:application/octet-stream');
$str ="hello world!";
$binaryData=hex2bin(bin2hex($str));
echo $binaryData;
?>

在这个前端代码中,我们使用fetch API请求PHP脚本,并获取二进制数据。然后,我们将ArrayBuffer转换为字符串,以便在JavaScript中使用。

javascript 复制代码
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
        <title>测试后端输出二进制,前端接收二进制并转化为字符</title>
    </head>
    <body>
        <script>
            fetch('fetchArraybuffer.php',{
                method:'get'
            })
            .then((response)=>{
                if(response.ok && response.status===200)
                {
                    return response.arrayBuffer();
                }
                throw new Error('返回数据出错');
            })
            .then((data)=>{
                const decoder=new TextDecoder('utf-8');
                const decodeStr=decoder.decode(data);
                console.log(decodeStr);  
            })
            .catch((error)=>{
                console.log('连接后端出错',error);
            });
        </script>
    </body>
</html>
相关推荐
hboot2 分钟前
别再被 TS 类型冲突折磨了!一文搞懂类型合并规则
前端·typescript
在西安放羊的牛油果6 分钟前
浅谈 import.meta.env 和 process.env 的区别
前端·vue.js·node.js
鹏北海10 分钟前
从弹窗变胖到 npm 依赖管理:一次完整的问题排查记录
前端·npm·node.js
布列瑟农的星空11 分钟前
js中的using声明
前端
薛定谔的猫211 分钟前
Cursor 系列(2):使用心得
前端·ai编程·cursor
用户9047066835712 分钟前
后端问前端:我的接口请求花了多少秒?为啥那么慢,是你慢还是我慢?
前端
深念Y12 分钟前
仿B站项目 前端 4 首页 顶层导航栏
前端·vue·ai编程·导航栏·bilibili·ai开发
dragonZhang18 分钟前
基于 Agent Skills 的 UI 重构实践:从 Demo 到主题化界面的升级之路
前端·ai编程·claude
王林不想说话23 分钟前
提升工作效率的Utils
前端·javascript·typescript
weixin_584121431 小时前
vue内i18n国际化移动端引入及使用
前端·javascript·vue.js