- 博客(106)
- 收藏
- 关注
RSS订阅原创 部署Springcloud微服务架构项目问题总结
前言众所周知，Springcloud项目由一个个springboot项目组成，而springboot项目本身自带Tomcat，当我们想要部署springboot项目时，只要使用maven工具将其打成jar包，放到有java环境的系统，使用命令java -jar xxx.jar，即可成功运行起来。本文以微服务架构项目尚医通的后端部分为例子，作打包部署时遇到的问题总结。尚医通也是我学习的第一个微服务实战项目，网上有详细免费教程，课程最后没有讲到如何部署，经过调查研究有了此篇文章。项目结构截图展示到模块
2022-03-08 13:26:53
1035
2
原创 Nginx反向代理部署多个项目
需求假设现在有一个顶级域名ouou.com和三个二级域名white.ouou.com，blog.ouou.com，default.ouou.com，这4个域名都跟同一个IP进行绑定。三个二级域名分别对应三个不同的项目，我们希望通过不同二级域名访问同一个服务器，用Nginx做路由转发，到达不同的项目首页。默认配置当访问顶级域名时，与访问blog.ouou.com到达同一个项目。以下通过一个具体的例子进行讲解。本篇文章着重描述Nginx如何做路由转发，但也涉及部分部署的知识，为了本人学习记录所用，可以选择
2022-03-05 21:47:08
7531
3
原创 Nginx 根据不同域名做路由转发
需求假设现在有一个顶级域名ouou.com和三个二级域名default.ouou.com，blog.ouou.com，white.ouou.com，这4个域名都跟同一个IP进行绑定。三个二级域名分别对应三个不同的项目，我们希望通过不同二级域名访问服务器，用Nginx做路由转发，到达不同的项目首页。默认顶级域名与default.ouou.com到达同一个页面。环境Nginx：1.20.1Linux操作系统：CentOS7配置host文件本文实验环境在虚拟机上进行，如果使用服务器，应该用真实域名绑定
2022-03-05 20:25:10
10535
原创 远程链接MySQL报错
SpringBoot远程链接MySQL报错前言在进行远程数据库链接时，遇到了几个报错，感觉所有的坑都踩了一遍。在搭建完数据库后，要开启防火墙，并且开放3306端口，如果是阿里云服务器，要到阿里云后台安全组开启3306端口。在链接前应该首先检查配置文件是否正确，确保账号和密码信息正确环境jdk：1.8spring-boot-starter-parent：2.6.1druid-spring-boot-starter：1.2.8mysql：8.0.28Host * is not allowed
2022-03-05 12:06:35
1419
原创 CentOS手动安装JDK
CentOS手动安装JDK前言本文介绍在CentOS7中安装jdk1.8，jdk17，并展示切换jdk版本的方法下载jdk到Oracle官网下载，目前下载主页上有8,11,17三个版本，注意CentOS有多种架构，其中x64属于主流，根据自己CentOS架构选择安装包在**/usr/local/java**(没有就创建)目录下载wget https://download.oracle.com/otn/java/jdk/8u321-b07/df5ad55fdd604472a86a45a21703
2022-03-04 18:31:13
1213
原创 使用WordPress搭建个人博客
前言想了想还是打算写一个总结，遇到了很多坑，所幸全部踩过来了。本文实验全部在CentOS7进行，通过LNMP工具搭建WordPress个人博客。简介CentOS7：Linux发行版本之一LNMP：即Linux+Nginx+MySQL+PHP，一键安装包WordPress：网站搭建平台，用PHP语言和MySQL实现。搭建的网站属于轻量级，适合但不局限于作为个人博客。调查了一下，发现网上的个人博客一般使用WordPress或者HEXO搭建安装LNMP本文默认已经拥有CentOS7环境，无论是服务器
2022-03-03 10:43:38
3304
1
原创 使用VMware安装CentOS7
使用VMware安装CentOS7前言之前装过双系统玩，Ubuntu、Deepin都试过。记得狂热的我还买了一个16g的u盘制作成系统盘，专门拿来装系统。但是呢，系统装完之后，就束之高阁了，很少会用，因为在双系统模式下，开机后Window和Linux只能二选一，而大家都是用window或者macOS，各种兼容问题会让人抓狂。另外当时用Deepin虽然颜值不错，但是bug还是蛮多的，比如鼠标经常失效，不知道现在怎么样了。后来学习需要用到Linux环境，用上了虚拟机，发现是真香。从此我懂得了，技术服务于需
2022-03-01 20:46:42
277
原创 IDEA使用LeetCode插件
IDEA使用LeetCode插件前言我们习惯用idea编写、调试代码，在LeetCode上刷题时，如果能够在IDEA编写代码，并且做好代码管理和保存，是一件事半功倍的事情。对于后续复习题目，做笔记也会非常便利。本文目的在于介绍LeetCode Editor的使用，以及配置工具类，最终目录结构如下：note：放置笔记src：放置代码leetcode.editor.cn：插件LeetCode Editor自动生成utils：自定义的工具包，可用于自动化输入测试用例，定义题目需要的类（结构体）
2022-02-28 19:38:49
14768
2
原创 LeetCode 234.回文链表
题目给你一个单链表的头节点 head ，请你判断该链表是否为回文链表。如果是，返回 true ；否则，返回 false 。**进阶：**你能否用 O(n) 时间复杂度和 O(1) 空间复杂度解决此题？思路回文串的特征是从头到尾与从尾到头遍历的值一一对应相等，如12321，给定一条数据如果符合这个特征即可判断它是回文串。解法一：栈描述如果不考虑空间复杂度，这个问题就非常的简单，新建一个栈，遍历一遍链表，将数据压入栈中，再重新遍历一次链表并且数据出栈，如果值不相等，则不是回文串，如果全相等，则是回
2022-02-24 18:33:46
367
原创 VsCode使用Eslint格式化文件
0.前言JavaScript是非常灵活的语言，每个人编写JavaScript代码风格可能大有不同，为了规范化JavaScript编码风格，Eslint应运而生。Eslint是一个规范化代码风格的工具，不仅仅局限于JavaScript。统一的代码风格有利于团队协作和后期维护，绝不是一个可以忽视的小问题。本文介绍如何在Vscode中用Eslint插件格式化文件，由于编程习惯是指在按下格式化快捷键Alt+Shift+F时对当前文件进行格式化，而没有设置在保存时自动使用Eslint格式化文件。1.下载插件
2022-02-11 11:33:00
12068
原创 flex布局动效
需求描述有三块或以上的内容，鼠标移动上去时详情内容从下往上展现，鼠标移开时内容以相反动效隐藏。如下图所示↓需求分析如果用JS来写，那会非常的麻烦！这里运用fflex布局+transition，能够完美实现此动效，无需编写任何JS代码。美中不足是flex属性有些低版本的浏览器不支持。思路：父容器flex布局，子模块没个占比初始状态相同，当鼠标放上去时，修改这个值，模块撑开，使用transition设置css属性值的变化规则，即可看到模块逐渐拉伸和逐渐收缩的效果。至于模块里面的内容，同样使用这个策略，
2022-02-08 15:20:57
816
原创 监控鼠标滚动动画
需求之前在工作中遇到的需求。色块里面放了具体内容，有文字或文字加图片。要求并排的3个色块在鼠标往下滚动的过程中慢慢从下往上浮现，当滚动到一定距离后，色块内容更改，新的并排色块重新从下往上浮现，脱离动效后如果屏幕向上滚动，色块以相反效果展示。具体效果如下GIF所示，黑色部分是页面外的调试界面。问题分析上面的需求已经做了一层分析，将UI的想法抽象出来，用程序员的语言描述一遍，但这层分析还远远还不够。DOM结构设计难点在于整个动效DOM的结构设计。首先我们需要理解，页面在向下滚动的过程中，高度会不断
2022-02-07 01:01:37
871
原创 Markdown自定义CSS样式
前言当我第一次接触到Markdown时，我就深深爱上了它。这简洁的界面，编程式的书写都令我爱不释手，最重要的是，还能够支持自定义html、css。自定义CSS样式说到Markdown，就不得不提及Typora这个软件，本例子即是在此软件的环境下完成。想要自定义CSS，首先得有一定的htm，css基础。1.寻找Typora的主题CSS文件确认typora软件用的主题文件 -> 外观 -> 打开主题文件 -> 找到对应的css文件，因为我用的主题是Night，所以我应该找nigh
2022-01-30 16:34:40
5856
原创 Windows多版本JDK环境安装
Windows环境多版本JDK环境安装2022.1.290.前言在购入这台电脑时，最新的稳定版本是java14，所以就装了这个版本。后来工作学习中发现大部分人都用java8（jdk1.8），索性又配置了一个java8。现在最新版本已经来到17了，前几天，java社区的霸主框架，springboot发布3.0 M1版本，将全面拥抱java17。软件终将需要更新换代，虽然java8稳定优秀，但未来肯定会被逐步取代。顺便提一下，软件版本保持一致实在是太有必要了，不然版本兼容这些奇奇怪怪的问题足够把人整垮，
2022-01-29 15:09:42
1588
原创 CentOS7用yum方式安装MySQL
0.卸载MySQL如果系统完全没有安装过mysql，可以忽略，其实这里有某种悖论，但有人可能安装过程中出错或者打算重装，所以这一步是有必要的，在安装前务必先把原来的清理干净查看MySQL安装文件rpm -qa | grep -i mysql逐个卸载yum remove mysql-community-client-8.0.28-1.el7.x86_64yum remove mysql80-community-release-el7-5.noarchyum remove mysql-
2022-01-27 01:23:43
3009
原创 分支冲突的原因
以现在浅薄的认知，遇到产生分支冲突的情况主要有两种，也可看成一种（同一个文件同一行）：1.情况一：A、B拉取了同一个分支同一个版本的代码，并且在同一个文件的同一行上做了不同的修改，A首先完成开发任务并且提交代码，B在之后也完成了开发任务，此时为了保持代码同步，B需要首先将修改文件提交到本地的git仓库，然后拉取最新的代码，此时冲突会产生。冲突原因在于A、B都改了同一个文件的同一行代码，B在拉取完代码后会紧接着做提交操作，那么在两个人都改过的行中应该用哪个人提交的代码呢？由于这个原因机器是无法做出判断的，
2021-05-20 17:30:52
1093
原创 Javascript 通用函数
虽然是通用函数，但可能并不常用，或者有很多替代方案，以此记录致敬《JavaScript Dom编程艺术》一书1.addLoadEvent(func)以上方法相当于一个容器，存放页面加载完成后需要执行的方法，只需将需要执行的方法的方法名作为参数调用此方法即可function addLoadEvent(func) { let oldonload = window.onload; if (typeof window.onload != 'function') { window.onl
2021-05-07 00:20:15
137
原创 Failed to execute ‘setRequestHeader‘ on ‘XMLHttpRequest‘: Value is not a valid ByteString.
报错原因：Ajax请求头部信息有中文，注意是头部信息header不是内容解决方法：可以跟后端协调商量，更改为非中文信息，或者使用编码函数encodeURI()对信息进行编码等一次事故：这个问题排查了很久。在vue项目中，发起一次上传数据的请求后，第二次再重新上传，发现报了一个获取不到某个字段的错误，很纳闷，同样的操作，第一次成功，为什么第二次就失败了呢？后端说它这边没有报错信息，把问题甩给了前端。定位到报错的那一行代码，发现是发起请求后进入了一个error函数，随即把这个错误打印出来。即标题所示的错
2021-04-30 10:50:36
2258
原创 JavaScript 获取url参数及解决中文乱码问题
1.获取url参数方法一： // 获取url参数 function getQueryVariable(variable) { var query = window.location.search.substring(1); var vars = query.split("&"); for (var i = 0; i < vars.length; i++) { var pair = vars[i].split("=");
2021-04-30 10:08:06
1465
原创 ios端input输入框光标延长问题
问题描述：输入框聚焦时，光标的长度不以输入框默认文字高度相等，而是延长至与input输入框父元素高度相等。同样的代码，在浏览器和Android都不会出现此问题，但是在ios的部分机型中出现了。代码例子：<!DOCType html><html><head> <meta charset="utf-8"> <style> .out-part { background-color:
2021-04-20 23:59:05
294
原创 JQuery Ajax更新dom后点击方法失效问题
背景：本人在dom加载完成后，执行一个Ajax请求页面的导航栏标题，数据请求往后通过操作dom更新到页面上，并写好了绑定该元素的点击方法，但是发现点击方法无效$(element).click(function() { do something...})分析原因：Ajax请求是在dom首次加载完成后执行，然后再动态更新到dom，而上面对元素绑定的点击方法，是在dom首次加载完成后进行绑定，此时Ajax请求可能刚发出，当dom重新加载完成后，此时click事件不会重新绑定，即click事件绑
2021-04-19 10:03:56
676
1
原创 前端面试题
这些都是血淋淋的教训希望大家引以为戒1.em,rem,px的区别，为什么要设置这么多长度单位？https://cloud.tencent.com/developer/article/1538359https://segmentfault.com/a/11900000075269172.restful架构是什么？restful API 设计规范？http://www.ruanyifeng.com/blog/2011/09/restful.htmlhttp://www.ruanyi.
2021-04-01 20:55:25
160
1
原创 JS阻止事件冒泡event.stopPropagation与阻止默认事件event.preventDefault
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l.
2021-03-31 21:39:32
292
原创 css3 transform属性
本文详细介绍tranform属性，通过逐步制作一个可转动正方体的例子介绍此属性首先看下最终的效果：1.用法格式transform：字面解释即变形，对元素的图形进行转变，支持元素从2D向3D转换，即可展示3D的元素transform的值有rotate（旋转）、skew（扭曲）、scale（缩放）、translate（平移）和matrix（矩阵变形）本文介绍rotate（旋转）和translate（平移）上述效果用此两个属性值即可完成，具体属性值介绍请移步MDN或W3School
2021-03-26 23:55:26
1386
1
原创 ES6新增的部分语法
1.let和constlet和const的出现是为了弥补var，其中let是声明变量，const是声明常量，这两个变量主要解决了以下两个问题（1）变量提升var变量会发生‘变量提升’现象，即变量在声明之前使用，值为undefinedconsole.log('testVar:', testVar) // testVar: undefinedvar testVar = 17console.log('testLet', testLet) // 报错ReferencEerrorlet te
2021-03-16 15:28:37
230
原创 JS 常用对象方法总结
1.Object.create()新建一个对象，将原对象作为新对象的原型对象，新对象继承原对象的属性和方法2.Object.assign()3.Object.is()4.Object.getOwnPropertyDescriptors()遍历对象属性相关方法5.Object.keys()6.Object.getOwnPropertyNames()7.Object.getOwnPropertySymbols()8.Object.ownKeys()9.Obje..
2021-03-11 02:10:51
1617
原创 JS 常用数组方法总结
以下数组方法接收一个回调方法（callback）作为第一个参数，给回调方法传入的第一个参数为数组元素forEach：遍历每个元素，没有返回值map：遍历所有元素，对每个元素进行处理（callback），返回处理后的新数组，原数组不变find：找出第一个符合条件的成员，返回该成员findIndex: 找出第一个符合条件的成员，返回该成员的下标some：若数组中存在一个符合条件的成员，返回true，否则返回falseevery：若数组中所有成员都满足条件，返回true，否则返回false
2021-03-08 02:10:39
338
4
原创 用CSS绘制三角形
归根结底，用CSS绘制三角形，就是利用边框(border)特性进行绘制平时我们用border可能用的很多，但是一般都会统一设置所有边框的颜色，很少研究每个方向的边框具体样式是怎样的。现在先来看一个简单的例子，我们分别设置每个方向的边框的颜色，元素宽高是100px<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport"
2020-12-16 17:22:31
279
原创 HTML 背景图布满整个div
在编写HTML代码时，偶尔会遇到这种情况，我们要展示的背景图的大小与实际的div大小不一致（此时的背景图是静态资源而非接口请求数据）。设置背景图的css是background: url(...) 假设现在有一张背景图的长宽是100px*100px， 而外层的div大小是400px*400px，那么根据以下代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">
2020-12-07 10:18:07
11009
1
原创 小程序 制作自定义弹层 添加弹层显示和隐藏动画 父组件与子组件（自定义组件）之间传值
0.说明与效果本文打算用一个具体的例子，总结下这些开发过程中学习到的知识：1.制作自定义组件，并在页面中引用2.自定义组件的内容是一个表单弹层，添加弹层在弹出和隐藏时的动画3.展示父组件与子组件（自定义组件）的传参功能看下最终的效果图：1.设置自定义组件，并在页面中引用官网传送门其实步骤很简单1.在跟目录中创建components目录（用于放置自定义组件，在此目录下再创建组件目录，新建组件时记得选择 ‘新建Component’ 即可如果创建成功，打开js...
2020-11-17 17:30:02
2026
6
原创 小程序 通讯录
实例效果：实现功能：1.上下滑动通讯录，右侧导航栏与顶部跟随响应2.点击右侧导航栏，通讯录跳转到响应位置思路：1、通讯录内容用scroll-view包住，利用scroll-view提供的bindscroll方法，此方法在滚动时触发（要给scroll-view添加一个默认高度，这个默认高度一般是手机屏幕默认高度，否则可能无法触发方法，因为scroll-view此时视为没有滚动）。方法触发时，能够通过参数获取屏幕实时高度，创建一个数组存储每一组（A、B、C...）的屏幕高度，通过比较控制
2020-10-14 12:06:31
1216
2
原创 单行、多行字段太长，用...表示
这个功能在前端开发中实在是太常见了，只要是一段文本的展示，常常都要做此处理，限制文本的长度，超出部分用...表示，这里提供一种解决方案，直接上css代码（一些浏览器可能不兼容）：单行：overflow: hidden;text-overflow: ellipsis;white-space: nowrap;多行:overflow: hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-line-clamp:2; -
2020-10-13 17:17:35
388
原创 小程序 自定义弹窗
小程序提供了丰富的交互API，如wx.showToast、wx.showModal，但有时并不能满足我们的需求，这篇博文提供了一个实现自定义弹窗的思路。结合一个简单案例，看下最终的效果：我们要做的事情是，点击按钮时，弹窗出现，弹窗以外的区域变成透明，点击此区域，弹窗消失，弹窗中也可设置取消按钮。实现思路：弹窗和背景（灰色区域，铺满整个页面）都占据标签，用if控制该区域是否显示，点击按钮时，两片区域显示，用z-index标签设置堆叠顺序，我将背景的z-index值设为1，弹窗设置为2，这.
2020-10-13 16:48:23
1653
原创 小程序 跳转到tabbar页面 报错
我们习惯用wx.navigateTo做跳转链接，但是如果要跳转到tabbar页面，会报以下错误：其实如果仔细查看官方文档，就能发现用官方提供的另一个API，wx.switchTab即可解决问题：
2020-10-13 15:07:31
543
1
原创 小程序 动态更改数组中对象的某个值
小程序支持数据双向绑定，但是在逻辑层（js文件）中改变属性的值时必须要用this.setData({ a:A, b:B})这种格式，问题在于，当需求仅需要更改 某个数组中对象的某个属性值时，这种格式就需要转换一下。如： students: [ { name: '张三', number: '1234' }, { name: '李四', number: '1111' }, ...
2020-10-13 14:50:36
1685
3
原创 小程序 横向滚动导航栏
先上案例最终效果：案例实现功能：1.导航栏横向滚动效果2.当前项目有下划线标识3.点击项目，导航栏滚动到相应位置以下将分步骤逐步完善陈述这些功能，最终会呈现所有代码1.引用组件scroll-view，达到滚动效果万丈高楼平地起，首先要达到横向滚动的效果wxml<view> <scroll-view scroll-x="true" enable-flex="true" class="scroll"> <b...
2020-10-13 14:19:25
3787
原创 小程序 动态绑定class
微信小程序提供了比较便捷的语法，使我们能够快速地动态绑定class用法：<view class="{{ 表达式?'A':'B'}}" ></view>在一个标签的class里添加{{}}模板语法，模板里面是一个三元判别式，其中表达式一般引用data中的属性，表达式返回true或者false，A，B是class名，按照三元判别式的逻辑引用A或B。PS：当然可以同时引用多个，如<view class="E F {{表达式?'A':'B' }} {{表达式?'C...
2020-10-12 19:24:55
18212
4
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人