Mengapa pemprosesan imej dalam pelayar ialah kemenangan untuk privasi
Bagaimana API web moden membolehkan anda membina alat imej yang benar-benar peribadi — dan maknanya untuk orang yang menggunakannya.
Jadual kandungan
- Jangkaan lalai itu salah
- Maksud sebenar "sisi klien"
- Mengapa ini penting dalam amalan
- Di mana pertukaran nilainya masih wujud
- Permulaan sejuk lebih berat
- Perkakasan pengguna menetapkan had tertinggi
- Anda tidak boleh melakukan batch merentas pengguna
- Sesetengah operasi memerlukan pelayan
- Satu perkara etika kecil
- Ke mana selepas ini
Jangkaan lalai itu salah
Sepanjang hampir dua puluh tahun yang lalu, melakukan apa-apa yang bukan remeh dengan imej di web biasanya bermaksud memuat naiknya ke pelayan. Menukar foto HEIC, membuang metadata EXIF, menjana favicon — setiap alat itu secara sejarahnya berada di sebalik borang multipart. Pengguna mengklik upload, fail bergerak merentasi internet awam, dan pelayan di suatu tempat melakukan kerjanya.
Lalai itu tidak lagi diperlukan dari segi teknikal. Pelayar telah menghantar API beberapa tahun lalu yang membolehkan keseluruhan pipeline berjalan secara setempat:
<canvas>andOffscreenCanvasuntuk kerja pada tahap pikselcreateImageBitmap()untuk penyahkodan pantas di luar thread utamaFileandBlobuntuk membaca muat naik tanpa menghantarnya ke mana-mana- WebAssembly untuk pustaka seperti libheif, libwebp and ffmpeg
- Web Workers untuk memastikan UI kekal responsif semasa kerja berat berjalan
Jika anda menggabungkannya, fail tidak pernah meninggalkan peranti. Pelayan tidak pernah melihatnya. Tiada apa-apa untuk dilog, tiada apa-apa untuk bocor, tiada apa-apa untuk disepina.
Maksud sebenar "sisi klien"
Perlu tepat di sini, kerana salinan pemasaran pada banyak alat "peribadi" agak longgar.
Sesuatu alat benar-benar bersifat sisi klien apabila, selepas halaman dimuatkan, tiada bahagian kandungan fail pernah bergerak ke pelayan. Halaman itu sendiri dimuatkan daripada pelayan (HTML, JavaScript, mungkin modul WebAssembly). Selepas itu, fail anda masuk ke memori pelayar dan kekal di sana sehingga anda menutup tab.
Sesuatu alat bukan sisi klien jika ia:
- melakukan POST fail ke endpoint
/api/... - Menghantar thumbnail atau pratonton ke pelayan
- Memanggil endpoint analitik dengan metadata fail (dimensi, nama, hash)
- Menghalakan fail melalui CDN pihak ketiga yang mengembalikan URL yang telah diproses
Panel rangkaian dalam devtools pelayar anda ialah penentu kebenaran. Buka panel itu, lepaskan fail, dan semak apa yang dimuat naik. Jika anda melihat nama fail atau saiz fail anda terbang keluar, alat itu tidak seperibadi yang didakwanya.
Mengapa ini penting dalam amalan
Tiga kumpulan orang mendapat manfaat secara senyap apabila pemprosesan imej berpindah ke dalam pelayar.
Wartawan, aktivis dan penyelidik mengendalikan bahan sumber yang boleh menjadi berbahaya jika bocor. Metadata EXIF boleh merangkumi koordinat GPS daripada peranti yang mengambil foto tersebut. Pembuang EXIF sisi pelayar bermaksud fail asal tidak pernah melintasi rangkaian.
Syarikat yang tertakluk kepada peraturan — penjagaan kesihatan, kewangan, perundangan — jika tidak, perlu ada perjanjian pemprosesan data dengan pihak yang menjalankan alat tersebut. Halaman statik yang melakukan kerja secara setempat tidak memerlukan DPA untuk ditandatangani kerana tiada pemproses.
Semua orang lain mendapat manfaat yang jelas: pusingan kerja lebih pantas (tiada masa muat naik), tiada had saiz fail yang ditetapkan oleh bil pengehosan, tiada kegagalan apabila pelayan tidak berfungsi.
Di mana pertukaran nilainya masih wujud
Sisi klien bukan sihir. Ada kos sebenar yang perlu anda fikirkan sebelum memilihnya untuk sesuatu masalah.
Permulaan sejuk lebih berat
Bundle WebAssembly untuk penyahkodan HEIC bersaiz beberapa ratus kilobait. ffmpeg yang dikompil kepada WASM bersaiz beberapa megabait. Lawatan pertama membayar kos itu. Caching membantu, dan code-splitting lebih membantu — hanya muatkan codec yang benar-benar dipilih oleh pengguna.
Perkakasan pengguna menetapkan had tertinggi
Fail RAW 200 megapiksel akan kehabisan memori pada telefon bajet jauh sebelum ia kehabisan pada pelayan. Bersikap jujur dalam UI tentang perkara yang realistik pada peranti.
Anda tidak boleh melakukan batch merentas pengguna
Pemprosesan sisi pelayan boleh menyahduplikasi dan mengagihkan kos. Jika sejuta pengguna menukar imej stok yang sama, pelayan boleh memprosesnya sekali. Sisi klien melakukannya sejuta kali. Untuk kebanyakan beban kerja alat peribadi, ini tidak menjadi masalah — kerja itu memang unik — tetapi ia wajar diketahui.
Sesetengah operasi memerlukan pelayan
Carian imej terbalik memerlukan indeks. Penyederhanaan kandungan memerlukan model yang terlalu besar untuk dihantar. Apa-apa yang membandingkan fail anda dengan korpus yang bukan milik anda memerlukan backend.
Satu perkara etika kecil
Jika alat anda benar-benar bersifat sisi klien, nyatakannya dengan jelas dan buktikan. Pautkan kepada sumber, tunjukkan panel rangkaian, terangkan apa yang berjalan di mana. Frasa seperti "kami tidak menyimpan data anda" tidak bermakna tanpa seni bina yang menyokongnya — setiap alat sisi pelayan yang pernah membocorkan data pelanggan juga mengatakan perkara yang sama, dan memang memaksudkannya pada masa itu.
Sebaliknya juga benar. Jika alat anda memang sisi pelayan, jangan berpura-pura sebaliknya. Pengguna sudah mula mengenali coraknya, dan kehilangan kepercayaan apabila mereka menangkap anda adalah kekal.
<!-- tool-cta:start -->
💡 Cuba ini: Lihat pemprosesan sisi klien beraksi dengan Image Compressor, yang mengecilkan imej sepenuhnya dalam pelayar anda supaya tiada apa-apa pun pernah dimuat naik ke pelayan.
<!-- tool-cta:end -->
Ke mana selepas ini
Jika anda membina utiliti imej kecil hari ini, jadikan sisi klien sebagai lalai dan hanya gunakan pelayan apabila anda mempunyai sebab yang konkrit. Pelayar akan mengejutkan anda dengan sejauh mana ia mampu memikul kerja tersebut — dan orang di hujung satu lagi sambungan rangkaian akan berterima kasih secara senyap untuk bait yang tidak pernah meninggalkan mesin mereka.


