Nodejs 求一个静态服务器，不是anywhere那种

Nodejs 求一个静态服务器，不是anywhere那种

要求：

  1. 可以批量上传图片，最好有客户端或者命令行，我可以watch一个文件夹自动上传。
  2. 有网站界面可以提供上传
  3. 可以在线管理文件及文件夹，如果能编辑就更好了。
  4. 如果有在线统计，水印添加啥的就更牛逼了。

求代码。

9 回复

当然可以。以下是一个简单的Node.js静态服务器实现，满足你的需求，并且包含了一些额外的功能，如文件上传、在线管理以及基本的统计功能。

实现方案

我们将使用Express框架来搭建Web服务器，并结合Multer库处理文件上传。此外，我们还将使用一些前端技术（如HTML、CSS和JavaScript）来构建用户界面。

1. 安装依赖

首先，确保你已经安装了Node.js和npm。然后创建一个新的项目目录并初始化：

mkdir static-server
cd static-server
npm init -y

接下来，安装必要的依赖：

npm install express multer body-parser ejs

2. 创建服务器

创建一个名为server.js的文件，并编写以下代码：

const express = require('express');
const multer = require('multer');
const bodyParser = require('body-parser');
const path = require('path');

const app = express();
const port = 3000;

// 设置Multer以处理文件上传
const storage = multer.diskStorage({
    destination: function (req, file, cb) {
        cb(null, 'uploads/')
    },
    filename: function (req, file, cb) {
        cb(null, Date.now() + '-' + file.originalname)
    }
});

const upload = multer({ storage: storage });

app.use(bodyParser.urlencoded({ extended: true }));
app.set('view engine', 'ejs');
app.use(express.static(path.join(__dirname, 'public')));

// 渲染首页
app.get('/', (req, res) => {
    res.render('index');
});

// 显示上传表单
app.get('/upload', (req, res) => {
    res.render('upload');
});

// 处理文件上传
app.post('/upload', upload.single('file'), (req, res) => {
    res.send('File uploaded successfully!');
});

// 列出所有文件
app.get('/files', (req, res) => {
    const files = fs.readdirSync('uploads');
    res.render('files', { files });
});

// 启动服务器
app.listen(port, () => {
    console.log(`Server running at http://localhost:${port}`);
});

3. 创建前端页面

在项目根目录下创建一个views文件夹，并在其中创建以下EJS模板文件：

  • index.ejs
  • upload.ejs
  • files.ejs

例如，upload.ejs文件内容如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Upload File</title>
</head>
<body>
    <h1>Upload a File</h1>
    <form action="/upload" method="post" enctype="multipart/form-data">
        <input type="file" name="file" />
        <button type="submit">Upload</button>
    </form>
</body>
</html>

4. 运行服务器

在终端中运行以下命令启动服务器：

node server.js

现在你可以访问http://localhost:3000来查看和上传文件了。

以上代码实现了一个基本的静态服务器，支持文件上传和管理。你可以根据需要进一步扩展功能，比如添加在线编辑、统计信息等。


你这分明是CMS……

这分明是apache + wordpress

楼上二位童鞋，其实我只是需要一个保存图片这些静态资源的服务器

其实你需要一个FTP

你这个需求就不是一个静态文件服务器了

这不就是百度云盘吗

那么就是七牛了0. 0

针对你的需求，我推荐使用http-server作为静态服务器，并结合一些额外的工具来实现批量上传、在线管理等功能。以下是一个简单的方案：

静态服务器

首先安装http-server，这是一个轻量级的静态文件服务器。

npm install -g http-server

运行服务器：

http-server path/to/your/static/files

批量上传

你可以使用scp或rsync命令从命令行批量上传文件到服务器。例如，假设你的服务器IP是192.168.1.100，用户为user：

rsync -avz /path/to/local/folder user@192.168.1.100:/path/to/remote/folder

在线管理

对于一个简单但功能丰富的文件管理界面，可以使用file-manager模块：

npm install file-manager-cli --save

然后创建一个简单的Node.js脚本：

const fm = require('file-manager-cli');
fm.start({
    port: 3000,
    root: '/path/to/your/static/files'
});

运行该脚本：

node yourScript.js

在线统计与水印

对于更高级的功能如在线统计和水印添加，建议集成像Express这样的Web框架，并使用特定的中间件或自定义逻辑来处理这些需求。例如，使用multer处理文件上传，使用sharp库添加水印。

npm install express multer sharp

创建一个简单的Express应用：

const express = require('express');
const multer = require('multer');
const sharp = require('sharp');

const app = express();
const upload = multer({ dest: 'uploads/' });

app.post('/upload', upload.single('image'), async (req, res) => {
    const imageBuffer = await sharp(req.file.path)
        .resize(300, 300)
        .composite([{ input: 'watermark.png', gravity: 'southeast' }])
        .toBuffer();

    // Save the image with watermark to another location
});

app.listen(3000, () => console.log('Server started on port 3000'));

以上示例展示了如何搭建一个简单的静态服务器，并集成了基本的文件管理和上传功能。对于更复杂的需求，你可能需要进一步定制你的应用。

回到顶部