小郭在此-CSDN博客

原创 nginx 重启失败

问题描述/usr/local/tapd/nginx/sbin/nginx -s reload报错nginx: [error] open() “/usr/local/tapd/nginx-1.8.0-tlinux/logs/nginx.pid” failed (2: No such file or directory)解决方法/usr/local/nginx/sbin/nginx -c/usr/local/nginx/conf/nginx.conf/usr/local/tapd/nginx/

2022-04-28 19:42:54 2708

原创 git分支相关代码

添加新分支： git checkout -b [分支名]查看新分支：git branch切换分支： git checkout [分支名]添加到暂存区: git add . 也可以通过“+”来进行添加到本地仓库： git commit -m "注释"提交到远程服务器中： git push origin [分支名]撤销操作：git reset --soft HEAD^...

2021-07-27 20:55:20 159

原创静态页面和动态页面

静态页面在静态Web程序中，客户端使用浏览器连接到服务器上，使用HTTP协议发起一个请求，告诉服务器我现在需要得到哪个页面，所有的请求交给Web服务器，之后WEB服务器根据用户的需要，从静态页面的磁盘取出内容，通过Web服务器返回给客户端，客户端接收到内容之后经过浏览器渲染解析，得到显示的效果。为了让静态web页面显示更加好看，利用JavaScript/AJAX等技术。但是这些特效都是在客户端上借助于浏览器展现给用户的，所以在服务器上本身并没有任何的变化。静态web无法连接数据库；静态web资源开

2021-07-17 23:26:41 287

原创服务器渲染

一、浏览器端渲染CSR：是Client Side Render简称，页面上的内容是由js文件进行渲染的，js文件在浏览器上运行，服务器返回一个html模板过程：用户发送请求，返回页面，此时页面是一个模板页面，通过js解析，通过接口去读数据，利用模板进行渲染，注入网站内容，不便于爬取二、服务器端渲染SSR：是Server Side Render简称，页面有服务器渲染生成，浏览器直接进行显示过程：用户发送请求，后端先获取一些数据，通过其渲染引擎利用模板进行页面的渲染，渲染好之后由后端将注入好的数据

2021-07-14 13:41:17 413

原创 React与Vue对比

1、组件化方面模块化：是从代码的角度来进行分析的，即把一些课复用的代码，抽离未单个模块，便于项目的维护和开发。组件化：是从UI界面的角度来进行分析的，即把一些可复用的UI元素，抽离为单独的组件。组件化的好处：项目规模增大，组件会增多，组件化开发就可以很方便的将现有组件拼接成一个完整的页面。Vue中的组件化：通过 .vue 文件来创建对应组件 .vue模板文件中的内容：template 结构（内容）script 行为style 样式React实现组件化：Re

2021-06-21 21:13:34 283

原创 Symbol

Symbol是六大数据类型之一，其余的有Undefined、Null、Boolean、Number、String。它是ES6中新增的，其实例时唯一不可变的。且不可以与 new 同时使用基本用法在使用时，需要初始化 Symbol() 。let a = Symbol('a');let b = Symbol('a');console.log(a);// Symbol(a)console.log(b);// Symbol(a)console.log(a == b);// false 创建全局对象

2021-06-15 18:11:43 87

原创 JS常见报错信息

RangeError范围错误，即当一个值不在其所允许的范围或者集合中。当试图传递一个number参数给一个范围内不包含该number的函数时则会引发RangeError。当传递一个不合法的length值作为Array 构造器的参数创建数组，或者传递错误值到数值计算方法（Number.toExponential()，Number.toFixed() ，Number.toPrecision()），会出现RangeError。ReferenceError引用错误，即当引用一个不存在（被删除）的变量时引起的

2021-06-10 11:40:54 702

原创严格模式的部分差异

