前端开发——图片压缩、上传form表单提交踩坑

道丶幻梦

于 2020-11-19 12:01:14 发布

阅读量1.1k

点赞数

分类专栏：技术分享经验分享文章标签： javascript jquery

本文链接：https://blog.youkuaiyun.com/weixin_44052785/article/details/109804576

版权

在二开项目中，遇到实名认证接口要求图片大小不超过200K。尝试使用JavaScript和jQuery进行图片压缩，但发现压缩后的Blob无法替换到input file中。通过研究发现file类型的input值是只读的，因此采用将压缩后的Base64字符串作为新参数传递给后端。虽然目前采用折中方案，但仍期望能找到更优的解决方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近在靠山平台接手了一个二开项目，项目开发中，对接上传身份证实名认证的接口的时候，后端小哥说图片大小要限制在200K以下，当时心想那就压缩下图片呗，小问题，然后一言难尽。。。直接说一下踩坑和折中解决的方法吧，然后有对这个问题比较了解的大神希望能够给予指点。

项目接口采用的是form表单提交，上传图片是input的file，图片压缩后的blob没办法替换到file上，这就是遇到的问题了。

压缩图片的方法是百度的，粘过来方便有需要的朋友用。https://www.jb51.net/article/182078.htm

本来应该直接上代码的结果服务器炸了，没办法，先手敲吧，后面在改。

//HTML
<div>
    <form id="form">
        <input type="text" name="phone">
        <input type="text" name="code">
        <input type="text" name="name">
        <input type="hidden" name="card_z">

        //下面是原始file，form表单提交的card_z
        //<input type="file" name="card_z" onchange="card(this)">

最低0.47元/天解锁文章