当前位置: 首页 > news >正文

小说网站第二章-关于文章的上传的实现

简述

  因为最近比较忙,所以只有时间把以前的东西整理一下。前端方面,我使用了既存md5框架语法来保存数据,原谅我展示没找到好的方法。后端的话,我使用node+mongodb来保存数据。下面我就来简单介绍一下我的东西。

前端的实现

 前端的md5实现框架其实有很多,这里,我使用了mavon-editor框架。可以直接导入使用,如果是简单的小说网站,用这个东西其实也够了。稍微懂点md5语法,其实也可以写得很好看。

npm install mavon-editor
<template><div class="dashboard-container"><el-form  ><el-form-item label="标题" label-width="80px"><input type="text" v-model="queryinfo.title"></el-form-item><el-form-item label="系列" label-width="80px"><input type="text" v-model="queryinfo.series"></el-form-item><el-form-item label="类型" label-width="80px"><input type="text" v-model="queryinfo.type"></el-form-item></el-form><br><mavon-editorv-model="queryinfo.content":toolbars="toolbars"@save="save"/></div></template>
<script>
import qs from 'qs'
export default {name: 'MyArticle',data() {return {queryinfo:{title:'',series:'',type:'',content: '',},// 输入的数据toolbars: {bold: true, // 粗体italic: true, // 斜体header: true, // 标题underline: true, // 下划线strikethrough: true, // 中划线mark: true, // 标记superscript: true, // 上角标subscript: true, // 下角标quote: true, // 引用ol: true, // 有序列表ul: true, // 无序列表link: true, // 链接imagelink: true, // 图片链接code: true, // codetable: true, // 表格fullscreen: true, // 全屏编辑readmodel: true, // 沉浸式阅读htmlcode: true, // 展示html源码help: true, // 帮助undo: true, // 上一步redo: true, // 下一步trash: true, // 清空save: true, // 保存(触发events中的save事件)navigation: true, // 导航目录alignleft: true, // 左对齐aligncenter: true, // 居中alignright: true, // 右对齐subfield: true, // 单双栏模式preview: true // 预览},}},mounted() {},methods: {async  save(){console.log()// const {data:res} = await this.$http.post("getUserInfo/pagination", qs.stringify(this.queryInfo))this.queryinfo.content=this.queryinfo.content.replace(/\n/g, "<br/>");const {data:res} = await this.$http.post("data", qs.stringify(this.queryinfo))alert(res)}}
}
</script>
<style>.el-form-item {display: inline-block !important;margin-right: 10px;
}</style>

 后端的实现

 后端我采用了node+mongodb的方式,使用mongodb和mysql相比相对繁琐一点,需要预先定义数据模型。

npm install mongoose

数据模型

保存数据

async function getData(mydata){
//     const mongoose = require("./mogodb")
//     const OrderSchema = mongoose.Schema({
//     type:String,
//     series:String,
//     data:String,
//     title:String
//   })
// const Order = mongoose.model(mydata.title, OrderSchema, 'order');
//   // 实例化数据模型,创建数据的时候需要saveconst User = require("./Schema")
const order1 = new User({type:mydata.type,series:mydata.series,data:mydata.content,title:mydata.title})
order1.save()}
module.exports=getData

模块的引用 

app.post('/data', async function(req,res){const type = req.body.typeconst series=req.body.seriesconst content =  req.body.contentconst title = req.body.titleconst obj={type:type,series:series,content:content,title:title}console.log(obj)var data = require("./getData")await data(obj)res.send("返回数据")
})

总结

  后续会对页面继续升级优化,今天先到这里吧

相关文章:

小说网站第二章-关于文章的上传的实现

简述 因为最近比较忙&#xff0c;所以只有时间把以前的东西整理一下。前端方面&#xff0c;我使用了既存md5框架语法来保存数据&#xff0c;原谅我展示没找到好的方法。后端的话&#xff0c;我使用nodemongodb来保存数据。下面我就来简单介绍一下我的东西。 前端的实现 前端的…...

Java面试题01

1、以下不属于oracle的逻辑结构的是&#xff1f;答案&#xff1a;B A.段 B.数据文件 C.表空间 D.区 2、构造函数何时被调用&#xff1f;答案&#xff1a;A A.创建对象时 B.使用对象变量时 C.调用对象方法时 D.类定义时 3、下列排序…...

6.3 社会工程学攻击

数据参考&#xff1a;CISP官方 目录 社会工程学攻击概念社会工程学攻击利用的人性 “弱点”典型社会工程学攻击方式社会工程学攻击防护 一、社会工程学攻击概念 什么是社会工程学攻击 也被称为 "社交工程学" 攻击利用人性弱点 (本能反应、贪婪、易于信任等) 进…...

typeScript 之 Map

工具&#xff1a; PlayGround 源码&#xff1a; GitHub TypeScript Map简介 Map是ES6引入的一种新的数据结构&#xff0c; 它是一只用于存储**键值对(key-value)**的集合。 let map new Map(); let map_1: Map<string, number> new Map(); let map_2: Map<string…...

Apache Doris 入门教程29:文件管理器

文件管理器 Doris 中的一些功能需要使用一些用户自定义的文件。比如用于访问外部数据源的公钥、密钥文件、证书文件等等。文件管理器提供这样一个功能&#xff0c;能够让用户预先上传这些文件并保存在 Doris 系统中&#xff0c;然后可以在其他命令中引用或访问。 名词解释​ …...

【佳佳怪文献分享】MVFusion: 利用语义对齐的多视角 3D 物体检测雷达和相机融合

标题&#xff1a;MVFusion: Multi-View 3D Object Detection with Semantic-aligned Radar and Camera Fusion 作者&#xff1a;Zizhang Wu , Guilian Chen , Yuanzhu Gan , Lei Wang , Jian Pu 来源&#xff1a;2023 IEEE International Conference on Robotics and Automat…...

word 应用 打不开 显示一直是正在启动中

word打开来显示一直正在启动中&#xff0c;其他调用word的应用也打不开&#xff0c;网上查了下以后进程关闭spoolsv.exe,就可以正常打开word了...

Flink-----Yarn应用模式作业提交流程

Yarn应用模式作业提交流程 在Yarn当中又分为Session,PerJob,Application,建议和推荐使用独立集群的,其中就包含PerJob 和Application,但是1.17版本的Flink已将PerJob标记为过时,并且Application可以解决PerJob的一些痛点,减轻客户端的一些压力,所以需要重点了解Yarn应…...

Python学习笔记_基础篇(五)_数据类型之字典

一.基本数据类型 整数&#xff1a;int 字符串&#xff1a;str(注&#xff1a;\t等于一个tab键) 布尔值&#xff1a; bool 列表&#xff1a;list 列表用[] 元祖&#xff1a;tuple 元祖用&#xff08;&#xff09; 字典&#xff1a;dict 注&#xff1a;所有的数据类型都存在想对…...

【第三阶段】kotlin语言的安全调用操作符

&#xff1f;. fun main() {var name:String?"kotlin" //name是一个可空类型&#xff0c;发出广播&#xff0c;调用的地方必须补救措施namenullvar r name?.capitalize() //?. 如果namenull&#xff0c;那么?.的将不执行&#xff0c;就不会引发空指针异常prin…...

机器学习重要内容:特征工程之特征抽取

目录 1、简介 2、⭐为什么需要特征工程 3、特征抽取 3.1、简介 3.2、特征提取主要内容 3.3、字典特征提取 3.4、"one-hot"编码 3.5、文本特征提取 3.5.1、英文文本 3.5.2、结巴分词 3.5.3、中文文本 3.5.4、Tf-idf ⭐所属专栏&#xff1a;人工智能 文中提…...

Logic 2逻辑分析器捉到的CAN帧

代码开发环境 逻辑分析仪环境 MCU芯片环境&#xff1a;RH850/U2A16 逻辑分析器(LA)抓到的CAN帧 <完>...

手机的发展历史

目录 一.人类的通信方式变化 二.手机对人类通信的影响 三.手机的发展过程 四.手机对现代人的影响 一.人类的通信方式变化 人类通信方式的变化是一个非常广泛和复杂的话题&#xff0c;随着技术的进步和社会的发展&#xff0c;人类通信方式发生了许多重大的变化。下面是一些主…...

为什么要分库分表?

不急于上手实战 ShardingSphere 框架&#xff0c;先来复习下分库分表的基础概念&#xff0c;技术名词大多晦涩难懂&#xff0c;不要死记硬背理解最重要&#xff0c;当你捅破那层窗户纸&#xff0c;发现其实它也就那么回事。 什么是分库分表 分库分表是在海量数据下&#xff0…...

Unity游戏源码分享-中国象棋Unity5.6版本

Unity游戏源码分享-中国象棋Unity5.6版本 项目地址&#xff1a; https://download.csdn.net/download/Highning0007/88215699...

打造专属花店展示小程序

在当今社会&#xff0c;微信小程序已经成为了各行各业拓展客户资源的利器&#xff0c;而花店行业也不例外。通过打造一个独特的花店小程序&#xff0c;你可以为你的花店带来更多的曝光和客户资源。那么&#xff0c;如何制作一个专属的花店小程序呢&#xff1f;下面我们就来一步…...

SpringBoot整合、SpringBoot与异步任务

目录 一、背景描述二、简单使用方法三、原理五、使用自定义线程池1、默认使用2、如何使用自定义线程池 六、Async失效情况1、同一个类中&#xff0c;一个方法调用 Async标注的方法 一、背景描述 java 的代码是同步顺序执行&#xff0c;当我们需要执行异步操作时我们通常会去创…...

复习1-2天【80天学习完《深入理解计算机系统》】第六天

专注 效率 记忆 预习 笔记 复习 做题 欢迎观看我的博客&#xff0c;如有问题交流&#xff0c;欢迎评论区留言&#xff0c;一定尽快回复&#xff01;&#xff08;大家可以去看我的专栏&#xff0c;是所有文章的目录&#xff09;   文章字体风格&#xff1a; 红色文字表示&#…...

62、华为昇腾开发板Atlas 200I DK A2配置mmpose的hrnet模型推理python/c++

基本思想&#xff1a;适配mmpose模型&#xff0c;记录一下流水帐&#xff0c;环境配置和模型来自&#xff0c;请查看参考链接。 链接: https://pan.baidu.com/s/1IkiwuZf1anyKX1sZkYmD1g?pwdi51s 提取码: i51s 一、转模型 (base) rootdavinci-mini:~/sxj731533730# atc --mo…...

【数据结构】双链表

大家好&#xff01;今天我们来学习数据结构中的双链表。&#xff08;我们这里讲解的是带头&#xff08;哨兵位&#xff09;双向循环链表哦~&#xff09; 目录 1.双链表的概念 2. 双链表的逻辑结构 3. 双链表的定义 4. 双链表的接口实现 4.1 动态申请一个新结点 4.2 双链表…...

Chrome密码一键提取:3分钟找回所有浏览器保存的密码

Chrome密码一键提取&#xff1a;3分钟找回所有浏览器保存的密码 【免费下载链接】chromepass Get all passwords stored by Chrome on WINDOWS. 项目地址: https://gitcode.com/gh_mirrors/chr/chromepass 你是否曾经因为忘记某个重要网站的登录密码而感到焦虑&#xff…...

从查表到公式:PT100温度转换的两种实现(附STM32+MAX31865完整代码)

从查表到公式&#xff1a;PT100温度转换的两种实现&#xff08;附STM32MAX31865完整代码&#xff09; 在工业测量和精密温度控制领域&#xff0c;PT100铂电阻因其出色的稳定性和线性度成为温度传感的首选。当工程师通过MAX31865芯片获取到PT100的电阻值后&#xff0c;如何高效准…...

SYSU-MM01跨模态行人重识别:Python评估实战指南

1. SYSU-MM01数据集与跨模态行人重识别基础 如果你正在研究行人重识别&#xff08;ReID&#xff09;&#xff0c;尤其是跨模态场景下的挑战&#xff0c;SYSU-MM01绝对是一个绕不开的基准数据集。这个由中山大学发布的权威数据集&#xff0c;最大的特点就是同时包含了可见光&…...

重构音乐体验:六音插件的技术突围

重构音乐体验&#xff1a;六音插件的技术突围 【免费下载链接】New_lxmusic_source 六音音源修复版 项目地址: https://gitcode.com/gh_mirrors/ne/New_lxmusic_source 问题发现&#xff1a;洛雪音乐的音源服务困境 当洛雪音乐升级至1.6.0版本后&#xff0c;许多用户遭…...

从‘它怎么又挂了’到‘服务稳如狗’:我是如何用Prometheus+Grafana搭建业务监控看板的

从被动救火到主动防御&#xff1a;PrometheusGrafana构建业务监控实战手册 凌晨三点&#xff0c;手机突然响起刺耳的警报声——这已经是本周第三次了。揉着惺忪的睡眼查看日志&#xff0c;却发现关键线索早已被淹没在海量的调试信息中。这样的场景对于中小技术团队来说再熟悉不…...

PyTorch 2.8镜像代码实例:使用预装torchaudio+FFmpeg实现TTS+视频合成Pipeline

PyTorch 2.8镜像代码实例&#xff1a;使用预装torchaudioFFmpeg实现TTS视频合成Pipeline 1. 环境准备与快速验证 在开始之前&#xff0c;我们先确认环境是否正常工作。这个PyTorch 2.8镜像已经预装了所有必要的组件&#xff0c;包括torchaudio和FFmpeg。 1.1 验证GPU可用性 …...

Altium Designer 实战指南:高效创建与优化PCB封装库

1. Altium Designer封装库基础入门 刚接触PCB设计时&#xff0c;我最头疼的就是封装库的创建。记得第一次画板子&#xff0c;因为电阻封装画错导致整批板子返工&#xff0c;那种挫败感至今难忘。现在用Altium Designer做封装就像搭积木一样简单&#xff0c;关键是要掌握正确的方…...

OrigamiSimulator:3分钟上手实时折纸模拟的完整指南

OrigamiSimulator&#xff1a;3分钟上手实时折纸模拟的完整指南 【免费下载链接】OrigamiSimulator Realtime WebGL origami simulator 项目地址: https://gitcode.com/gh_mirrors/or/OrigamiSimulator 你是否曾经好奇复杂的折纸结构是如何从平面纸张变为立体形态的&…...

只要一行代码,瞬间搭建 Web 服务器 python -m http.server 8000

只要一行代码,瞬间搭建 Web 服务器 python -m http.server 8000 目录 只要一行代码,瞬间搭建 Web 服务器 python -m http.server 8000 1. 核心机制:内置的 `http.server` 模块 2. 为什么它能“求生”,但不能“生产”? 🚀 并发处理能力 (Concurrency) 🛡️ 安全性 (Se…...

springboot+vue基于web的蛋糕商城论坛交流系统的设计系统

目录同行可拿货,招校园代理 ,本人源头供货商系统功能模块分析核心功能模块特色功能实现技术难点解决方案性能优化措施项目技术支持源码获取详细视频演示 &#xff1a;文章底部获取博主联系方式&#xff01;同行可合作同行可拿货,招校园代理 ,本人源头供货商 系统功能模块分析 …...