在ESCMAScript5中增加严格模式。目的：消除代码运行的一些不安全之处，保证代码运行的安全；提高编译器效率，增加运行速度；为未来新版本的Javascript做好铺垫。使用方式：在代码头部增加 "use strict";"use strict";var x;x=3;console.log(x);限制：不能使用为声明的变量（在正常模式下，未声明就赋值的变量默认为全局变量）"use strict";x=3; x=3;function aaa() {

2021-06-07 20:28:36 84

原创 HTML和XML

HTMLHTML：超文本标记语言，是一种标记语言。它包括一系列标签，通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。特点：简易性：采用超集方式，更加方便可扩展性：增加标识符等平台无关性：个人计算机或者MAC均可使用通用性：可以被其他任何人、任何类型的电脑均可访问XML可扩展标记语言，标准通用标记语言的子集，简称XML。它可以用来标记数据、定义数据

2021-06-06 14:18:23 509 1

原创 vue组件通信方式 --父子组件通信

父子组件通信方式子组件通过 props 属性来接受父组件的数据，然后父组件在子组件上注册监听事件，子组件通过 emit 触发事件来向父组件发送数据。通过 ref 属性给子组件设置一个名字。父组件通过 $refs 组件名来获得子组件，子组件通过 $parent 获得父组件，这样也可以实现通信使用 provider/inject，在父组件中通过 provider 提供变量，在子组件中通过 inject 来将变量注入到组件中。不论子组件有多深，只要调用了 inject 那么就可以注入 prov.

2021-04-25 20:37:35 158

原创 CSRF攻击

CSRF：跨站请求伪造攻击。主要是攻击者诱导用户进入第三方网站，若用户在被攻击网站保存信息，攻击者窃取后，绕过后台向服务器执行操作。主要利用的是cookie在同源请求中可以被携带发送给服务器的特性。类型：Get型Post型链接型，如存在于 <a></a> 标签中防护同源检测：利用请求头中的refer或origin进行检测，但refer信息因为可以被伪造，所以安全性不高token验证：在第一次请求后由服务器生成的随机数，保存在客户端中，再次请求时，请求体中包含该数

2021-04-18 18:40:51 101

原创 XSS攻击及预防

XSS跨域脚本攻击，即在渲染DOM树的过程中发生了不在预期内执行的JS代码。访问劫持用户会话，插入恶意内容、重定向用户、使用恶意软件劫持用户浏览器、繁殖XSS蠕虫，甚至破坏网站、修改路由器配置信息等。分类持久性跨站：危害最大的一种，跨站代码存储在服务器（数据库）中非持久性跨站：最常见的一种，网页中会存在嵌入好的恶意链接，用户点击后触发DOM跨站：客户端的脚本程序可以通过DOM动态地检查和修改页面内容，它不依赖于提交数据到服务器端，而从客户端获得DOM中的数据在本地执行，如果DOM中的数据没有经过

2021-04-08 23:23:30 741

原创 ES6

ES6一、Set1. 基本用法var arr= [1,2,2,3,4,5,3,4,1]console.log(arr)const s = new Set(arr)console.log(s)var next = Array.from(s)console.log(next)2.实例的属性和方法属性Set.prototype.constructor：构造函数，默认为Set函数Set.prototype.size：返回Set实例的成员总数方法add(value)：添

2021-04-06 12:38:07 111

原创节流与防抖

相同点节流与防抖都是为了限制函数的执行频次，优化函数因触发过多响应速度跟不上出现的卡顿问题。区别<div id="div"style="background-color: aqua;width: 500px;height: 500px;"></div> <script> var newDiv = document.getElementById("div") newDiv.onmousemove = function(e){

2021-04-03 23:48:37 620

原创 js复习

基本语法JavaScript无类型语言：即声明变量时不需要指定类型一、执行顺序顺序执行，浏览器顺序加载二、语法对大小写敏感语句末尾的分号可有可无常量：const 常量名 = 常量值变量：全局变量：函数体外不定义的变量（var 变量名）局部变量：函数体内部或语句块内定义的变量（let 变量名）数据类型：数字型：整数、浮点数字符型：单引号或双引号括起来的一串内容布尔型（逻辑型）：true、false特殊类型：NULL、Underfined、NaN运算符

2021-03-31 20:05:51 223

原创请求方式

get：用于传输数据，会返回实体post：用于传输，数据会被包含在请求中，比get请求安全一些put：将用户请求更新到相应内容中delete：用于删除数据head：类似于get请求，没有返回内容，用户获取报头options：允许客户端查看服务器性能，如，服务器支持的请求方式等connect：可将连接改为管道方式的代理服务器...

2021-03-25 08:42:04 86

原创 MVC与MVVC

MVC（Model-View-Controller）模型–视图–控制器模式，该模式用于应用程序的分层开发Model（模型）：存储数据的对象。带有逻辑，在数据变化时更新控制器View（视图）：数据的可视化Controller（控制器）：控制器作用与模型和视图上。控制数据流向模型对象，在数据变化时更新视图。使视图与模型分离开MVVM（Model-View-ViewModel）模型–视图–视图模型模式。是MVC的改进版Model：代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑

2021-03-18 18:41:22 504 2

原创 cookie、loacalStorage、SessionStorage

对比CookieSessionStorageLocalSTorage传递方式在服务器和浏览器间传递不会自动把数据发给服务器，存储在本地不会自动把数据发给服务器，存储在本地大小4KB5MB5MB有效时长可以设置有效时长当前浏览器关闭前有效始终有效会话跟踪技术：一、cookie特点：有服务器创建，保存在服务端容量不超过4K创建过程：使用new创建cookie对象设置cookie对象的生命周期将cookie对象绑定到respons

2021-03-17 18:44:12 168

原创 nodejs的加密方式

nodejs的加密方式一、加密算法为了保证数据的安全性和防篡改，很多数据在传输中都进行了加密加密可分为三大类：对称加密、非对称加密、摘要算法二、对称加密采用单钥密码系统的加密方法，同一个密钥可以同时作用信息的加密和解密。该方法称为对称加密，也称为单密钥加密。主流有AES、DES，AES 是新一代的标准，速度快，安全级别更高。1.AES：共有五种加密方式：ECB、CBC、CTR、OCF、CFB 区别：ECB的只用一个密钥即可，比较简单，利于计算，其他的除了一个密钥

2021-03-14 13:02:28 1785

原创数据转化

数据类型能转化为True能转化为false的值BooleanTRUEFALSEString任何非空字符空字符Object任何对象NULLNumber任何非零数值0和NULL

2021-03-13 14:05:01 86

原创 Vue常用指令及介绍

Vue 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。Vue对象的属性new Vue({ el: '' //用于绑定页面中的控件 data: '' //设置绑定在控件上的变量的值（通过指令） created: '' //当Vue对象创建时首先执行其内代码 methods: '' //用来定以控件绑定的事件处理函

2021-03-09 23:08:35 152

原创 vue安装

安装node.js官网下载地址：添加链接描述检测是否配置环境变量在cmd窗口中输入node -v如果没有显示版本号，则进入环境变量中将你下载文件的位置配入path中下载淘宝镜像，可以加快下载速度，npm指令从外网速度较慢npm install -g cnpm --registry=https://registry.npm.taobao.org在cmd窗口中输入cnpm -v如果没有显示，则同样需要配置。找到你下载cnpm.exe的位置将改地址配入环境变量中D:\node..

2021-03-04 09:44:07 229 1

原创动画keyframes

实现效果：css代码* { padding: 0; margin: 0;}.heart { postion: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100px; height: 100px; background-color: #f00; /* 逆时针旋转45° */ transform: rotate(-45deg); /* 动画名 */ animation-na

2021-02-24 12:29:53 80

原创 Vue+Mysql+ajax+node.js跨域访问

- node.js项目安装项目npm install安装nodemon监视node.js应用程序发生的任何改变npm install -g nodemon并在package.json文件下更改scripts中数据"scripts": { "start": "node ./bin/www" },安装MySQL模块npm install mysql// 引入MySQL模块var mysql = require('mysql')// 数据库连接池var po

2021-02-24 00:26:36 340

原创三次握手/报文

TCP握手协议第一次：客户端发送SYN（同步序列编号）包到服务器，并进入SYN_SENT状态，等待服务器确认。第二次：服务器收到SYN包，确认客户的SYN，并给自己发一个SYN，即SYN+ACK包，并进入SYN_SENT状态。（ACK即确认字符）第三次：客户端收到服务器的SYN+ACK包，向服务器发送确认包ACK，此包发送完毕，客户端和服务器进入ESTABLISHED（TCP连接成功）状态，完成三次握手。TCP报文格式中的控制位由6个标志比特构成，其中一个就是ACK，ACK为1表示确认号有效

2021-02-22 14:49:31 194

原创 HTTP和HTTPS的区别

HTTP：超文本传输协议，是一个客户端和服务器端请求和应答的标准，用于从www服务器传输超文本到本地浏览器的传输协议。它可以使浏览器更加高效，使网络传输减少。其传输的数据都是未加密的，即明文。一般其端口号为80。HTTP的工作原理客户端的服务器首先要通过网络与服务器建立连接，该连接是通过TCP 来完成的。建立连接后，客户机发送一个请求给服务器，请求方式的格式为：统一资源标识符（URL）、协议版本号，后边是 MIME 信息包括请求修饰符、客户机信息和许可内容服务器接到请求后，给予相应的响应信息，

2021-02-22 12:39:14 85

原创 BFC（块格式化上下文）

FC(Formating Context)是W3C CSS2.1规范中的一个概念，定义的是页面中的一块渲染区域，并有着一套渲染规则。决定器子元素将如何定位，以及和其他元素的关系的相互作用。其中有：BFC（Block Formating Context）块级格式化上下文IFC（Inline Formating Context）行内格式化上下文GFC（GridLayout Formating Context）网格布局格式化上下文FFC（Flex Formating Context）自适应格式化上下

2021-02-02 00:24:13 94

原创重排跟重绘

重排：DOM变化影响到元素的几何属性，浏览器重新计算元素的几何属性，其他元素的几何属性也会受到影响，重新渲染树。此过程称为重排重绘：受影响元素重新绘制在屏幕上的过程称为重绘。引发重排的条件：页面初次渲染增加或删除可见的DOM元素元素位置的改变元素尺寸的改变浏览器窗口尺寸的改变...

2021-02-01 23:20:24 131 1

原创 canvas 和svg

canvascanvas是html5里面新增的标签，类似与一个画布，其绘制出来的图形是一个矢量图，可以在canvas中引入jpg或png这类格式的图片。在实际开发中，大型的网络游戏都是用canvas画布做出来的，并且canvas的技术现在已经相当的成熟。canvas绘制的图形不能被引擎抓取，通常通过JavaScript来实现svg（可缩放矢量图形）svg是用XML（超文本扩展语言）技术描述的二维图形语言，绘制出来的是矢量图，不能引入普通图形。因为其不会失真，故利用其来实现动态的小图标。svg绘制的

2021-01-29 15:46:49 163

weixin_48062613的博客