用JavaScript修復ipa處理過的的png圖片

最近作項目遇到一個需求：解析apk和ipa包，而後把裏面的icon上傳到服務器。

問題

解析上傳過程比較簡單，我使用JSZip對apk和ipa進行解壓，而後把找到裏面的icon上傳到服務器。可是，當我在網頁中使用圖片時，問題出現了。對於apk中的icon，沒有任何問題，可是對於ipa中解析出來的圖片，在safari中能夠正常顯示，在其餘任何瀏覽器去沒法顯示。

緣由

Google後發現，是蘋果對png圖片進行了優化處理，具體看這篇文章（查看），在文章中咱們能夠了解到一些有用信息：

Apple uses PNGCursh open source library to crush png images inside iPA files。

解決方案

做爲一個前端工程師，我但願用javascript解決這個問題。其實以前國外已經有人去解決了，NodeJS-PNGDefry就是能夠，惋惜這個過久沒維護，已經跑不起來。

找不到可用的，我只能本身動手豐衣足食，本身寫一個。所以有了node-pngdefry。node-pngdefry的功能很明確，就是用Javascript來還原被蘋果處理過的png圖片。

node-pngdefry用法很簡單，支持命令行和常規的Node.js:

命令行用法

install：

$ npm install -g pngdefry

then run:

$ pngdefry -i icon.png -o icon.new.png

在Node.js中使用

$ npm install pngdefry --save-dev

var pngdefry = require('pngdefry');
var path = require('path');

var input = path.join(__dirname, 'icon.png');
var output = path.join(__dirname, 'icon.new.png');

pngdefry(input, output, function(err) {
  if (err) {
    return;
  }

  console.log('success');
});

Test

$ npm test

項目地址

node-pngdefry

感謝

最後感謝上面提到的文章的做者Jongware。