WindowsでZIPの文字化けを検証・Mac環境なしで試せる解凍方法まとめ
作成したFigmaプラグインで画像をZIP形式でエクスポートした際、日本語ファイル名が文字化けする問題に遭遇しました。
制作環境はWindowsで複数のツールで解凍を試すとツールによって文字化けしたりしなかったり...
またMac環境がないために完全な動作検証ができない状況でした。
そこで、Windows環境でできる限りの検証方法を試し、どのツールなら正しく解凍できるのか、またMacでの解凍結果を推測できる方法を探してみました。
ZIP解凍時の文字化けとは？
ZIPファイルは圧縮時の文字エンコーディングが環境によって異なるため、特に日本語ファイル名を含むZIPを異なるOSで解凍すると文字化けが発生することがあります。
Windowsの標準エクスプローラーはShift-JISベースの処理を行うため、UTF-8でエンコードされたZIPファイルを正しく扱えない場合があります。逆に、macOSのFinderはUTF-8を標準としているため、Windowsで作成したZIPを解凍すると文字化けすることがあります。
Windows環境でMacの解凍結果を予測する方法
Mac環境が手元になくても、以下の方法でZIP解凍時の文字化けを事前に確認できます。
1. 7-Zip で解凍テストする
7-ZipはWindowsのエクスプローラーよりもUTF-8に強いため、文字化けしにくいツールです。
- もし7-Zipで正常に解凍できれば、Macでも問題なく解凍できる可能性が高い。
- 逆に7-Zipで文字化けする場合、Macでも同様に文字化けする可能性が高い。
2. Windows 上の WSL (Ubuntu) でテスト
Windows Subsystem for Linux (WSL) のUbuntu環境で解凍テストを行うと、macOSに近い動作を確認できます。
手順：
- WSL (Ubuntu) をインストール
- unzip コマンドをインストール
sudo apt update && sudo apt install unzip - ZIPを解凍してファイル名を確認
unzip sample.zip -d test_folder/
WSLのLinux環境はmacOSのFinderと近い挙動を示すため、この方法で解凍結果を確認できます。
3. Mac風の解凍ツールを試す
Windows上でUTF-8の解凍を適切に行うツールを試します。
- Explzh（エクスプローラ風アーカイバ）
- WindowsでmacOSのUTF-8に近い挙動を持つ解凍ツール。
- WinRAR
- ZIPのエンコーディング処理が異なるため、文字化けを回避できる可能性あり。
4. オンラインの解凍ツールを使う
オンラインのZIP解凍ツールを使うことで、macOSのFinderで解凍した時と似た挙動を再現できます。
例:
5. 仮想環境でmacOSを動かす（未検証）
最も確実な方法はmacOSの仮想環境を作ることですが、セットアップの手間がかかるため今回は試していません。
- macOS-Simple-KVM (LinuxのKVM上でmacOSを動かす)
- VMware Workstation（macOSのISOイメージが必要）
FigmaのZIPエクスポート時の文字化け対策
作成したFigmaプラグインはJSZipを使ってZIPファイルを生成しました。
const blob = await zip.generateAsync({
type: "blob",
compression: "STORE",
});圧縮方式の違い
- DEFLATE（デフォルト）
- 圧縮率が高いが、透過画像の一部が黒くなる問題が発生した。
- STORE（非圧縮）
- 圧縮はされないが、透過部分の問題が解決。
そのため、今回は「STORE」オプションを使用してZIPを作成しました。
まとめ
- ZIP解凍時の文字化けは、OSごとのエンコーディング処理の違いが原因。
- Mac環境がなくても、7-Zip・WSL・Explzh・オンラインツールを使って動作確認できる。
- FigmaのJSZipエクスポート時に「STORE」オプションを使うことで、透過画像の問題を回避。
WindowsユーザーでもMac環境なしで検証できる方法を知っておくと、ZIPの互換性問題に対応しやすくなります。