从零开始的完整代码: Vuejs前端 + Nodejs后端读写文件 + 消息通知到TG(钉钉机器人也行) + Nginx发布

目录

1. 网站视图

1. 网站版浏览视图

2. 手机端浏览视图

3. 删除弹框

2. Telegram通知

2.1 收到机器人消息

2.2 两个简单的api

3. 后端: NodeJs-server

4. 前端: VueJs-web

5. 网关: Runing service

5.1 Nodejs-server-run service

5.2 Nginx网关配置


看群里聊天说到单身的问题,

弄个计数统计一下单身人数,

半小时左右差不多搞定,

代码是很简单,说下过程吧

1. 网站视图

1. 网站版浏览视图

2. 手机端浏览视图

3. 删除弹框

2. Telegram通知

2.1 收到机器人消息

微信也有别人做的机器人,但是安全第一,我没使用

2.2 两个简单的api

https://xxx.xxx.com/sendMesage?text=

https://xxx.xxx.com/deleteMessage?text=

也可以访问我的个人网站右下角点击和我联系: https://intbird.net

3. 后端: NodeJs-server

没有特殊需求, 用VSCode手动写写就行了

const express = require('express')
const bodyParser = require('body-parser')

const axios = require('axios');
const http = require('http')

const path = require('path')
const fs = require('fs')

const store = require('store')

const app = express()
app.use(bodyParser.json())

// 允许所有内容跨域
app.all('*', function (req, res, next) {
    res.header('Access-Control-Allow-Origin', '*')
    res.header('Access-Control-Allow-Headers', 'Content-Type')
    next()
})

// 首页载体
app.get('/', function (req, res) {
    const html = fs.readFileSync(path.resolve(__dirname, 'index.html'), 'utf-8')
    res.send(html)
})

/
当前,WebSocket 不是最佳的选择来传输实时视频流,因为它不适用于高带宽和大数据量的传输。然而,如果你的视频流是经过编码和分段处理的,你可以使用 WebSocket 将这些分段发送到后端处理。 下面是一个示例代码,展示了如何使用 HTML、JavaScript 和 WebSocket 将视频流推送到 Node.js 服务器: 在前端的 HTML 文件: ```html <!DOCTYPE html> <html> <head> <title>视频流传输</title> </head> <body> <video id="videoElement" width="640" height="480" controls autoplay></video> <script src="app.js"></script> </body> </html> ``` 在前端的 JavaScript 文件(app.js: ```javascript const videoElement = document.getElementById('videoElement'); const socket = new WebSocket('ws://localhost:8080'); // 当 WebSocket 连接建立成功时 socket.onopen = () => { navigator.mediaDevices.getUserMedia({ video: true, audio: false }) .then((stream) => { const mediaRecorder = new MediaRecorder(stream); // 当有新的视频数据可用时,将数据发送到后端 mediaRecorder.ondataavailable = (event) => { socket.send(event.data); }; // 开始录制视频 mediaRecorder.start(); }) .catch((error) => { console.error('获取摄像头失败:', error); }); }; // 当收到来自后端消息时,将消息添加到 video 元素的源播放 socket.onmessage = (event) => { videoElement.srcObject = event.data; }; ``` 在后端的 Node.js 服务器: ```javascript const WebSocket = require('ws'); const wss = new WebSocket.Server({ port: 8080 }); wss.on('connection', (ws) => { ws.on('message', (message) => { // 处理接收到的视频数据,可以进分段存储或其他操作 console.log('收到视频数据:', message); }); }); ``` 请注意,以上代码只是一个简单的示例,用于演示基本的原理。在实际应用,你可能需要更多的处理和优化,例如视频编码、分段处理、视频流的传输协议等。另外,还要确保前端后端的连接正确建立,并适当处理错误和关闭事件。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值