我正在制作一个网站,从浏览器上传图像并将其存储在服务器中。然而,有些图像确实很重,我想调整它们的大小,使其大小变化不大,主要是为了减小存储的所有图像的大小。浏览器上的客户端代码如下(我使用 ReactJS 和 typescript)。我想使用浏览器代码上可用的工具(不想安装库并且必须将所有 javascript 代码捆绑到客户端)我可以在服务器上调整它们的大小,但不想在服务器上使用更多的计算能力。有没有办法在客户端调整它们的大小以减小其大小?我不想用canvas来重画它们,主要目的是减小尺寸。 <input type="file" accept="image/*" onChange={async (ev) => { if (ev && ev.target && ev.target.files) { const formData = new FormData(); formData.append("file", ev.target.files[0], "file.jpg"); if(imageHTMLComponent) { const imageReader = new FileReader(); imageReader.onload = (ev) => { if( ev.target && typeof ev.target.result === "string") { test.setAttribute('src', ev.target.result); } } imageReader.readAsDataURL(ev.target.files[0]); const response = await fetch(`https://localhost:8000/test?token=${encodeURI('hello')}&picture=1`, { } } Preview of the image: <img ref={(ref) => {setImageHTMLComponent(ref)}} />
目前暂无任何回答
- 0 回答
- 0 关注
- 119 浏览
添加回答
举报
0/150
提交
取消