前言

最近接手一個項目，是一個兄弟公司寫的，使用PHP的ThinkPHP做的前后端在一起的項目。代碼是別人搞到服務器上面去的，突然那邊的整個技術部解散了，而我們這邊在此之前我還沒看見過代碼。項目雖說部署到了服務器上，且可以打開，但是一堆bug。
沒辦法只好硬著頭皮在線上修改。之前也就是換了兩天時間在本地把PHP環(huán)境搭建過。還算好，在一天之內(nèi)修改而幾個bug，使得項目在上線的時候，沒有明顯的bug了。接下來就是在使用的過程中發(fā)現(xiàn)的有限業(yè)務邏輯的bug，還算好，那邊離職的那位技術負責人在幫我們修改，就這樣，前后不到一周時間，項目基本可以正常運行了。

問題

但是老板一直說微信商城的首頁打開比較慢，首頁也確實打開比較慢。這個問題由于不是最急的所以，到了今天我才修改。其實代碼方面并沒有修改，之前那邊的開發(fā)還說代碼里面在圖片上傳的時候壓縮過圖片了，我在他們的代碼里面并沒發(fā)現(xiàn)壓縮處理的代碼。我們公司這邊上傳圖片的人，也沒先壓縮圖片再上傳。項目已經(jīng)上線，圖片也有1583張，涉及到的產(chǎn)品有240多個。不可能再重新上傳圖片了。
之前首頁有130張左右的圖片，每張圖片最小有120K,最大500多K，這是一件很可怕的事情。一個首頁的圖片就有最少15M大小，這樣的首頁打開速度能不慢才怪。由于代碼已經(jīng)寫好了，圖片也上傳到阿里云的OSS上面了。現(xiàn)在能做的首先就是把阿里云OSS上的圖片壓縮一次再重新批量上傳上去。

批量下載圖片

還好項目里面有一個表示專門存放圖片地址的。這樣我就可以先把圖片批量下載下來，在使用工具壓縮之后再上傳到阿里云OSS上面去。
其實圖片的批量下載很簡單。主要是require模塊的使用。
代碼如下：

var express = require('express'); var router = express.Router(); var fs = require('fs'); var request = require('request'); var async = require("async");// 導入MySQL模塊 var mysql = require('mysql'); var pool = mysql.createPool({host: '數(shù)據(jù)庫IP地址',user: '數(shù)據(jù)庫用戶名', password: '數(shù)據(jù)庫密碼', database: '數(shù)據(jù)庫名',multipleStatements: true,port: '數(shù)據(jù)庫端口' })router.all('/api/imgstore', function(req, res, next){pool.getConnection(function(err, connection) {if(err){res.end(JSON.stringify(err));return;}connection.query('select * from 表名;',function (err, results) {connection.release();if (err){throw err}else{async.each(results,function iteratee(item, callback){// 獲取圖片地址var urls = item.imgpath;// 獲取圖片名字var objName = urls.split('Uploads/')[1];// 構建目標路徑var basePath = './tmp/'; var targetPath = basePath+ "/tmp"; // 下載圖片 download(urls,basePath, objName); })}})}) });// 圖片下載 // uri：圖片網(wǎng)絡地址 // dir：目標路徑 // filename：圖片名字 function download(uri, dir,filename){ request.head(uri, function(err, res, body){ request(uri).pipe(fs.createWriteStream(dir + "/" + filename)); }); }; module.exports = router;

就這樣整個阿里云OSS上下的1583張圖片就全部下載下來了。

壓縮圖片

壓縮圖片這個關于Node.js的代碼還沒發(fā)現(xiàn)合適的，所以采取的使用工具手動壓縮的。
https://tinypng.com/這個工具其實也是很好用的。之前一直使用這個，但是這次沒有使用。因為他一次只能上傳20張，這里有1583張，速度也比較慢。
這次使用的是智圖。智圖有客戶端，我是使用客戶端壓縮的，一次上傳800張沒問題，就這樣兩次就搞定了。
最后綜合對比一下那些120K以上的圖，基本壓縮了60%以上，那些50K左右的圖，也變小了好幾K。整體來說效果是很明顯了。
剩下的就是使用阿里云的OSS工具批量上傳了，這個一次搞定，只是需要等幾分鐘。

最后

在不修改任何線上代碼的情況下，就將整個項目里面的圖片全部壓縮的一次，這個耗時不過兩個小時，且用戶不會發(fā)現(xiàn)異常。工作效率還是很高的。首頁打開速度明顯快了一倍。這樣其他詳情頁面打開速度也會加快。
但是這是在只有1583張圖片的前提下，整個過程花了不到兩個小時，如果后面再有幾個0，那么這個工程是巨大的，效率也并不高。所以最終還是要通過代碼處理。
現(xiàn)在目前能做的就是，要求上傳圖片的同事在上傳產(chǎn)品圖片的之前必須要先壓縮一次再上傳。
關于智圖的API–gulp-imageisux。也研究了一下，發(fā)現(xiàn)不怎么好用，處理單個圖片還好，批量就弱了一些。

總結

以上是生活随笔為你收集整理的Node.js 批量下载图片的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。