php网站开发用什么php,wordpress 全站404,龙华网站建设yihekj,wordpress页面侧边栏用到的技术栈#xff1a; nodejswebpackknockoutmongodbPM2rabbitmq
以下是一个综合指南#xff0c;展示如何将 Node.js、Webpack、Knockout.js、MongoDB、PM2 和 RabbitMQ 集成到一个项目中。
我们将在这一项目中添加 RabbitMQ#xff0c;用于处理消息队列。这对于任务分…用到的技术栈 nodejswebpackknockoutmongodbPM2rabbitmq
以下是一个综合指南展示如何将 Node.js、Webpack、Knockout.js、MongoDB、PM2 和 RabbitMQ 集成到一个项目中。
我们将在这一项目中添加 RabbitMQ用于处理消息队列。这对于任务分派、异步处理等场景非常有用。
第一步: 初始化项目 首先创建一个新的项目目录并初始化一个 Node.js 项目
Copy
mkdir my-app cd my-app npm init -y 这将在 my-app 目录下创建一个 package.json 文件。
第二步: 安装依赖 我们需要安装以下依赖库
项目依赖 express: 用于创建服务器 mongoose: 用于连接和操作 MongoDB knockout: 用于创建响应式 UI amqplib: AMQP 0-9-1 客户端用于与 RabbitMQ 交互
Copy
npm install express mongoose knockout amqplib 开发依赖 webpack: 用于打包前端代码 webpack-cli: 命令行工具用于运行 Webpack webpack-dev-server: 开发服务器提供实时重新加载功能
Copy
npm install --save-dev webpack webpack-cli webpack-dev-server 安装 PM2 PM2 是一个进程管理器用于长时间运行的 Node.js 应用程序
Copy
npm install pm2 -g 如果希望本地安装 PM2也可以用以下命令
Copy
npm install pm2 --save-dev 第三步: 创建服务器文件 创建 server.js 在根目录下创建一个 server.js 文件并添加以下代码
Copy
const express require(‘express’); const mongoose require(‘mongoose’); const amqp require(‘amqplib/callback_api’);
// 连接到本地 MongoDB 数据库 myapp mongoose.connect(‘mongodb://localhost:27017/myapp’, { useNewUrlParser: true, useUnifiedTopology: true });
const app express(); app.use(express.json());
// 定义一个 Mongoose 模型 const ItemSchema new mongoose.Schema({ name: String }); const Item mongoose.model(‘Item’, ItemSchema);
// API 路由 app.get(‘/items’, async (req, res) { const items await Item.find(); res.json(items); });
app.post(‘/items’, async (req, res) { const newItem new Item(req.body); await newItem.save();
// 发送消息到 RabbitMQ
sendToQueue(newItem);res.json(newItem);});
// 启动服务器 app.listen(3000, () { console.log(‘Server is listening on port 3000’); });
// 连接到 RabbitMQ 并发送消息 function sendToQueue(item) { amqp.connect(‘amqp://localhost’, (error0, connection) { if (error0) { throw error0; } connection.createChannel((error1, channel) {if (error1) {throw error1;}const queue itemQueue;const msg JSON.stringify(item);channel.assertQueue(queue, {durable: false});channel.sendToQueue(queue, Buffer.from(msg));console.log( [x] Sent %s, msg);});setTimeout(() {connection.close();}, 500);
});} 注意: 请确保你的 RabbitMQ 和 MongoDB 服务器正在运行。你可以使用以下命令启动它们
Copy
启动 MongoDB
mongod
启动 RabbitMQ (RabbitMQ 必须已经安装)
rabbitmq-server 消费 RabbitMQ 队列中的消息 创建一个 consumer.js 文件用于消费队列中的消息
Copy
const amqp require(‘amqplib/callback_api’);
amqp.connect(‘amqp://localhost’, (error0, connection) { if (error0) { throw error0; } connection.createChannel((error1, channel) { if (error1) { throw error1; } const queue itemQueue;channel.assertQueue(queue, {durable: false});console.log( [*] Waiting for messages in %s. To exit press CTRLC, queue);channel.consume(queue, (msg) {const item JSON.parse(msg.content.toString());console.log( [x] Received %s, item.name);// 在这里处理收到的消息}, {noAck: true});
});}); 启动 PM2 管理器 PM2 可以用于同时启动我们的 server.js 和 consumer.js 。
更新 package.json 脚本
Copy
“scripts”: { “start”: “webpack serve”, “serve”: “webpack build pm2 start ecosystem.config.js” } 创建 ecosystem.config.js
Copy
module.exports { apps: [{ name: ‘server’, script: ‘server.js’, instances: 1, autorestart: true, watch: false, max_memory_restart: ‘1G’ }, { name: ‘consumer’, script: ‘consumer.js’, instances: 1, autorestart: true, watch: false, max_memory_restart: ‘1G’ }] }; 配置 Webpack 在根目录下创建一个 webpack.config.js 文件并添加以下代码
Copy
const path require(‘path’);
module.exports { entry: ‘./src/main.js’, output: { filename: ‘bundle.js’, path: path.resolve(__dirname, ‘dist’) }, devServer: { static: { directory: path.join(__dirname, ‘dist’), }, compress: true, port: 9000 }, mode: ‘development’ }; 创建前端代码 创建必要的目录和文件
Copy
mkdir src touch src/main.js touch src/index.html 编辑 src/index.html
Copy
Webpack, Knockout.js, MongoDB, RabbitMQ
Webpack Knockout.js MongoDB RabbitMQ
Add Item 编辑 src/main.js
Copy
import ko from ‘knockout’;
class ViewModel { constructor() { this.newItem ko.observable(‘’); this.items ko.observableArray([]); this.loadItems();this.addItem this.addItem.bind(this);
}async loadItems() {const response await fetch(http://localhost:3000/items);const items await response.json();this.items(items);
}async addItem() {const response await fetch(http://localhost:3000/items, {method: POST,headers: {Content-Type: application/json},body: JSON.stringify({ name: this.newItem() })});const item await response.json();this.items.push(item);this.newItem();
}}
ko.applyBindings(new ViewModel()); 启动应用 用 Webpack Dev Server 开发 运行以下命令来启动开发服务器
Copy
npm start 在生产环境中用 PM2 启动 运行以下命令来构建并使用 PM2 启动服务器:
Copy
npm run serve PM2 管理 一些常用的 PM2 命令包括
查看所有进程pm2 list 停止某个进程pm2 stop process_id 重启某个进程pm2 restart process_id 删除某个进程pm2 delete process_id 查看进程日志pm2 logs process_id 通过这些步骤您已经设置了一个使用 Node.js、Webpack、Knockout.js、MongoDB、PM2 和 RabbitMQ 的综合全栈应用。这种结构对于处理复杂任务和异步操作非常有效。
17:38