- 博客(195)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 希望对你面试有所帮助
个人面试经历吧，觉得重要的分享一下。原生才是重中之重原型与原型链原型（prototype）：定义了一些公用的属性和方法，利用原型创建出来的新对象实例会共享原型的所有属性和方法所有函数拥有一个原型属性（prototype），也称显示原型每个对象（除null）都有__proto__(隐式原型),对于js,可以说一切皆是对象，所以函数也有。对象的__proto__指向创建该对象的构造函数的原型对象（prototype）。Function.prototype是个特例，它是函数对象，但是没有prototyp
2021-08-16 10:51:42
227
原创 前后端利用accessToken与refreshToken无感刷新
项目初衷以jwt(由header,payload和signature组成)为例，用户登录成功，后端返回accessToken。前端保存，请求接口携带，一切都是水到渠成的可是在acessToken失效时，你正好请求一次接口，接口就挂了，可能你就跳到登录页了，用户体验也不好。我们希望虽然过期了，但是页面偷偷地刷新，不影响当前接口运行。如果你的方案是把accessToken的有效期设置地久一点，比如100年。你真的是个机智Boy，那设置jwt的意义何在。方案accessToken和refreshToken
2021-06-15 11:04:03
4871
13
原创 微前端框架 之 single-spa
single-spaSingle-spa 是一个将多个单页面应用聚合为一个整体应用的 JavaScript 微前端框架。 使用 single-spa 进行前端架构设计可以带来很多好处，例如:在同一页面上使用多个前端框架 而不用刷新页面 (React, AngularJS, Angular, Ember, 你正在使用的框架)独立部署每一个单页面应用新功能使用新框架，旧的单页应用不用重写可以共存改善初始加载时间，迟加载代码项目实战新建项目，文件名micro-frontend，在该目录下生成a
2021-06-08 17:38:25
1230
原创 单点登录方案
单点登录单点登录（Single Sign On），简称为 SSO，是目前比较流行的企业业务整合的解决方案之一。SSO 一般都需要一个独立的认证中心（passport），子系统的登录均得通过passport，子系统本身将不参与登录操作。SSO是在多个应用系统中，用户只需要登录一次,同步更新子系统状态就可以访问所有相互信任的应用系统。比如，有两个管理系统，Application1和Application2，当Application1系统进入时，先判断是否登录，登录就跳出，没有登录的话就跳到SSO系统，
2021-06-04 16:05:15
290
原创 Vue3答题问卷H5实战
公司有个H5项目，简单试一下水，以答题问卷的小功能做示例。可单选，和多选（选择题中可以选择某个选项，可上传图片或文字），以及文字输入和图片集(图片，图片描述)，当然必选校验也加了。当然一般情况下，一般就涉及单选，多选（仅选择）题，文本题和最多再加个图片。哎，甲方永远是爸爸。但凡在Vue3项目中，使用基于vue的第三方插件（组件）请确保支持Vue3版本，如果不支持，就不要使用(当然你可以改包源码)。常见的错误，this的指向，$emit， new Vue()…页面创建vue create proj
2021-06-03 17:28:22
2352
原创 axios请求封装拦截重复请求
常见的业务需求，就是点击按钮，还没有反馈，你又点了一下。导致请求了两次。当然前端可以做按钮禁用，等待反馈。tab栏频繁切换。如果不想看细节，直接使用，后面有完整的axios封装。一、取消请求原生let xhr = new XMLHttpRequest();xhr.open("GET", "http://127.0.0.1:3000/users/getAll?pageNo=1&pageSize=10", true);xhr.send();setTimeout(() => xhr.a
2021-04-29 10:58:31
379
1
原创 Sequelize-cli快速入门，学废了吗？
Sequelize 是一个基于 promise 的 Node.js ORM。一般项目都会用到 官网链接。当时只是单纯的建Model层，数据库操作。而Sequelize -cli是我在用eggjs做项目的时候遇到的，链接地址（当时没有好好看Sequelize 官方网站，就没留心有该脚手架）。本文做一次整理，从无到有，记录。安装mkdir sequlize-cli-testnpm i sequelize-cli -g // 有人全局，网上有人当前文件 -D /node_moudules/sequeliz
2021-04-08 18:39:49
497
原创 微信小程序扫码实现web自动登录
清明假期在家无聊，写了一个微信小程序扫码，web登录的demo技术栈前端：vue2+vue-socket.io+uuid，微信小程序原生+weapp.socket.io后端： eggjs+redis+socket.io+qr-image细分说明web端流程打开登录页面请求获取二维码客户端先生成一个唯一值uuid， 携带uuid请求服务端，服务端并将uuid作为key，值为空，一个过期时间，存进redis中服务端利用uuid,作为qr-image的option，生成二维码（微信小程序扫码
2021-04-06 23:38:15
1951
原创 微信小程序项目如何在vsCode上利用scss有效开发
安装插件SassLive Sass Compiler 编译已下插件让vscode支持微信小程序vscode weapp api，这是小程序的语法结构apivscode wxml这个插件，主要是针对wxml文件的Easy WXLESS，是针对wxss文件的vscode-wechat重启用vscode打开小程序项目配置项{ "files.associations": { "*.wxml": "html", "*.wxss": "css"
2021-04-02 16:35:48
749
原创 微信小程序项目小结
项目做一个阶段性总结吧如果有更好的方案，欢迎交流一、登入模块一般情况下，用户权限消息会在app.js请求App({ onLaunch() { // 获取code 获取openid 再查询个人信息 }})但是我们app.js接口请求时，异步，页面与小程序生命周期执行顺序是不受控制的。尤其当你的首页部分数据是需要个人权限信息来渲染的。小程序新建项目的时候，官方有个解决方案是回调。但是如果微信小程序第一次首页跳转就是index页面时，是没有问题的。可你分享其他页面的时候（还是权
2021-03-24 15:59:44
367
原创 原型与原型链
二十一天，好习惯不一定能养成，但坏习惯肯定能养成日常白 * 整理原型原型-构造器 （constructor）原型是跟对象密不可分。如果我们需要创建一个对象，就需要先去定义一个object。一般情况，用关键字var申明。比如有一个对象叫张三，年龄20var zhangsan = { name:'张三'， age:20}如果有李四，就继续创建一个李四的对象。当然，如果要创建100个这样的对象，哪怕ctrl+c/v ，程序员也怕烦，也懒。所以，我们会想到用函数function来动态创建fun
2021-03-23 16:46:32
81
原创 微信小程序订阅功能实现 前后端
微信小程序订阅消息文档地址 链接官网文档永远是第一手资料步骤一：获取模板 ID地址步骤二：获取下发权限开发工具不能唤起，真机调试以一次性订阅为例这里我用按钮来实现的，自己根据实际项目修改页面效果前端代码home.js authMessageTpl() { wx.requestSubscribeMessage({ tmplIds: ['模板id'], success(res) { if (res['模板id'] === 'accep
2021-01-26 13:47:51
1078
2
原创 微信小程序登入前后端 后端springboot
初衷公司要入小程序的坑，好久没写微信小程序，重新梳理一下登入逻辑。正好自己最近在看springBoot，所以也算一个前后端的小Demo，也算个人阶段性质的检验吧。只是个人方案，不是标准。如果有问题，欢迎指正。技术站前端微信原生后端springboot + mysql + MP + jwt设计表前端缓存数据，都是假象。所以isAuth来判断数据是否需求分析验证是否有token存在此时调用接口获取用户信息，看是否已授权用户信息 isAuth未授权跳到授权页面。按钮授权，获
2021-01-21 15:41:46
1158
原创 MybatisPlus 代码生成器
依赖MyBatis-Plus 从 3.0.3 之后移除了代码生成器与模板引擎的默认依赖，需要手动添加相关依赖： <dependency> <groupId>com.baomidou</groupId> <artifactId>mybatis-plus-boot-starter</artifactId> <version>3.4.0</vers
2021-01-15 13:27:25
878
1
原创 SpringBoot2集成Redis
只正对快速入门，上手公司代码，业务依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-data-redis</artifactId> <version>2.4.1</version> <
2021-01-12 10:56:37
272
原创 SpringBoot2集成swagger3
本文版本选择swagger最新版3依赖 <dependency> <groupId>io.springfox</groupId> <artifactId>springfox-boot-starter</artifactId> <version>3.0.0</version> </dependency>添加
2021-01-10 13:06:33
1252
5
原创 前端速成SpringBoot2 + myBatisPlus
前端速成年近年尾，公司项目活还好，速成，如果有Ts基础最好。我接触springboot + MybatisPlus 也就一星期，专业术语如果有问题，欢迎大佬指正。项目准备一台联网笔记本工具选择IdeaJava环境初始化项目安装从官网下载模板https://start.spring.io/idea 新建项目如果想从阿里云，地址自定义： https://start.aliyun.com/包命名规范 公司域名 com.xxx.xxxdependencies依赖安装，前期不清楚
2021-01-07 22:44:18
223
原创 TypeScrpt 学习指南
最近比较懒哎 大秦赋 大秦帝国 太好看了彩 彩 彩本文，日常白嫖大佬的文章，分享出来。一、TypeScript 是什么 TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。 TypeScript 提供最新的和不断发展的 JavaScript 特性，包括那些来自 2015 年的 ECMAScript 和未来的提案中的特性，比如异步功能和 Decorators，以帮助建立健壮的组件。
2020-12-30 15:14:24
829
1
原创 vue-element-admin路由后端返回，动态渲染
vue-element-admin默认是按照路由meta.role角色，动态匹配的。但通常是不灵活的。总不能每次设置一个角色，前端还要动态配置。相对理想的状态，是后台配置一个用户，设置role权限，权限绑定了你需要的路由模块。本文讲述如何根据后台路由，动态渲染后台管理系统菜单栏。下载模板链接修改配置store/modules/perimission.js.import { constantRoutes } from '@/router'// import { getRouters } fro
2020-11-15 18:12:02
2909
4
原创 Vue3 从新出发
整理两篇关于vue3文章。我不是生产者，但努力做好一个传递者一、使用vite初始化项目vite 介绍vite是尤大大在今年新鼓捣出来的一个工具，尤大大对vite的描述是这样的: Vite is an opinionated web dev build tool that serves your code via native ES Module imports during dev and bundles it with Rollup for production. 翻译成中文就是：Vite .
2020-10-08 17:55:40
3146
原创 vue-cropper图片上传剪裁压缩组件
安装npm install vue-cropperyarn add vue-cropper注册组件内使用import { VueCropper } from 'vue-cropper' components: { VueCropper,},main.js里面使用import VueCropper from 'vue-cropper' Vue.use(VueCropper)cdn方式使用<script src="vuecropper.js"></scr
2020-07-27 09:46:39
581
原创 Vue日常借鉴
日常白*hookEvent,原来可以这样监听组件生命周期内部监听生命周期函数今天产品经理又给我甩过来一个需求，需要开发一个图表，拿到需求，瞄了一眼，然后我就去echarts官网复制示例代码了，复制完改了改差不多了，改完代码长这样<template> <div class="echarts"></div></template><script>export default { mounted() { this.char
2020-07-03 19:43:07
479
原创 node篇 graphql 入门
graphql 官网 链接，详情翻阅官网，一定比我写的好。个人第一次接触，公司大佬推荐，之后去搜文档，教程，视频。入门Demo必写 hello worldconst express = require('express');const { buildSchema } = require('graphql');const graphqlHttp = require('express-graphql');const app = express()const schema = buildSche
2020-06-24 00:13:28
873
原创 node篇 七牛云图片上传与删除
本来是想自己搭建一个图片服务器的，但是七牛云实名认证有免费存储空间的 10G，公司项目也用到。也算给自己增加经验值吧。所以自己用node写了一份。网上也有很多，但参差不齐。关键还是自己多看官方文档吧。七牛云开发者平台项目准备注册一个七牛云账号创建存储空间创建的时候会提示两个选项绑定自定义域名和免费的一个月试用。还有一个坑点 公开 还是 私有，之后会说如果默认使用免费，存储空间会自动绑定该免费域名（无需CNAME解析），cdn域名管理会多一条记录如果是添加自定义域名，比如你域名 ab
2020-06-11 15:06:06
933
原创 React 初识
先接触的React Native,因为公司新项目需求需要。但React底层什么的一概不知，虽然有一点Vue的入门经验。所以想年前突击一下。望与前端各位，共同进步，早日爬坑。工欲善其事必先利其浏览器，node环境学习一种语言，建议从官网入手，无味的话，也可以看看视频之类库与框架library(库) ...
2020-06-08 09:50:45
402
原创 node篇 github项目自动化部署阿里云服务器
思路你在本地跑一个项目，当你push到远程仓库（github）的时候，远程仓库会及时更新。这时触发webhock钩子。webhock钩子需要绑定你的服务接口，并监听你的 git 事件。比如本文案例push事件,监听到后，就触发你写好的脚本文件。（cd dir, npm install, pm2 start … 等等 ）,项目准备前提你要有github项目，这里就不多说了打开项目位置 settingspayload url 远程可以访问的，可以http, 路径只写到端口也没事，但要跟你代码匹
2020-06-07 19:37:24
744
原创 PWA 入门
PWA 基本介绍PWA（Progressive Web App）是一种理念，使用多种技术来增强web app的功能，可以让网站的体验变得更好，能够模拟一些原生功能，比如通知推送。在移动端利用标准化框架，让网页应用呈现和原生应用相似的体验。pwa mdnPWA特点可靠——即时加载，即使在不确定的网络条件下也不会受到影响。当用户从主屏幕启动时，service work可以立即加载渐进式Web应用程序，完全不受网络环境的影响。service work就像一个客户端代理，它控制缓存以及如何响应资源请求逻
2020-06-01 23:19:23
724
原创 常见JavaScript数组方法
在这里，祝在看的各位超龄儿童 节日快乐小时候我们极力装得像个大人当我们已经不再是小孩的时候我们又希望像个孩子整理一份 也方便各位查漏补缺，亦是各位的儿童节礼物a) some此方法检查数组至少有一个元素是否满足参数函数检查的条件。const arry = [2,3,4,5]let val = arry.some(e=>e>4)console.log(val) // trueb) every与some差不多，此方法检查数组的所有元素是否满足给定条件，该条件由作为
2020-06-01 15:03:42
176
原创 koa API文档 使用Swagger
公司用了swagger,感觉美观，至少比我之前用到的apidoc 链 接 好太多了。当然，收费的api文档工具另算。本文以koa项目为例npm install koa2-generator -gkoa2 projectName # koa2 不能koa 版本不一样安装swagger相关依赖npm install koa2-swagger-ui swagger-jsdoc --save# koa2-swagger-ui UI视图组件 swagger-jsdoc 识别写的 /***/ 转 js
2020-05-25 22:42:08
4239
原创 node篇 邮箱获取验证码
叔叔阿姨都过520了，我在等我的六一项目准备1.两个邮箱账号，一个作为收件方，一个作为发送方2.有网3.node环境4.一台电脑 。。。。。邮箱设置这里以QQ邮箱为例 （设置-账户）往下 翻 点开启 （我已开启）之后会让你发验证信息，等到一串授权码项目npm init -ynpm i nodemailer新建文件 封装工具类 sendEmail.jsconst nodemailer = require('nodemailer')let transporter =
2020-05-20 22:31:52
545
原创 Cookie、Session、Token、JWT
我们不生产水，我们只是大自然的搬运工什么是认证（Authentication）验证当前用户的身份，证明你是你自己互联网中的认证用户名密码登录邮箱发送登录链接手机号接收验证码只要你能收到邮箱/验证码，就默认你是账号的主人什么是授权（Authorization）用户授予第三方应用访问该用户某些资源的权限你在安装手机应用的时候，APP 会询问是否允许授予权限（访问相册、地理位置等权限）你在访问微信小程序时，当登录时，小程序会询问是否允许授予权限（获取昵称、头像、地区、性别等个人信息）
2020-05-14 18:50:07
209
原创 Linux平台下docker vue项目镜像 运行
docker nginx 服务 入门可参考 链接地址Vue项目初始化vue create vue-test-docker根目录新建 default.conf Dockerfiledefault.conf# nginx配置server { # 可以写 80 最后运行可以重新映射 listen 80; server_name localhost; #charset koi8-r; access_log /var/log/nginx/h
2020-05-10 21:54:56
836
原创 deepin下安装 oh-my-zsh docker 并配置 nginx 服务
本文的出发点之前用到deepin v15 , 最近公司项目整合，需要用到docker ,前端代码也让我们自己部署。后续会陆续以vue项目为案例的，今天先把该准备的环境准备好。正好deepin 四月份公布 20 版本 ，现在系统重装，并部署一份docker。oh-my-zshlinux下命令行工具美化 （不需要的可以跳过）# 我的安装方式用到git curlsudo apt-get install gitsudo apt install zsh curlsh -c "$(curl -
2020-05-08 23:17:15
705
原创 Nginx入门 了解一下
本文章是在技术博客看到，在此整理一份，方便自己以后翻阅。当然也为屏幕前的你这不是抄，是借鉴！！！Nginx 版本 nginx-1.14.2Linux前置准备检查是否安装相关库：gcc openssl openssl-devel pcre pcre-devel zlib zlib-devel执行命令：yum install gcc openssl openssl-devel pcre p...
2020-05-05 20:58:41
259
原创 vue-element-admin 爬坑记录
在 Vue Element UI 中 el-tab 导出表单后端提供接新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导...
2020-05-05 09:11:46
555
原创 Sequelize 入门
SequelizeSequelize.js 提供对 MySQL，MariaDB，SQLite 和 PostgreSQL 数据库的简单访问，通过映射数据库条目到对象，或者对象到数据库条目。简而言之，就是 ORM（Object-Relational-Mapper）。Sequelize.js 完全是使用 JavaScript 编写，适用于 Node.js 的环境。本文已操作mysql为例安装...
2020-04-07 23:09:06
678
原创 仿疫情地图 React - Echarts 实时数据
看一下手机端疫情地图（按此仿写的）项目实现昨天某公开课上，老师是利用vue的，接口也是老师提供的。因为个人项目是React的，正好补充一下项目。直接上代码安装echart依赖npm install echarts-for-react echartsimport React, { Component } from 'react';import ReactEcharts from '...
2020-02-27 16:17:08
996
5
原创 node后台 apidoc快速生成你的api文档
昨天发现了一个好东西 apidoc，真的很方便。安利安装npm install apidoc -g配置我以express 写的接口为例// 方便大家入门，我把注释写在后面，但是实际情况最好去掉，毕竟是根据它编译生成api文档的// //// 后面是注释/** * @api {get} /book/bookCategory/cateList 书籍分类列表查找 //// 规定...
2020-02-11 11:32:56
1014
1
原创 webpack 4.x （二）
webpack多入口npm install html-webpack-plugin -Dnpm install babel-loader @babel/core @babel/preset-env webpack-dev-server -Dwebpack.config.jsconst path= require("path");const HtmlWebpackPlugin...
2020-02-09 22:23:04
119
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人