node实现批量上传本地图片转为图片CDN的项目实践

 更新时间:2023年07月14日 11:39:46   作者:穷小白  
本文主要介绍了node实现批量上传本地图片转为图片CDN的项目实践,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

前言

最近在做一个官网,里面需要很多图片,比较占用资源,打包体积有点大。所以想换成图片CDN方式,之前写过一个类似的,是需要后端同事提供接口,正好最近在看node,所以准备用node实现一下。

什么是图片CDN

与传统的CDN不同,图片CDN是CDN网络的一种应用,专门用于加速图片的传输和加载,当使用图片CDN的时候,图片被保存在CDN提供商的服务器上,并通过多个地理位置的边缘节点提供服务。当用户请求访问这些图片时,CDN会自动将图片传送到距离用户最近的边缘节点,从而实现快速加载和高可用性。

为什么用图片CDN

1.可以提高网页加载速度,因为图片被存储在离用户更近的服务器上,可以减少网络延迟,加快传输速度,提高网页加载速度。
2.节省带宽消耗,CDN可以分担原始服务器的流量压力,通过缓存图片并在需要时提供服务,从而减少原始服务器的带宽消耗。
3.减轻源服务器的负载,将图片的从源服务器上转移到CDN服务器上,减小了打包的体积,减轻了服务器的压力。

实现过程

这次实现主要用的是express + cloudinary + node,主要借用了cloudinary,将图片上传到cloudinary,

将其中的cloud_name、api_key、api_secret换成自己就行,话不多说直接上代码

const express = require('express');
const multer = require('multer');
const cloudinary = require('cloudinary').v2;
const app = express();
// 配置Multer中间件
const storage = multer.diskStorage({
  destination: (req, file, cb) => {
    cb(null, 'uploads/'); // 指定上传文件保存的目录
  },
  filename: (req, file, cb) => {
    cb(null, file.originalname); // 使用原始文件名保存上传文件
  }
});
const upload = multer({ storage });
// 配置Cloudinary
cloudinary.config({ 
    cloud_name: '*********', 
    api_key: '*********', 
    api_secret: '*********'  
  });
// 处理文件上传
app.post('/upload', upload.array('images', 10), (req, res) => {
  const files = req.files;
  const uploadPromises = [];
  // 遍历所有上传的文件
  for (let i = 0; i < files.length; i++) {
    const file = files[i];
    const uploadPromise = new Promise((resolve, reject) => {
      cloudinary.uploader.upload(file.path, (error, result) => {
        if (error) {
          reject(error);
        } else {
          resolve(result);
        }
      });
    });
    uploadPromises.push(uploadPromise);
  }
  // 等待所有文件上传完成
  Promise.all(uploadPromises)
    .then(results => {
      res.json(results);
    })
    .catch(error => {
      res.status(500).json({ error: '上传失败' });
    });
});
// 启动应用程序
app.listen(3000, () => {
  console.log('应用程序已启动');
});

然后在本地启动node服务就行,通过postman调用本地接口,实现批量上传

其中的url就是我所需要的,可以直接放在img标签中,替换本地路径的图片换成cdn形式图片

结语

写这个服务的最大目的是为了偷懒,同时也方便打包减小打包体积,有条件的大佬可以在写一个上传页面,不用在通过postman调用

到此这篇关于node实现批量上传本地图片转为图片CDN的项目实践的文章就介绍到这了,更多相关node 批量图片CDN内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Nodejs http模块返回内容中文乱码问题及解决

    Nodejs http模块返回内容中文乱码问题及解决

    这篇文章主要介绍了Nodejs http模块返回内容中文乱码问题及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-12-12
  • Node.js实现批量替换文件内容示例

    Node.js实现批量替换文件内容示例

    这篇文章主要为大家介绍了Node.js实现批量替换文件内容示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-08-08
  • Node.js使用Intl.Segmenter高效处理多语言文本的步骤

    Node.js使用Intl.Segmenter高效处理多语言文本的步骤

    Intl.Segmenter是JavaScript的国际化API,支持按语言规则智能分词,通过将其与jsdiff结合,可以实现更精准的多语言文本比对,这篇文章主要介绍了Node.js使用Intl.Segmenter高效处理多语言文本的相关资料,需要的朋友可以参考下
    2026-05-05
  • node.js项目如何创建websocket模块

    node.js项目如何创建websocket模块

    这篇文章主要介绍了node.js项目如何创建websocket模块问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-09-09
  • 基于node实现websocket协议

    基于node实现websocket协议

    这篇文章主要介绍了基于node实现websocket协议的相关资料,需要的朋友可以参考下
    2016-04-04
  • node指定内存上限简单代码实例

    node指定内存上限简单代码实例

    NodeJS启动的应用,内存使用是有上限的,下面这篇文章主要给大家介绍了关于node指定内存上限的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2023-11-11
  • 用node和express连接mysql实现登录注册的实现代码

    用node和express连接mysql实现登录注册的实现代码

    本篇文章主要介绍了用node和express连接mysql实现登录注册的实现代码,具有一定的参考价值,有兴趣的可以了解一下
    2017-07-07
  • 基于NodeJS的前后端分离的思考与实践(二)模版探索

    基于NodeJS的前后端分离的思考与实践(二)模版探索

    在传统的开发模式中,浏览器端与服务器端是由不同的前后端两个团队开发,但是模版却又在这两者中间的模糊地带。因此模版上面总不可避免的越来越多复杂逻辑,最终难以维护。
    2014-09-09
  • 利用NPM淘宝的node.js镜像加速nvm

    利用NPM淘宝的node.js镜像加速nvm

    这篇文章主要介绍了利用NPM淘宝的node.js镜像加速nvm的相关资料,文中介绍的非常详细,相信对大家具有一定的参考价值,需要的朋友们下面来一起看看吧。
    2017-03-03
  • npm install安装失败报错:The operation was rejected by your operating system

    npm install安装失败报错:The operation was rejected by your 

    这篇文章主要给大家介绍了关于npm install安装失败报错:The operation was rejected by your operating system的相关资料,文中给出了多种解决方法供大家参考学习,需要的朋友可以参考下
    2023-04-04

最新评论