# 圖片塗黑與打碼 遮住不該被看到的部分

你遮住的那塊是從檔案裡刪掉的，不是藏在檔案裡。

> 把照片或截圖裡的姓名、地址、帳號遮住再存一份，被遮的畫素是從檔案裡沒了，不是壓在一個矩形下面。全程在瀏覽器裡跑。

本頁是一個完全在你的瀏覽器裡執行的互動式工具，地址是 https://abox.tools/zh-TW/redact-image/。你交給它的任何內容都不會被上傳。下面是這個頁面用文字對該工具的全部說明；要使用它，請開啟這個地址。

## 你的圖片**不會上傳**。這裡根本沒有伺服器。

解碼、塗改、重新寫出來，全由你自己的瀏覽器完成，用的是它本來就帶的編解碼器。這個工具沒有任何聯網功能，不取東西，也不發東西。這一點在這裡比在本站幾乎任何一頁都更要緊：送進打碼工具的圖片，正是那些姓名、地址、帳號還看得清楚的圖片。

- ✗ 不上傳
- ✗ 不註冊
- ✗ 無水印
- ✓ 斷網能用
- ✓ 開源

## 圖片怎麼塗黑，才能讓被遮住的那塊真的沒了

1. **選一張圖片。** 截圖、掃描檔或者照片都行，只要瀏覽器打得開。它直接從你的硬碟讀進來，這個過程裡沒有任何東西出去。
2. **在不該被看到的地方拉一個框。** 下一處再拉一個。框可以拖著移動，可以拉四周的把手改大小，也可以用 Tab 鍵選中再用方向鍵調整。框下面顯示的就是真實結果，畫它的正是稍後寫檔案的那段程式碼。
3. **在塗黑、打碼、模糊裡選一個，能選塗黑就選塗黑。** 塗成一片純色，什麼都不會留下。打碼和模糊只是把畫素換成它們自己的平均值，對付背景裡的人臉夠用，對付任何能讀成文字的東西不夠用。
4. **按「塗黑並儲存」，然後檢查檔案。** 之後顯示的那張圖，就是成品檔案被重新解碼出來的樣子。用編輯器開啟找找圖層，或者試著選中被遮住的文字：只有平平的一張圖，你遮住的地方在它被寫出來之前就已經被覆蓋了。

## 說得更細的版本

