自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

赵盛的博客

web前端开发

  • 博客(35)
  • 收藏
  • 关注

原创 Clipboard 剪贴板,一个基于Electron+react+antd构建的剪贴板小工具

Clipboard 剪贴板简介简介一个基于Electron+react+antd构建的剪贴板小工具概述使用场景: 在我们使用word,excel,等编辑工具或者深度阅读文章的时候,每当需要复制一段文字并且记录下来,就要重复切换app或者窗口。或者是在复制繁杂的字段时,想要粘贴上上次甚至上上上次复制的内容,就需要再次找到那段文字,重新复制。使用Clipboard,它会帮你记录每次复制的内容。再次使用选中即可。技术背景:Electron桌面app开发介绍主界面主界面在屏幕下方显示

2021-05-22 08:12:14 1584 7

原创 CocosCreator接入微信小程序云开发过程

CocosCreator接入微信小程序云开发过程接入前准备首先需要申请一个小游戏类目的小程序,记下appid,在CocosCreator「构建发布」中填入。⚠️不可以是小程序的appid(这里踩坑了,用了之前的小程序的appid,构建后用微信开发者工具打开提示无法找到app.js,因为这个账号之前注册的时候第一大类目选择的不是小游戏,是普通小程序,所以入口文件就找不到了,打包构建出来的小游戏入口文件为game.js,普通小程序入口文件为app.js,如果绑定的appid第一类目不是小游戏的话就会出现

2022-04-12 21:39:10 6494

原创 什么?使用JavaScript也可以编写桌面小组件?

灵感来源受益于最近抖音上面一些推广app的视频,其中有一个是可以将自己的照片,文字等发送到情侣的桌面小组件上,主打「情侣」、「恋爱」这类标签。并且还挺多人喜欢这种…试问:哪个男孩子会拒绝在吹弹可破的iphone桌面上出现一些便携信息,拥有一个专属ios小组件,甚至女朋友的照片呢?身为一名合格的程序员就要有举一反三的能力,本着“能自己写就不麻烦别人”的原则,脑海中浮现了无数个骚操作????ReactNative ?「pass」Flutter ?「pass」Scriptable !「ye

2022-02-21 14:24:43 2320

原创 扒一扒WebSocket

扒一扒WebSocket在之前的nodejs项目中自己有尝试接入WebSocket,所以在面试官问到项目的时候也会提到WebSocket,但是之前自己也只是在实践阶段,并没有做深入了解。刚好实习的时候又接触到了熟悉的WebSocket,本着学习的目的,这次就深挖一下WebSocket。什么是WebSocket?WebSocket 是一种在单个TCP连接上进行全双工通信的协议。WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket AP

2022-02-08 20:50:52 1327

原创 git操作

mac配置git检查是否安装,终端输入:git未安装使用homebrew安装git:/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"brew install git二、创建ssh key、配置git设置username和email(github每次commit都会记录他们)git config --global user.name "zha

2021-12-13 14:57:07 477

原创 大学生国家安全知识竞赛接口分析

大学生国家安全知识竞赛接口分析流程分析首页http://gjaqzsjs.haedu.cn/gjaq_dati/page/index.html点击开始答题进入授权页发送请求判断是否登录输入学校,学号,密码登录后拿到答题信息如下{ "code": 2000, "msg": "SUCCESS", "data": { "question": [{ "number": "94", "type_code": "1", "type_char": "\u5355

2021-12-09 17:14:58 4084

原创 # 使用tunnel访问api[记录帖]

使用axios访问接口[记录帖]在访问xx时候,一些api需要可以使用,本地已经安装了clashx,打开浏览器可以正常访问,但是在代码里面一直超时无法访问。首先想到命令行设置全局代理:export https_proxy=http://127.0.0.1:7890 http_proxy=http://127.0.0.1:7890 all_proxy=socks5://127.0.0.1:7890设置后命令行curl可以访问,但是代码里面运行超时,此法无果。后面查找看到了tunnel

2021-12-09 17:01:45 196

原创 puppeteer爬取豆瓣top250电影及详细信息

const puppeteer = require('puppeteer');const fs = require('fs');// 豆瓣top250电影async function top250(i) { const browser = await puppeteer.launch({ headless: false, //关闭无头模式 defaultViewport: { width: 1200, hei

2021-10-24 15:22:32 1223

原创 利用puppeteer爬虫框架爬取数据

利用puppeteer爬虫框架爬取数据环境搭建puppeteer基于nodejs框架,首先需要nodejs环境,然后yarn add puppeteer 或者 npm install puppeteer使用puppeteer首先引入puppeteer:const puppeteer = require('puppeteer');然后配置项:puppeteer.launch({ headless: false, userDataDir: './userdata', //缓存网站数据

2021-10-22 15:50:17 625

原创 next.js页面跳转

页面跳转Link跳转href 添加跳转路径(默认是history的push模式,像历史记录里面添加一条)可以是字符串:"/about?abc=123"可以是对象:{pathname:"/about",query:{name:“123”}}as 重命名 (跳转重命名的页面如果不存在刷新页面后会404,常用到动态路由跳转中)<Link href="news/[id]" as={`/list/${参数}`}replace (替换history状态)scroll (跳转

2021-08-13 21:12:01 2452

原创 使用auto.js实现自动化每日打卡

使用auto.js实现自动化每日打卡疫情原因,需要在家每天定时打卡,每天刚起床的时候避免不了出现注意力不集中或者是看不到app,点不到按钮什么的(我瞎说的)。所以,就想搞一个自动化操作的东西,省去了这劳神费力的每日打卡。说干就干,于是乎就想起了之前双十一写的叠猫猫的无障碍脚本,所以这个还是不在话下的。用到的工具库:auto.js因为auto.js需要依赖安卓手机上的无障碍操作。所以目前只支持安卓手机并且需要在安卓6.0以上,这个官方网站都有详细介绍,我就不在此过多赘述了。多说一下,这个auto.j

2021-08-11 08:45:01 5363 3

原创 node版本管理工具 n

npm install -g n安装对应版本: n x.x.x(版本号)n 6.0.0 install : node-v6.0.0 mkdir : /usr/local/n/versions/node/6.0.0 fetch : https://nodejs.org/dist/v6.0.0/node-v6.0.0-darwin-x64.tar.gz installed : v6.0.0node --versionv6.0.0查看已安装的不同版本n

2021-05-15 21:54:55 523

原创 react利用Router(路由)判断用户是否登录

自定义一个路由组件AuthRoute,代码如下:import React, { Component } from 'react' import {Redirect,Route} from "react-router-dom" export default class AuthRote extends Component { render() { let token = localStorage.getItem('token') return ( <div> { token ? <Rout

2021-04-29 17:40:22 1341

原创 vscode less语法下出现红色波浪线解决办法

设置里面搜索 experimentalDecorators前面打勾就好了

2021-04-28 15:54:29 715

原创 node工具nodemon的妙用

node工具nodemon的使用nodemon是一种工具,可以自动检测到目录中的文件更改时通过重新启动应用程序来调试基于node.js的应用程序。在我使用react+antd开发electron桌面应用的时候总是需要重启electron .来查看修改效果,每次都需要输入两次指令,很不方便。使用nodemon可以监听文件变化,避免每次重复输入指令重启electron。安装npm install -g nodemon 或者 npm install --save-dev nodemon使用在我的项目里

2021-04-28 13:22:42 417

原创 2021校招准备工作(持续更新)

2021校招准备工作(持续更新)JavaScript学好JavaScript,至少把红宝书和犀牛书看三遍。ES6的新语法let声明的变量只在 let 命令所在的代码块内有效let在代码块内有效,var在全局内有效let只能声明一次,var可以声明多次for循环适合使用letfor (var i = 0; i < 10; i++) { setTimeout(function(){ console.log(i); })}// 输出十个 10for (let j = 0

2021-02-06 14:00:22 151

原创 zsh: command not found 解决方法

zsh: command not found 解决方法最新系统的macbook把zsh作为默认shell,而环境变量添加到了bash中,把 bash shell 中.bash_profile 全部环境变量加入zsh shell里就好step1:Term执行open .zshrc(没有了就自己新建一个)touch .bash_profile 创建.bash_profile 文件step2:在弹出的编辑器最下面加入source ~/.bash_profile或者source .bas

2020-10-26 08:57:31 23658

原创 hexo博客部署到腾讯云开发CloudBase

hexo博客部署到腾讯云开发CloudBase时至今日,已经有两个月没有更新了,因为一些个人原因最近一直没有动电脑。前阵子把之前参加的比赛收了收尾,材料该补充的都补充了。以后这段时间应该是不会参加什么比赛了,参赛材料准备的我头都大了。需要静心做一个能够拿的出手的项目,面试的时候也能说得出来一两个自己尽心做的项目。最近收到信息提示我的域名快要到期了,需要及时续费,然后打开我许久没碰过的电脑,打开控制台,续费,结果发现续费太不划算了,首年6块,续费一年就要60几块,我也没什么业务,就一个博客还有学校的几

2020-10-25 18:25:40 678

原创 我的前端学习路线

我的前端学习路线​ 思维导图第一阶段:HTML+CSS:div+css盒子模型 网站开发JavaScript:基本特效:Tabbar,轮播图,弹出层,滚动,视差效果JQuery特效,动画,常见html框架的使用第二阶段:移动端开发,适应多设备(包括分辨率,布局。。。。。。使用get,post请求前后端交互开发。第三阶段:学习ES5,ES6的新语法(特别是箭头函数面向对象的思维第四阶段:学习git操作了解,掌握yarn,npm脚手架

2020-10-25 18:23:41 436

原创 hexo迁移至新电脑

hexo迁移准备工作:u盘一个复制hexo相关目录下除去node_modules的文件(配置文件不能落下,建议除去node_nodules即可)copy至新电脑(相关环境必须装好)全局安装hexo 以及工具hexo-deployer-gitnpm install -g hexonpm install hexo-deployer-git --save执行 hexo g hexo s在本地查看效果满意可以提交至githubhexo cleanhexo g -d...

2020-10-25 18:22:16 213

原创 electron配置应用icon(五)

在打包electron应用程序的时候,如果没有配置icon,那么打出来的包图标就会是默认的。下面介绍一下如何创建自己的个性化图标。设计图标这里我用到了sketch,没有app的可以自行下载。新建一个文档创建一个宽高都为512的画板,画板内创建矩形。调整圆角,设置填充色。这里我用到了iconfont里面的图标,调整好比例。(不是专业设计师,能看就行)设计完成后就可以导出了。导出选中画板,点击导出。导出png格式的文件即可。转换图标格式png格式是无法作为图标来使用的。mac上

2020-06-06 15:30:04 7663 2

原创 electron打包(四)

在所有工作完成以后(react页面开发完成,页面已经build),就需要对我们的项目进行打包。打包前的配置首先要知道我们在开发的时候主进程加载的是react前端页面的本地url,这里需要换成react打包后的本地文件地址。注意:react打包以后可能会出现各种各样的的问题,这里我就遇到了一个问题。就是开发的时候页面正常显示,打包成静态文件以后点击空白,一开始以为是没有设置homepage,检查之后发现不是这里的问题。后来经过多方面排查发现路由用的是BrowserRouter,对应的地址必须是服务器

2020-06-06 15:29:30 1076 2

原创 electron优化页面显示逻辑(三)

electron优化页面显示逻辑(三)在确定功能组成后,将不同功能划分为了不同的页面。由于使用的UI是antd,于是就将页面做成了侧边导航栏的形式。但是在实际操作中发现当切换slider的时候,当前页面的计时器会清空。用户必须手动结束当前页面的计时后才能查看其他页面的信息。这样用户的体验感就不太好。就打算把主计时窗口单独为一个window,其他页面做到另一个窗口,互不影响。通过系统托盘扩展菜单的形式以供用户选择不同的窗口。这样即使用户查看更多信息,也不会影响主页面的进程。...

2020-06-06 15:28:51 434

原创 electron设置BrowserWindow(二)

electron之BrowserWindow的常用设置在设置完main.js以后就可以在electron生成的window里面利用react+antd显示业务效果了。创建BrowserWindow需要在main.js也就是主进程里面创建。关于BrowserWindow的相关属性可以参考官网BrowserWindow。这里主要记录的是如何实现在点击关窗口的闭按钮时隐藏浏览器窗口而不是真正的关闭。监听窗口关闭事件事件: ‘close’返回:event Event在窗口要关闭的时候触发。这是

2020-06-06 15:28:01 4744

原创 electron与react结合开发(一)

创建react项目按照官网步骤进行操作即可引入electron注意:引入electron的时候可能会因为网络原因导致失败,建议替换成国内源npm config set ELECTRON_MIRROR=https://npm.taobao.org/mirrors/electron/使用yarn将npm换为yarn即可创建main.js可以参照electron官方示例。在根目录下创建main.js// Modules to control application life and create

2020-06-06 15:27:15 3751 1

原创 JS红宝书(一)笔记之 Array

Title: JS红宝书(一)ArrayDate: 2020-05-18 11:06categories: JS红宝书tags:ArrayArray栈方法push()接受任意数量的参数,把他们逐个添加到数组末尾,并返回修改后数组的长度。pop()从数组末尾移除最后一项,减少数组的length值,然后返回移除的项。队列方法shift()移除数组中的第一项并返回该项,同时将数组长度减一。unshift()在数组的前端添加任意一个项并返回数组的长度。.

2020-06-06 15:26:21 169

原创 MusicLearning项目开发

一站式音乐学习平台一款集学生端,教师端,管理员后台于一体的综合学习管理平台,从课堂到线下形成一套完整的管理体系。框架Create React AppAntV/G2用户角色学生教师管理员主要功能基础信息管理学生作业管理老师管理音乐练习管理课堂管理资讯通知管理等。。。。。。学生接收信息资讯选择上课教师选择上课种类预约时间课堂反馈及评分网上报名赛事等…教师接收信息管理文件上传汇报讯息接收学生管理学生数据图表查看课下反馈等…管理员

2020-06-06 15:25:10 154

原创 mac系统下连接云服务器

1. 打开终端输入sudo -i 获取超级用户权限输入密码2.ssh root@IP3.输入服务器密码服务器查看防火墙状态: systemctl status firewalld.service绿的running表示防火墙已开启执行关闭命令:systemctl stop firewalld.service再次执行查看防火墙命令:systemctl status firewalld.service执行开机禁用防火墙自启命令 :systemctl disable firewalld.se

2020-06-06 15:23:58 2090

原创 linux云服务器常用操作

nginx不同端口映射到80端口,http和https同时请求location / { proxy_pass http://localhost:8090; proxy_redirect default ;}location /xcx/{ proxy_pass http://localhost:8091/; proxy_redirect default;}location / { proxy_pass http://localhost:8090;

2020-06-06 15:23:16 3667

原创 hexo博客部署并同步更新到服务器

hexo博客部署并同步更新到服务器使用github pages部署博客虽然可以避免服务器过期这样的情况,但是国内访问速度实在是太慢。所以可以将代码托管到github同时使用webhook实现GitHub与服务器同步推送代码。购买服务器注意:国内的服务器有学生有优惠套餐,但是只可选择大陆地区的服务器,并且大陆地区服务器需要备案才能使用,备案流程麻烦并且时间长。但是比较便宜。可以根据需求自行选择。这里我使用的是宝塔控制面板,方便直观的操作。后期如有需要使用其他类型的可重置系统。购买域名域名可以选择

2020-06-06 15:22:09 1156 6

转载 Cookie、LocalStorage、SessionStorage的区别

基本概念CookieCookie 是小甜饼的意思。顾名思义,cookie 确实非常小,它的大小限制为4KB左右。它的主要用途有保存登录信息,比如你登录某个网站市场可以看到“记住密码”,这通常就是通过在 Cookie 中存入一段辨别用户身份的数据来实现的。localStoragelocalStorage 是 HTML5 标准中新加入的技术,它并不是什么划时代的新东西。早在 IE 6 时代,就有一个叫 userData 的东西用于本地存储,而当时考虑到浏览器兼容性,更通用的方案是使用 Flash。而如今

2020-06-06 15:20:14 107

原创 小程序如何访问未备案的 API

如果你想要请求一个没有备案,或者没有 HTTPS 证书的 API,可以借助云函数环境下不受任何限制的 HTTP 请求来获取到数据,并通过云函数的返回,返回给小程序端使用.在开发小程序的时候,经常会用到一些第三方的 API。但是第三方的 API 往往会有各种各样的问题,比如:没有HTTPS没有备案小程序不支持其中的一些方法等等。但是,在业务中,我们又必须要使用这些接口,应该如何操作呢?使用云开发中转一个比较简单的方法,就是使用云开发来做中转。将有限制的小程序请求,转化为没有限制的云函数请求,

2020-06-06 15:17:24 2048 2

原创 react-chat

项目开发日志一1. 项目开发准备1). 项目描述: 整体业务功能/功能模块/主体的技术/开发模式2). 技术选型: 数据展现/用户交互/组件化, 后端, 前后台交互, 模块化, 项目构建/工程化, 其它3). API接口: 接口的4个组成部分, 接口文档, 对/调/测接口2. git管理项目的常用操作1). 创建本地仓库 创建.gitignore配置文件 git ...

2020-06-06 15:15:01 567 1

原创 为什么要用redux

为什么要使用redux动机核心概念JavaScript 需要管理比任何时候都要多的 state (状态)。 这些 state 可能包括服务器响应、缓存数据、本地生成尚未持久化到服务器的数据,也包括 UI 状态,如激活的路由,被选中的标签,是否显示加载动效或者分页器等等。管理不断变化的 state 非常困难。要想更新 state 中的数据,你需要发起一个 action,用来描述发生了什么。强制使用 action 来描述所有变化带来的好处是可以清晰地知道应用中到底发生了什么。如果一...

2020-06-06 15:11:07 421

原创 国内npm镜像源设置

国内npm镜像源设置淘宝npm镜像搜索地址:http://npm.taobao.org/registry地址:http://registry.npm.taobao.org/cnpmjs镜像搜索地址:http://cnpmjs.org/registry地址:http://r.cnpmjs.org/使用方法:临时使用npm --registry https://registry.npm.taobao.org install express持久使用npm config set registry

2020-06-06 15:06:51 11376 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除