Vue.js 接入OAuth2
Vue.js 接入OAuth2什么是OAuth2OAuth(开放授权)是一个开放标准,允许用户授权第三方移动应用访问他们存储在另外的服务提供者上的信息,而不需要将用户名和密码提供给第三方移动应用或分享他们数据的所有内容,OAuth2.0是OAuth协议的延续版本
应用场景
第三方应用授权登录:在APP或者网页接入一些第三方应用时,时长会需要用户登录另一个合作平台,比如QQ,微博,微信的授权登录。
原生app授权:app登录请求后台接口,为了安全认证,所有请求都带token信息,如果登录验证、请求后台数据。
前后端分离单页面应用(spa):前后端分离框架,前端请求后台数据,需要进行oauth2安全认证,比如使用vue、react后者h5开发的app。
演示代码本机演示环境如下:服务端: https://laravel.test (Laravel(6.x)+passport PHP环境)客户端: http://localhost:8020 (Vue.js基础模板项目)
安装 vue-auth-client vue-axios axios123npm i axiosnpm i vue-ax ...
使用Charles抓包手机的https请求
使用Charles抓包手机的https请求在PC端可以比较方便地通过Chrome浏览器的开发者工具查看网页请求数据,到了手机端,特别是一些混合APP里面,网页的请求数据就不太容易看到,这个时候就需要借助Charles或者Fiddler等抓包工具来查看了.
Mac开启热点,供手机组成局域网Mac通过网线连上网以后,打开Mac的互联网共享,可以开启一个热点.
共享来源为网线端口(比如我是用USB以太网转换接口连的网,就选USB LAN)
共享的目标端口为 Wi-Fi
下方的Wi-Fi选项可以设置热点的名称和密码
Charles设置开启代理https请求是加密的.默认情况下,Charles抓取的内容是无法查看的,需要设置好证书才能解密
手机设置好代理并信任证书手机连上Mac开启的热点,点击热点右侧的图标,设置好http代理(IP填写Mac电脑USB网卡的IP,端口填写Charles代理设置步骤填写的端口),并将Charles证书保存到手机上
愉快地查看手机https请求报文
解决Hexo看板娘引起的页面重渲染
解决Hexo看板娘引起的页面重渲染原因由于hexo-helper-live2d的依赖项live2d-widget.js强行修改document.head的内容,增加样式,导致整个头部的资源重新加载了(包括头部引入的css文件),所以造成了页面重渲染.
解决方案
进入/node_modules/live2d-widget/文件夹,安装依赖npm install
按照下面代码片段修改/node_modules/live2d-widget/src/dialog/index.js文件
打包npm run build:prod
重新运行hexo1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071// 将以下代码删除document.head.innerHTML += `<style> .live2d-widget-dialog-container { wi ...
解决canvas在移动端上绘制模糊的问题
解决canvas在移动端上绘制模糊的问题在移动端盛行,高清屏基本上已经普及的现在,1px的css像素实际上代表了4个甚至更多的物理像素。但是由于我们的代码问题,我们1px的css像素和1个canvas像素画上了等号,也就导致了1个canvas像素实际需要填充4个甚至更多物理像素,为了保证图像平滑处理,在填充剩余的物理像素时采用了原先颜色的近似值,导致了图像的模糊。解决该问题最重要的一点是让1个canvas像素和一个物理像素挂等号
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130 ...
时间字符串格式问题在iPhone导致的显示异常
时间字符串格式问题在iPhone导致的显示异常问题常见的时间格式2020-10-17 21:55:00在PC和安卓上经过new Date()转化以后能正常返回Date,在iOS上却提示Invalid Date
解决方案将2020-10-17 21:55:00替换为2020/10/17 21:55:00
MariaDB无法登录[ERROR 1698(28000)]
MariaDB无法登录[ERROR 1698(28000)]新安装的MariaDB用mysql -u root -p无法登录,提示ERROR 1698(28000),但是用sudo mysql -u root -p能登录成功.但是PHP是无法通过sudo来登录的,所以需要修改MariaDB的设置.
安装MariaDB1sudo apt-get install mariadb-server
设置密码执行以下命令,按照提示输入密码
1sudo mysql_secure_installation
解决办法123456sudo mysql -u root -puse mysqlupdate user set plugin='mysql_native_password';flush privileges;exitmysql -u root -p
web全栈工程师在Mac下的开发环境搭建
web全栈工程师在Mac下的开发环境搭建开发依赖安装homebrew + git12/bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)"brew install git
Javascript全局依赖
nodejs
@vue/cli
less
nrm(npm镜像快速切换,官网下载依赖慢可以切换到淘宝,淘宝下载不了可以切回官网)1234brew install nodejsnpm install -g @vue/clinpm install -g lessnpm install -g nrm
PHP环境
php
swoole
composer
phpmd(代码美化)12345brew install phpbrew install phpmdbrew install composerpecl install redispecl install swoole
mysql redis12brew install mysqlbrew insta ...
SourceTree
SourceTreeGit客户端
运行平台:Windows,macOS
下载地址:https://www.sourcetreeapp.com
PS: 在Windows下安装提示需要注册,注册完成以后,经常卡在这个环节进行不下去了,建议下载3.1.3版本的,然后使用以下方法跳过注册.
下载链接: https://pan.baidu.com/s/1cWX9Lsn253tnbGYFsCV6Cw
提取码: f28x
下载并执行SourceTreeSetup-3.1.3.exe,会进入登录或注册bitbucket的界面
打开 %LocalAppData%\Atlassian目录,接着进入SourceTree目录,创建accounts.json文件,并修改accounts.json内容如下:
123456789101112131415161718192021222324[ { "$id": "1", "$type": "SourceTree.Api.Host.Identity.Model.Identit ...
OKHTTP3设置Timeout参数无效
OKHTTP3设置Timeout参数无效在使用okhttp3发送请求,用IP直接访问时,设置的超时时间是正常的.改成访问某个域名时,设置的超时时间是10s,但是实际测试是40s左右,程序才打印出错误信息.解决方法:自己实现一个okhttp3.Dns的类,处理域名解析超时问题.
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374import java.net.InetAddress;import java.net.UnknownHostException;import java.util.Arrays;import java.util.List;import java.util.concurrent.Callable;import java.util.concurrent.FutureTask;import java.util.concurrent.TimeUni ...
SpringBoot2 开启HTTP/2
操作流程
生成ssl证书
创建Spring Starter Project,并使用web和thymeleaf依赖
修改maven源,使用阿里服务器
使用undertow替换tomcat
修改项目配置,启用ssl和http2
创建自定义配置类,将http请求重定向到https
验证网站是否使用http/2
关键代码如下:pom.xml
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879<?xml version="1.0" encoding="UTF-8"?><project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-insta ...