[圖片怎麼塗黑，才能讓被遮住的那塊真的沒了](https://abox.tools/zh-TW/guides/redact-an-image/): 大多數軟體畫出來的黑色方塊只是壓在圖片上面，隨手就能挪開。真正的塗黑和只是遮住差在哪裡，打過碼的文字為什麼能被讀回來，以及發出去之前怎麼檢查一個檔案。

## 工具箱裡還有

- [EXIF 檢視與清除](https://abox.tools/zh-TW/exif-editor/): 看看一張照片把你交代了多少，然後刪掉。
- [DICOM 閱片器](https://abox.tools/zh-TW/dicom-viewer/): CT、MR、X 光和超音波，連窗寬窗位、頭資訊和測量一起。
- [圖片轉 ICO](https://abox.tools/zh-TW/image-to-ico/): 進去一張圖，出來的是瀏覽器、Windows 和 Mac 各自要的每一個尺寸。
- [圖片轉 Data URI](https://abox.tools/zh-TW/image-to-data-uri/): 整張圖變成一行文字，直接貼進 CSS 或者 HTML。

## 常見問題

### 我的圖片會被上傳到什麼地方嗎？

不會。解碼、塗改、重新寫出來，都由你自己的瀏覽器在你自己的機器上完成。這個工具沒有任何聯網功能，不去取也不去送，頁面的 `Content-Security-Policy` 寫著它能聯絡的每一個地址，沒有一個是本站的。把頁面載入一次，然後斷網，它照樣能用。

### 被遮住的那塊，真的從檔案裡沒了嗎？

是的，這個工具就是為這一點存在的。圖片被解碼成一塊畫素緩衝區；框覆蓋掉框內的畫素；緩衝區再被編碼成一個新檔案。編碼器拿到任何東西之前，原來的數值已經不在記憶體裡了，所以沒有圖層可以藏，沒有註解可以刪，也沒有歷史可以撤銷。你可以像檢查別人說法那樣檢查它：把結果用影像編輯器開啟找第二個圖層，或者試著選中你遮掉的那段文字。

### 打過碼或者模糊過的地方能被還原嗎？

有時候能，這也是選之前唯一值得讀的一段。塗成純色，下面的一切都變成同一種顏色，什麼都不剩：邊緣不剩，平均值不剩，連有幾個字都不剩。打碼是把每一塊換成那一塊的平均色，而一格一格的平均值仍然是對下面內容的一次測量。對於常見字型、大小也猜得到的文字，已經有公開的研究把候選字串照同樣的方式渲染、打碼，再比對平均值，從而還原出原文。模糊是一次卷積，而卷積原則上可以反過來算。所以背景裡的人臉儘管打碼，凡是能讀成文字的都塗黑。

### 在文件軟體裡畫一個黑色矩形，為什麼不是一回事？

因為大多數軟體把那個矩形存在圖片旁邊，而不是存進圖片裡。在 PDF 閱讀器、投影片、文書處理軟體或者帶圖層的影像編輯器裡畫出來的形狀，是一個帶位置的物件，壓在頁面上面。把它挪開、刪掉，或者換一個程式開啟這個檔案，被它蓋住的東西就原樣回來了。報社、法院和政府部門都這樣釋出過檔案。這裡根本不儲存那個矩形，留下的只是寫在原來數值之上的畫素值。

### 它會不會一併去掉 EXIF 和 GPS 資訊？

會，順帶的。儲存的意思是把一塊畫滿畫素的畫布寫出來，而畫布不帶任何標籤，所以拍攝地點、相機型號、時間戳和內嵌縮圖根本不會被寫進新檔案。縮圖在這裡尤其要緊：它是圖片的第二份小副本，照片被編輯之後不一定會重新產生，一張塗黑過的照片帶著沒塗黑的縮圖出門，整件事就白做了。如果你只想去掉後設資料、又不想讓圖片被重新編碼，[EXIF 檢視與清除](https://abox.tools/zh-TW/exif-editor/)改寫的是容器本身。

### 它能讀能寫哪些格式？

凡是你的瀏覽器能解碼的它都能讀，實際上就是 JPEG、PNG、WebP、GIF、BMP，以及大多數當前瀏覽器上的 AVIF。寫出來的是 JPEG、PNG 和 WebP，因為瀏覽器內建的就是這三個編碼器。選「自動」時，JPEG 還是 JPEG，其餘一律 PNG，這樣照片保持照片的體積，截圖上沒被遮住的文字也保持清楚。這個選擇跟塗黑沒關係：編碼器看到它們的時候，那些畫素早就沒了。

### 不用滑鼠能做嗎？

能。「在中間加一個框」會放一個到圖上，Tab 鍵在框之間切換，方向鍵移動當前的框，Alt 加方向鍵改它的大小，按住 Shift 每步走十個畫素，Delete 鍵刪掉它。每個框在圖片下面還有一行，寫著大小、位置、它做什麼，以及一個刪除按鈕，所以整個工具都可以用鍵盤操作，也讀得出來。

### 手機上能用嗎？

能。拉框、移動和改大小走的是指標事件，不是滑鼠事件，所以手指的效果一樣，觸控屏上把手還會畫得更大一些。螢幕上的圖片在你操作時是按螢幕尺寸重畫的；檔案本身永遠是在你按下按鈕的那一刻，按原始解析度塗黑的。

### 免費嗎？要註冊嗎？

免費，沒有帳號、沒有登入、沒有試用期，也沒有水印。圖片大小也沒有上限，因為沒有哪臺伺服器在為它付錢，工作是在你自己的裝置上乾的。網站靠廣告養著，而廣告那邊拿不到任何關於你圖片的東西。

## 這條隱私承諾怎麼核實

- **你的圖片沒有地方可去。** 這個頁面能聯絡的每一個地址都寫在 Content-Security-Policy 裡，沒有一個是本站的。這裡不存在一個能收走你檔案的介面，程式碼裡也沒有哪一處會去送。
- **被遮的畫素在這裡就沒了，不是在出門的路上。** 圖片先解碼成一塊畫素緩衝區，框直接寫進這塊緩衝區，緩衝區再交給編碼器。這個頁面裡不存在一份把框當成單獨圖層的圖片，因為這樣的東西從來沒被造出來，見 `src/redact.js`。
- **這裡不去取任何東西。** `src/` 裡沒有 `fetch`，沒有 `XMLHttpRequest`，也沒有 `sendBeacon`。全部工作就是 `getImageData`、三個在位元組上跑的迴圈，以及 `canvas.toBlob`，都是瀏覽器裡本來就裝好的。
- **框的事不會報給任何地方。** 你在哪裡拉的框、拉了幾個、多大、選了哪一種，都只在這個頁面的記憶體裡，關掉就沒了。這個儲存庫裡沒有任何一個統計事件會帶走其中任何一項；下載之後彈出的那一個問題，送出去的只有一個贊成或反對和工具的名字。
- **斷網也能用。** 拔掉網線，工具照舊，因為它裡面本來就沒有聯網這一步。這是所有證明裡最簡單的一個，也是塗黑護照之前值得先做一次的那一個。

**你可以自己核對。**上面這些不用你信。這個頁面是儲存庫裡的模板和配置產生出來的，構建指令碼你能讀，也能自己跑一遍，跑出來的結果就提交在 `dist` 分支上。拿實際發給你的內容，跟你自己從原始碼構建出來的結果對一遍就知道了： https://github.com/A-Box-of-Tools/website

最值得先讀的幾個檔案：`config/site.toml` 裡是 Content-Security-Policy，覆蓋畫素的三個函式在 `src/redact.js`，螢幕上看到的東西為什麼是那三個函式畫的，在 `src/preview.js`。