最近用electron-vue（electron ：基于 chromium 和 node.js, 让你可以使用 html, css 和 javascript 构建应用）撸了一个图片压缩的小软件,平时工作还是需要用得到的，支持常用的图片格式；
可以设置压缩比例
1、支持设置固定宽高
2、支持固定宽或高（按原图比例缩小）
3、支持等比例缩小
立即学习“前端免费学习笔记（深入）”；
具体操作如下：
1、前端把图片的路径和保存压缩后的路径传给后端，这个通过electron事件通讯就可以了
调用的是ipcRenderer.send事件，传入一个事件名，后端用ipcRenderer.on接收即可，
这里需要注意一下，我们使用ipcRenderer.once接收一次就可以，避免重复接收消息。
具体参考如下代码：
await request('resize', this.form.imgPath , this.form.imgSavePath)
request方法是对ipcRenderer.send做的一个封装
async function request( event = '', ...params) {
if (!event) {
return
}
// 构造promise
const reply = new Promise((resolve, reject) => {
// 数据返回事件，事先约定
const eventReply = `${event}-reply`
ipcRenderer.once(eventReply, (event, data) => {
resolve(data)
})
})
// 触发事件
ipcRenderer.send(event, ...params)
// 返回promise
return reply
}2、后端刚开始考虑用image-size这个库获取图片的宽高；用法如下：只需要传入图片的路径即可
const sizeOf = require('image-size')
let dimensions = sizeOf(path)
if(!dimensions){
return
}
let width = dimensions.width
let height = dimensions.height经测试后发现了一点小问题，就是偶尔出现获取失败的情况，既然有问题那就不能使用了。后面经查询用这个probe-image-size库是没有问题的，使用方式如下：
const probe = require('probe-image-size');
let dimensions = probe.sync(require('fs').readFileSync(path))
if(!dimensions){
return
}
let width = dimensions.width
let height = dimensions.height3、最后执行压缩即可，传入输出图片路径和保存的宽高，调用resize-optimize-images这个库，代码如下：
fs.readFile(path, function (err, originBuffer) {
if (err) {
return
}
output = output + `/${basename(path)}`
fs.writeFile(output, originBuffer, async function (err) {
if (err) {
return
}
const options = {
images: [output],
width,
height,
quality: 95,
}
//执行压缩.
await resizeOptimizeImages(options)
})
})总结：
以上就是在使用image-size过程中碰到的一点小问题，虽然没有从根源解决问题，但是也能从中学习到一些东西，有时候想要达到自己想要的功能就不能固定使用一种方式，需要学会变通，更重要的是要学会分析问题和解决问题。
更多请关注php中文网其它相关文章！
