0

基于 TypeScript + Node.js,微信系开发脚手架——TNWX

介绍TNWX是笔者在码云上发现的一个微信系列的开发脚手架项目,看了一下不少人的评论就是两个字——专业,下面简单介绍;TNWX:TypeScript + Node.js + WeiXin 微信系开发脚手架,支持微信公众号、微信支付、微信小游戏、微信小程序、企业微信/企业号、企业微信开放平台。最最最重要的是能快速的集成至任何 Node.js 框架(Express、Nest、Egg、Koa 等)仓库码云:https://gitee.com/javen205/TNWXGithub:https://github.com/javen205/TNWX脚手架特性简洁至上以 Lerna 为中心构建的项目结构,简...

阅读全文>>

0

CSS:度量单位(px,em,rem,vw,%等)

Photo by Charles Deluvio on Unsplash介绍我决定写这个博客的目的是希望探索更多有关使用CSS调整大小的方法。 有这么多种可能性,很容易感到不知所措和困惑。 浏览器当前支持16种度量单位:像素,英寸,皮卡,厘米,毫米,点,百分比,em,rem,视口尺寸(vw,vh),ex,ch,Vmax(最大视口)和vmin (viewportmin)在这16个单位中有两类:相对长度和绝对长度。相对长度首先要了解相对长度,它们会在其他物体上获得尺寸,这些尺寸在您要设定尺寸的元素之外或相对于它们,例如,父级的尺寸,字体大小和视口尺寸。百分比百分比基于其父元素。 因此,如果一个元素...

阅读全文>>

0

纯CSS实现“文本溢出截断省略”的几种方法

在我们的日常开发工作中,文本溢出截断省略是很常见的一种需考虑的业务场景细节。看上去 “稀松平常” ,但在实现上却有不同的区分,是单行截断还是多行截断?多行的截断判断是基于行数还是基于高度?这些问题之下,都有哪些实现方案?他们之间的差异性和场景适应性又是如何?一般来说,在做这样文字截断效果时我们更多是希望:兼容性好,对各大主流浏览器有好的支持响应式截断,根据不同宽度做出调整文本超出范围才显示省略号,否则不显示省略号省略号位置显示刚好基于上述的准则,下面我们通过编码实践,给出一些答案。单行文本溢出省略核心 CSS 语句overflow: hidden;(文字长度超出限定宽度,则隐藏超出的内容)wh...

阅读全文>>

0

解决跨域的八种方式

受制于同源策略,一个域去请求另一个域的资源时,就会出现跨域的现象,而在我们开发中,经常需要跨域去请求资源(例如:本地localhost,去请求测试环境的资源),所以我们也就需要一些方法去解决这个跨域的问题复制代码一、使用jsonp 解决跨域缺点:不安全,容易造成xss攻击;只能是GET请求原理:1.<script>标签的src属性不受同源策略的限制2.跨域请求的接口返回的是一个函数调用,也就是调用我们应用中定义好的一个方法复制代码接口返回的数据格式二、通过cors解决跨域原理:在服务器端设置允许跨域的请求头,从而实现跨域 服务器设置后前端通过正常的ajax 请求即可复制代...

阅读全文>>

0

深入浅出一张图解析package.json文件

在 Node.js 中,模块是一个库或框架,也是一个 Node.js 项目。Node.js 项目遵循模块化的架构,当我们创建了一个 Node.js 项目,意味着创建了一个模块,这个模块必须有一个描述文件,即 package.json。它是我们最常见的配置文件,但是它里面的配置你真的有详细了解过吗?配置一个合理的 package.json 文件直接决定着我们项目的质量,本章就带大家了解下 package.json 的各项详细配置。#必备属性package.json 中有非常多的属性,其中必须填写的只有两个:name 和 version ,这两个属性组成一个 npm 模块的唯一标识。其中版本我们在...

阅读全文>>

0

input输入框禁止输入的几种方式

有时候我们在处理input输入框的时候,特别是在修改或者查看一些数据的时候,不希望去修改里面的值需要进行对input框进行禁止输入,那么以下几种方式就参考一下: 第一种:<input type="text" name="username" value="ybb" onfocus=this.blur()>    第二种:<input type="text" name="username" value="ybb" readonly>   <...

阅读全文>>

0

NodeJS常用 API 整理

一、Debug 调试方法Node 的调试方法有很多,主要分为安装 node-inspect 包调试、用 Chrome DevTools 调试和 IDE 调试,可以在官网的 Docs Debugging Guide 查看安装方法。下面介绍使用 Chrome DevTools 调试的方法,首先安装 Chrome Extension NIM,打开 Inspect 入口页面 chrome://inspect写一个简单 debug.js 测试文件:// apiTest/debug.js console.log("this is debug test")function test () { console...

阅读全文>>

0

前端常用设计模式

前端常见的设计模式主要有以下几种:1. 单例模式2. 工厂模式3. 策略模式4. 代理模式5. 观察者模式6. 模块模式7. 构造函数模式8. 混合模式单例模式这种设计模式的思想是确保一个类只有唯一实例,一般用于全局缓存,比如全局window,唯一登录浮窗等。采用闭包的方式实现如下:工厂模式工厂模式是创建对象的常用设计模式,为了不暴露创建对象的具体逻辑,将逻辑封装在一个函数中,这个函数就称为一个工厂。本质上是一个负责生产对象实例的工厂。工厂模式根据抽象程度的不同可以分为:简单工厂,工厂方法和抽象工厂。通常用于根据权限生成角色的场景,抽象工厂方法的实现如下://安全模式创建的工厂方法函数let ...

阅读全文>>

0

LocalStorage 如何实现过期时间功能

使用过localStorage的小伙伴都知道,localStorage本身没有时间过期的功能,那么如何实现localStorage过期功能呢?思路1、使用localStorage时,设置一个定时器,比如10分钟后过期,那就十分钟后清除localStorage。但是面临的问题是,如果浏览器关闭,定时器也就失效。如果解决呢?10分钟后过期,那就知道了截至时间,每次打开网址,就去检测当前时间是否超过了截至时间,没有就重新开启定时器,如果超过,直接清除localStorage。2、有了思路一,发现定时器并没有什么用。所以,使用localStorage.setItem时,并存入截至时间,每次localS...

阅读全文>>

0

HTTP的时代终将陨落,IPFS将构筑一个全新的互联网

我们每天上网使用APP、微博、刷朋友圈,都是通过HTTP协议实现的,是绝对的中心化网络。当然,背后繁杂的技术层面是普通用户感知不到的。网络上产生的所有数据都是被集中存放于特定的服务器中,即使这样的服务器在全世界不计其数,对于数据存储还是非常之中心化的,两个字总结:危险。为什么这么说呢?用户在特定的网站,或者客户端上使用之后所产生的用户数据也都是存储在这家中心化公司的服务器上的,服务器一旦受到黑客的攻击,损失或许难以估计。那么有没有一种比较完美的解决方案?有!IPFS!IPFS被称为星际文件系统,有望取代HTTP,成为下一代的互联网传输协议。相较于HTTP,IPFS最大的特点是点对点的分布式网络...

阅读全文>>