我正在制作一個網(wǎng)站,從瀏覽器上傳圖像并將其存儲在服務器中。然而,有些圖像確實很重,我想調(diào)整它們的大小,使其大小變化不大,主要是為了減小存儲的所有圖像的大小。瀏覽器上的客戶端代碼如下(我使用 ReactJS 和 typescript)。我想使用瀏覽器代碼上可用的工具(不想安裝庫并且必須將所有 javascript 代碼捆綁到客戶端)我可以在服務器上調(diào)整它們的大小,但不想在服務器上使用更多的計算能力。有沒有辦法在客戶端調(diào)整它們的大小以減小其大?。课也幌胗胏anvas來重畫它們,主要目的是減小尺寸。 <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 關注
- 156 瀏覽
添加回答
舉報
0/150
提交
取消