终于用Nodejs完成了博客

终于用Nodejs完成了博客

这里首先要谢谢nswbmw大神，基本上都是基于他发表几篇文章学习的、很详细（http://cnodejs.org/topic/515b00096d382773061927de），真心的向这种无私的大神们致敬。 由于是基础想的学习，上来遇到的第一个问题就是图片上传因为他的教程是基于express3而我用的的是express4，当时也是各种查找，就想无头苍蝇一样，现在想想很简单只要一个formidable都解决了。最主要的还是找到了一些学习方法，以前总是基于百度查找答案，不去实质的去掌握这块知识，总结就是必须去看看官方提供的文档，经过这次的确总结了不少东西。

不过还有个一个问题没有解决？？？？？？ 就是首页有一个文章标签，我想的是每个页面都有，单在详细页面调取数据的时候不知道怎么处理了，试了个几个方法，还是不行，这个请大神们赐教。

以下是链接，是放在一个免费的平台上 http://vzone-123566.apse1.nitrousbox.com/


2 回复

终于用Node.js完成了博客

首先，我要感谢nswbmw大神，他的几篇文章帮助我走上了Node.js的开发之路。这些文章非常详细，让我受益匪浅。真心地向这些无私分享知识的大神们致敬。

图片上传问题

在搭建博客的过程中，我遇到了第一个问题：图片上传。由于nswbmw的教程是基于Express 3版本，而我使用的是Express 4，所以遇到了一些兼容性问题。最初，我像无头苍蝇一样到处寻找解决方案，但最终发现，只需要使用formidable模块就能轻松解决问题。以下是一个简单的示例：

const express = require('express');
const formidable = require('formidable');

const app = express();

app.post('/upload', (req, res) => {
    const form = new formidable.IncomingForm();
    form.parse(req, (err, fields, files) => {
        if (err) {
            console.error(err);
            return res.status(500).send('Upload failed');
        }
        // 处理文件
        console.log(files);
        res.send('File uploaded successfully');
    });
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

文章标签问题

另一个问题是在首页显示文章标签时遇到的。我希望每个页面都能显示标签，但在详细页面获取标签时遇到了困难。目前，我尝试了几种方法，但都没有成功。希望有经验的大神能提供一些指导。

假设我们有一个简单的标签列表存储在数据库中，可以使用以下代码来获取并显示标签：

const tags = ['JavaScript', 'Node.js', 'React', 'Vue'];

app.get('/post/:id', (req, res) => {
    const postId = req.params.id;
    // 假设我们从数据库中获取文章详情
    const postDetails = getPostById(postId);
    res.render('post', { post: postDetails, tags });
});

function getPostById(id) {
    // 这里应该是一个数据库查询逻辑
    return {
        id,
        title: 'My First Post',
        content: 'This is the content of my first post.',
    };
}

在模板中，你可以这样使用标签：

<!-- views/post.ejs -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title><%= post.title %></title>
</head>
<body>
    <h1><%= post.title %></h1>
    <div><%= post.content %></div>
    <div>
        <strong>Tags:</strong>
        <% tags.forEach(tag => { %>
            <span><%= tag %></span>
        <% }) %>
    </div>
</body>
</html>

在线演示

以下是我在免费平台上部署的博客链接： 在线演示

通过这次项目，我学到了很多关于Node.js的知识，并且深刻体会到了阅读官方文档的重要性。希望我的经历能对你有所帮助！


当然可以！以下是如何用 Node.js 完成一个简单的博客系统，并解决首页文章标签以及详情页数据调取的问题。

前端路由设置

首先，我们需要配置前端路由来处理首页和详情页的请求。假设我们使用 Express 框架：

const express = require('express');
const app = express();

app.get('/', (req, res) => {
    res.send('<h1>Home Page</h1><ul><li><a href="/posts/1">Post 1</a></li><li><a href="/posts/2">Post 2</a></li></ul>');
});

app.get('/posts/:id', (req, res) => {
    const postId = req.params.id;
    res.send(`<h1>Post ${postId}</h1><p>This is the detail page of post ${postId}</p>`);
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

数据库操作

接下来，我们可以通过 MongoDB 或其他数据库来存储和获取文章数据。这里以 MongoDB 为例：

const mongoose = require('mongoose');

mongoose.connect('mongodb://localhost/blog', { useNewUrlParser: true, useUnifiedTopology: true });

const PostSchema = new mongoose.Schema({
    title: String,
    content: String,
    tags: [String]
});

const Post = mongoose.model('Post', PostSchema);

// 在首页显示所有文章
app.get('/', async (req, res) => {
    const posts = await Post.find();
    let html = '<h1>Home Page</h1>';
    for (let post of posts) {
        html += `<h2>${post.title}</h2><p>${post.content}</p><ul>`;
        for (let tag of post.tags) {
            html += `<li>${tag}</li>`;
        }
        html += '</ul><a href="/posts/${post._id}">Read More</a><br>';
    }
    res.send(html);
});

// 显示详情页
app.get('/posts/:id', async (req, res) => {
    const postId = req.params.id;
    const post = await Post.findById(postId);
    if (!post) return res.status(404).send('Post not found');
    res.send(`<h1>${post.title}</h1><p>${post.content}</p><ul><li>${post.tags.join('</li><li>')}</li></ul>`);
});

解释

  1. 路由配置：

    • 首页路由 (/) 会渲染所有文章的标题和内容，并为每篇文章提供一个链接到详情页。
    • 详情页路由 (/posts/:id) 会根据文章 ID 获取并显示具体的文章内容。

  2. 数据库操作：

    • 使用 Mongoose 连接 MongoDB 数据库。
    • 创建一个 Post 模型来存储文章数据，包括标题、内容和标签。
    • 在首页渲染所有文章，并在详情页中显示具体的文章内容及其标签。

这样，我们就完成了一个简单的博客系统，实现了首页展示所有文章及其标签，并通过详情页显示具体文章的详细内容。希望这对你的博客开发有所帮助！

回到顶部