Vue/Node.js/JavaScript
文章平均质量分 72
入门Vue/Node.js/JavaScript系列,虽然后端不一定要会前端,但是学会更多知识总是没有什么不对
Moshow郑锴
Powered by Core iMoshow
展开
-
NPM如何切换淘宝镜像进行加速
淘宝镜像NPM和官方NPM的主要区别在于服务器的地理位置和网络访问速度。淘宝镜像NPM是由淘宝团队维护的一个npm镜像源,主要服务于中国大陆用户,提供了一个国内的npm镜像源,地址为。它的优势在于由于服务器位于中国大陆,因此对于国内用户来说,访问速度较快,尤其是在网络条件较差的情况下,能够绕过一些国外网络的限制和不稳定性,安装成功率高。相比之下,官方NPM的服务器位于国外,对于国内用户来说,在网络访问上可能会遇到速度较慢或不稳定的情况,尤其是在下载大型包或多个依赖包时,可能会有明显的体验差异。原创 2024-09-17 23:25:51 · 651 阅读 · 0 评论 -
LocalStorage封装
本文不讲解基础api,主要教你如何优雅的Storage工具类如何封装(支持前缀key、加密存储、过期时间,ts封装等)。真实存储大小/存储统计、如何监听、同源问题与同源窗口通信。原创 2024-07-21 22:27:58 · 813 阅读 · 0 评论 -
Building A Simple CRUD API With Next.Js 13
Building A Simple CRUD API With Next.Js 13原创 2024-06-16 16:22:43 · 1180 阅读 · 0 评论 -
TypeScript入门
TypeScript 是一种由微软开发的自由和开源的编程语言,它是 JavaScript 的一个超集,扩展了 JavaScript 的语法。原创 2024-06-16 16:14:41 · 1032 阅读 · 0 评论 -
Node.JS多线程PromisePool之promise-pool库实现
Promise-Pool是一个用于管理并发请求的JavaScript库,它可以限制同时进行的请求数量,以避免过多的请求导致服务器并发/IO读写等压力过大。使用Promise-Pool可以方便地实现对多个异步操作的并发控制。可以手工停止线程,可以设置强大的错误处理,可以进行任务开始和失败的回调,设置任务超时,也支持失败重试,还支持对每个请求结果进行响应。原创 2024-04-06 01:44:47 · 1650 阅读 · 0 评论 -
Node.JS多线程PromisePool之Async库实现
Async异步是一个实用程序模块,它为使用异步JavaScript提供了直接的、功能强大的功能。虽然最初设计用于Node.js,并且可以通过npm i异步安装,但它也可以直接在浏览器中使用。在本文示例中,我们创建了一个包含5个worker的线程池。然后,我们向线程池添加了10个任务。线程池会并发执行这些任务,但最多只能有5个任务同时运行。当一个任务完成时,线程池会自动分配下一个任务给空闲的worker。原创 2024-04-06 01:27:32 · 1216 阅读 · 0 评论 -
Javascript/Node.JS中如何用多种方式避免属性为空(cannot read property of undefined ERROR)
"cannot read property of undefined" 是一个常见的 JavaScript 错误,包含我在内很多人都会遇到,表示你试图访问一个未定义(undefined)对象的属性。Given that below object , not all object has same property , normally happens in JSON format , 如果阁下遇到以下问题,a中未必包含b,b中未必包含c,甚至a也不一定存在,应该如何优雅的判断呢。原创 2024-04-02 23:54:13 · 1480 阅读 · 0 评论 -
使用Express-Generator脚手架生成项目
总的来说,Express框架提供了简洁的路由定义方式,对获取HTTP请求参数进行了简化处理,支持模板引擎,方便渲染动态HTML页面,并且拥有中间件机制有效控制HTTP请求。此外,Express还拥有大量第三方中间件,可以对功能进行扩展。这些特性使得Express成为构建web应用程序的流行选择。原创 2024-04-01 00:22:16 · 1368 阅读 · 0 评论 -
使用Koa作为脚手架开发网站
Koa是由原来Express框架团队打造的,旨在提供更小、更具表现力、更健壮的web应用和API开发基础。它利用了ES2015中的async函数特性,允许开发者以更加优雅的方式编写中间件,同时增强了错误处理的能力。总的来说,Koa是一个现代化的、灵活的、并且功能强大的Web开发框架,适用于构建高效的后端服务。原创 2024-04-01 00:11:44 · 847 阅读 · 0 评论 -
Node.js Stream.pipeline() Method
通过流我们可以将一大块数据拆分为一小部分一点一点的流动起来,而无需一次性全部读入,在 Linux 下我们可以通过 | 符号实现,类似的在 Nodejs 的 Stream 模块中同样也为我们提供了 pipe() 方法来实现。原创 2024-01-20 23:42:01 · 1273 阅读 · 0 评论 -
Node.JS CreateWriteStream(大容量写入文件流优化)
如果你的程序收到以下错误,或者需要大容量写入很多内容(几十几百MB甚至GB级别),则必须使用Stream文件流甚至更高级的技术。业务场景,我们有一个IntradayMissingRecord的补全功能,每天大概是80-100W级别,如果需要在几分钟内把这么多记录写入到文件,需要根据某incremental逻辑去加载当天/当时间段所有记录,并且遍历并写入到一个文件中,这个时候createWriteStream可以更好的优化。而且个人更推荐设置。原创 2024-01-20 23:30:58 · 1934 阅读 · 1 评论 -
axios-retry插件-axios请求失败自动重试
client.get('/test') // 第一次请求失败,第二次成功。将请求超时解释为全局值, 不是针对每一个请求,二是全局的设置。// 允许 request-specific 配置。// 自定义 axios 实例。原创 2023-06-23 00:08:34 · 1604 阅读 · 0 评论 -
[ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client
那么,代表你返回了结果,但是最后你又不小心再返回了一次。通常是由于方法没有进行等待,或者多条件判断缺漏造成的。原创 2023-06-22 22:54:05 · 7021 阅读 · 0 评论 -
node.js用log4js输出日志到日期命名的文件文件
最近赶一个项目,但是那个项目完全不输出日志,debug的时候还只能开着控制台,这个时候引入一个日志框架,并且把控制台输出到日志文件就显得非常重要和实用。要点:- 引入log4js- 输出以日期命名的日志文件- 重写console.log/console.debug原创 2022-12-07 00:55:38 · 1876 阅读 · 5 评论 -
JavaScript提取JSON信息并输出为html
Javascript提取JSON并输出为HTML。最近买了某题库,是***mobi**的,但是苦于无法直接提取题库,所以分析了一下网站的API,发现有个接口是返回了对应的题库,这里我们列举一题进行分析。原创 2022-12-05 00:43:13 · 1352 阅读 · 0 评论 -
VUE3之data/methods里面怎么调用setup的data(layui-vue切换卡片式列表)
前言首先,在vue的setup()函数的执行要比beforeCreate 和 Created生命周期函数都要早,那么你去调用data是比较难得。但是反过来就比较容易了。因为setup定义好了一些变量或者方法,在methods中就可以当成data一样调用了。我们今天的任务是【layui-vue切换卡片式列表】,这里有几个关键点。模板基于layui-vue-admin任务要点分解:methods里面怎么调用setup的data(可以直接this.xxx调用,但是注意生命周期顺序)table怎么通过原创 2022-04-24 18:33:17 · 12044 阅读 · 0 评论 -
pnpm install (使用快速高效的pnpm代替原生npm)
前言如果你觉得npm比较慢,又不想用yarn,那么pnpm是一个很好的选择。花里胡哨的介绍完全不需要 ,快速 + 高效 ,就是pnpm最好的特性和体验。官方使用文档https://pnpm.io/zh/pnpm-cliNPM安装PNPMnpx pnpm add -g pnpmUpgrading pnpmOnce you have installed pnpm, there is no need to use other package managers to update it. Yo原创 2021-12-19 11:04:00 · 12207 阅读 · 0 评论 -
vue用v-cloak指令解决打开页面显示{{}}问题
背景当网络较慢,网页还在加载 Vue.js ,而导致 Vue 来不及渲染,这时页面就会显示出 Vue 源代码 , 具体是显示一些{{}}。就可以使用 v-cloak 指令+ v-cloak样式 来解决这一问题 (缺一不可)。例如以下html,打开则会显示{{text}} ,一闪而过<div id="app"> {{text}}</div><script> var app = new Vue({ el: '#app', data: {原创 2021-11-22 23:44:24 · 1689 阅读 · 0 评论 -
nodejs之websocket即时通讯实现(Socket.io)
什么是ws?websocket 是一种网络通信协议,一般用来进行实时通信会使用到。。。什么是socket.io?socket.io是一个高性能高可靠的websocket库,后端server基于node.js,前端提供多语言client。。。本文通过一个聊天功能实战,让大家了解并入门nodejs+websocket(socket.io)的实用。。。需求简述:前端输入内容并提交,后端处理并返回,最后显示在界面上。。。原创 2021-10-24 23:09:42 · 5197 阅读 · 8 评论 -
nodejs追加写入日志文件
前言有时候我们在项目中需要手工调试并输出某些日志文件时,可以封装一个简单的日志追加方法,这样把一些输出信息追加到文件中开源项目本项目收藏在【nodejs-study】中的nodejs_write_append_log目录,欢迎大家学习交流!简单版本const fs = require("fs");// by zhengkai.blog.csdn.net// fs.appendFile 追加文件内容// 1, 参数1:表示要向那个文件追加内容,只一个文件的路径// 2, 参数2:表示要追加的原创 2021-10-11 00:39:15 · 1582 阅读 · 1 评论 -
node.js中数组常用的方法:forEach、map、filter、every、some
前言工作中我们经常会遇到对数组的一些操作方法,或者对数字,对字符串,对json,但万变不离其宗,且听本文详细分解,本示例分为两个版本,一个是简单数字版本,一个是稍微复杂json版本,供大家入门参考。开源项目文章2示例均已上传至【nodejs-study】开源学习项目中的【array-operation】,命令行输入node app1.js | node app2.js运行对应文件即可在这里插入代码片简单数字版本 // by zhengkai.blog.csdn.net原创 2021-09-23 23:17:54 · 1573 阅读 · 0 评论 -
Node.js与Promise
什么是Promise简单来讲,promise是ES6一个API、构造函数,也是一种规范,更是一种·解决callcack深层嵌套·的方案,还是一种带有then方法支持链式操作的框架.使用Promise的好处Javascript的特点是异步,Javascript不能等待,如果你实现某件需要等待的事情,你不能停在那里一直等待结果回来,相反,底线是使用回调callback:你定义一个函数,这个函数只有等到结果返回时才能被调用。那么为什么这样做好处优于回调呢?标准的回调模式在我们处理请求时需要同时提供回调函数原创 2021-09-23 22:59:02 · 254 阅读 · 0 评论 -
Node.js+Mongoose实现MondoDB操作
1.MongoDB是什么,就是一个讲数据存储为类似JSON格式的NoSQL数据库,结构灵活。2.Mongoose是什么,就是一个以对象形式来操作MongoDB存储的node.js库,ORM,非常方便。3.本文章提供MongoDB安装与操作基础,以及node.js+mongoose操作mongodb,欢迎学习!!! by zhengkai.blog.csdn.net原创 2021-09-20 23:34:43 · 2241 阅读 · 6 评论 -
nodejs+express留言板功能实现
留言板基于nodejs+express+art-template的留言板功能。包含列表界面、添加界面和发送留言功能。所需类库直接copy以下package.json 然后直接 npm install 或者yarn install 即可。package.json所需内容如下。{ "name": "nodejs_message_board", "version": "2021.09", "private": true, "scripts": { "start": "node a原创 2021-09-19 15:30:23 · 4787 阅读 · 6 评论 -
node.js+express之静态文件托管
静态文件托管项目中难免会有一些静态文件需要托管,这些文件应该是要可以直接被外部访问,也就是与其他实体路由区分开来。例如通常我们会有static或者public的路径来引用静态文件。手工路由托管静态文件假设在public目录下有style.css文件,那么利用一下代码则可以手工创建一个静态路由来管理静态文件var createError = require('http-errors');var express = require('express');var fs = require('fs')原创 2021-09-19 13:44:57 · 818 阅读 · 0 评论 -
nodejs+art-template配置模板引擎
什么是art-templateart-template 是一个简约、超快的模板引擎。它采用作用域预声明的技术来优化模板渲染速度,从而获得接近 JavaScript 极限的运行性能,并且同时支持 NodeJS 和浏览器。http://aui.github.io/art-template/zh-cn/docs安装art-templatenpm install art-template --savenpm install express-art-template --save//或者yarn a原创 2021-09-19 11:27:08 · 294 阅读 · 0 评论 -
node.js+express入门
什么是express一句话,基于 Node.js 平台,快速、开放、极简的 Web 开发框架。安装express因为新版express的命令和库是分开的,所以需要额外安装一个express-generator$ npm install -g express$ npm install -g express-generator$ express --v创建一个express项目cd到你的项目文件主目录,输入express -e express-test自动创建express-test原创 2021-08-29 12:19:33 · 444 阅读 · 0 评论 -
yarn : 无法加载文件 C:\Users\mosho\AppData\Roaming\npm\yarn.ps1,因为在此系统上禁止运行脚本。
背景今天更新完系统之后打开项目,发现竟然yarn无法运行了(vue项目)。可能每次特殊的补丁会导致脚本策略有变动,所以又要重新设置一下。具体的错误信息PS D:\workspace\spring\TenderFetchSystem\tfs-ui> yarn run devyarn : 无法加载文件 C:\Users\mosho\AppData\Roaming\npm\yarn.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅 https:/go.microsoft.com/fwl原创 2021-08-08 11:02:38 · 586 阅读 · 0 评论 -
MSBUILD : error MSB4132: The tools version “2.0“ is unrecognized. Available tools versions are “4.0“
前言如果你在windows 下npm install或者yarn install依赖时出现错误:MSBUILD : error MSB4132: The tools version "2.0" is unrecognized. Available tools versions are "4.0".那么该类错误很大概率发生在node-gyp在构建时未能找到所需版本的构建工具。解决方法运行一下脚本即可npm install --global --production windows-build-t原创 2021-05-23 00:50:17 · 2035 阅读 · 0 评论 -
vue/elementUI CheckBox多选框赋值(设置`el-checkbox-group`以及`v-for`遍历`el-checkbox`)
最近有个功能,需要给项目添加一个多选赋值的功能,项目基于renren-security也就是半js半vue模式的前端。**需求展示:**- 给定一个字段,例如技术领域,页面上设置为checkbox多选项。- 选择之后,保存json字符串到数据库(直接value的形式)- 列表展示直接用json字符串展示- 详情页面根据之前选定的json字符串设置对应的选项打勾原创 2021-01-07 23:36:40 · 13455 阅读 · 5 评论 -
vue图片缩略图及图片预览功能
上次有个需求,是要给图片做个缩略图以及预览功能。其实用vue来实现是很简单的, 几句代码可以搞定,也不需要什么额外的插件。实现的效果如下:- vue显示图片缩略图- vue显示图片预览功能原创 2021-01-01 00:37:55 · 5261 阅读 · 2 评论 -
vue: 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\vue.ps1,因为在此系统上`禁止运行脚本`。(powershell运行策略设置)
vue : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\vue.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅 https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。Solution该问题的solution就是通过powershell去解除Execution_Policies(运行策略)的限制。开始菜单或者小娜搜索输入powershel..原创 2020-10-31 17:58:47 · 19395 阅读 · 12 评论 -
vue element-UI使用el-select时@change不能触发的解决方案(通过el-option @click.native原生方法)
前言在下刚入门VUE不久,最近有个项目的页面进行了VUE改造,使用的是 element-UI ,其中有个功能如下,有一下拉选择列表:证书类别,选择其中某个证书类别,自动根据证书类别设置的前缀填写到证书编号的输入框中去。 按道理这是一个onChange事件,也就是el-select的@Change事件可以搞定,但是却多次输出的undefined,最后通过改变思路,使用了el-option的@click.native的原生方法来实现。源代码+解决方案源代码+解决方案一起验证,忽略其他细节不看,我们可以发原创 2020-10-18 22:40:44 · 30680 阅读 · 0 评论 -
vue对时间戳判断昨天今天过去
需求背景最近有这么个需求,需要再vue中对日期进行判断,从而显示某些数据是昨日还是今日 。解决方案 <el-card class="box-card"> <div slot="header" class="clearfix"> <span>招标信息 <el-tag>{{date|formatDate(this)}}</el-tag></span> <!--原创 2020-08-08 17:04:03 · 1309 阅读 · 3 评论 -
uni-app获取小程序带参
背景继上一篇我们使用springboot生成带参数的小程序码之后,我们就需要在小程序里面接收对应的scene参数,在uni-app里面怎么接收小程序scene参数,网上很多攻略讲不清楚,在哪里调用,怎么调用也没讲,这里特地捋了一下思路。这里DEMO是以一个证书查询系统来弄。微信扫码带参的二维码/小程序码,自动跳转到小程序,并且识别和填充参数到界面上,这里是填充证书编号certNumber=xxxx关于怎么生成可以看Java/SpringBoot获取小程序带参二维码并保存到本地核心代码for un原创 2020-07-27 22:59:08 · 5730 阅读 · 0 评论 -
vue/js时间戳转标准格式
问题背景有时候后端java返回的时间格式是时间戳,这个是由于ORM映射的关系一般都映射为时间戳,所以不能直接用于显示的,例如1554710403000,需要前端js/vue进行转换。解决方案// 初级转换:时间戳 => 标准格式 formatterDate(data) { //blog.csdn.net/moshowgame var date = new Date...原创 2019-04-08 16:57:03 · 2192 阅读 · 1 评论 -
vue转换时间格式的过滤器
既然是做系统,通常都离不开时间的装换,今天遇到的这个功能是做个`vue` 的 `formatDate 时间转换`的 `filter 过滤器` 需求如下:- 提前封装好`过滤器formatDate`- `data`里面定义 `date: new Date()`- 直接`template`可以使用 `{{date|formatDate(this)}}`原创 2020-07-12 21:42:06 · 822 阅读 · 0 评论 -
vue给data中的数据赋值报错问题(TypeError: Cannot set property ‘tableData‘ of undefined)
问题背景最近刚入门vue,有个典型的场景,也是简单的坑。就是需要通过axios请求数据之后,将数据赋予到data中的tableData,而table组件会根据tableData双向绑定自动渲染。但是当我赋值的时候TypeError: Cannot set property 'tableData' of undefined。究竟怎么回事呢。分析代码看起来,好像并没有什么毛病。。。export default { data() { return { total: 0, //默认原创 2020-07-11 16:21:15 · 13471 阅读 · 9 评论 -
解决Axios跨域问题(Axios跨域问题解决方案)
Axios是不允许跨域访问的,别说跨域,跨端口都不行。例如某项目我本地vue前端frontEnd为`localhost:8888`,Java后台 backEnd为`localhost:8889`。这个时候就有两个方案了:- 修改`frontEnd`前端,支持跨域(通过代理的形式,当然这种是`伪跨域`,但是挺有用,前提是后端不限制即可)。- 修改`backEnd`后台,支持跨域(同时限制可跨域名,不在本文讨论范围,且看过往处理方式)。原创 2020-07-11 15:52:38 · 102747 阅读 · 25 评论 -
node中安装yarn(nodejs Yarn替代npm包管理) +设置阿里云镜像加速
什么是Yarn?Yarn是Facebook公司出品的用于管理nodejs包的一款软件,开发过nodejs的同学应该知道,我们一般都使用npm作为我们nodejs项目的模块管理器,但npm有一些历史遗留问题:极其快速。Yarn 会缓存它下载的每个包,所以无需重复下载。它还能并行化操作以最大化资源利用率,安装速度之快前所未有。特别安全。Yarn会在每个安装包被执行前校验其完整性。超级可靠。...原创 2019-12-02 22:49:48 · 8150 阅读 · 0 评论