小杨不掉发 2022-06-01 17:33 采纳率: 71.4%
浏览 129
已结题

express返回图片

为什么我返回图片给前端还是乱码

img

img

img


这是为什么呢，我的content-type是JPEG啊

  • 写回答

2条回答 默认 最新

  • Heerey525 前端领域新星创作者 2022-06-02 16:21
    关注

    后端这么写没问题，是对的
    前端接收到的是文档流的形式，需要规定ajax以blob形式接收，然后下载
    https://blog.csdn.net/m0_37687058/article/details/124177135
    https://zhuanlan.zhihu.com/p/502721718

    <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button onclick="downloadImage()">下载图片</button>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        function downloadImage() {
            const imageName = '1.png' // 下载图片名称
            $.ajax({
                url: 'http://localhost:3000/public/img/' + imageName,
                type: 'GET',
                xhrFields: {
                    responseType: 'blob' // 规定以blob形式接收
                },
                success: (res) => {
                    const a = document.createElement('a');
                    const blob = new Blob([res]);
                    const href = window.URL.createObjectURL(blob);
                    a.href = href;
                    a.download = imageName;
                    document.body.appendChild(a);
                    a.click();
                    document.body.removeChild(a);
                    window.URL.revokeObjectURL(href);
                }
            })
        }
    </script>
</body>

</html>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
  • 那个角落有个bug 2022-06-01 21:03
    关注

    既然用的express, 我建议定义静态资源文件路径，返给前端具体的图片完整路径

    评论
查看更多回答(1条)

报告相同问题？

问题事件

  • 系统已结题 6月14日
  • 已采纳回答 6月6日
  • 创建了问题 6月1日

悬赏问题

  • ¥30 宾馆客房管理系统可视化
  • ¥20 unity打光没有照亮物体
  • ¥25 powershell如何拷贝1周前的文件
  • ¥15 询问MYSQL查询SQLSERVER数据表并比较差异后，更新MYSQL的数据表
  • ¥15 关于#前端#的问题，请各位专家解答！
  • ¥15 最小生成树问题 Prim算法和Kruskal算法
  • ¥25 医院住院病人呼叫器设计
  • ¥15 不想和现在的团队合作了，怎么避免他们对程序动手脚
  • ¥20 C语言字符串不区分大小写字典排序相关问题
  • ¥15 关于#python#的问题：我希望通过逆向技术爬取1688搜索页下滑加载的数据