小奏

【动静分离和URLRewrite】 动静分离介绍 为了提高网站的响应速度，减轻程序服务器（Tomcat，Jboss等）的负载，对于静态资源，如图片、js、css等文件，可以在反向代理服务器中进行缓存，这样浏览器在请求一个静态资源时，代理服务器就可以直接处理，而不用将请求转发给后端服务器。对于用户请求的动态文件，如servlet、jsp，则转发给Tomcat，Jboss服务器处理，这就是动静分离。即动态文件与静态文件的分离。 动静分离可通过location对请求url进行匹配，将网站静态资源（HTML，JavaScript，CSS，img等文件）与后台应用分开部署，提高用户访问静态代码的速度，降低对后台应用访问。通常将静态资源放到nginx中，动态资源转发到tomcat服务器中。 Nginx动静分离配置 动静分离是让动态网站里的动态网页根据一定规则把不变的资源和经常变的资源区分开来，动静资源做好了拆分以后，我们就可以根据静态资源的特点将其做缓存操作，这就是网站静态化处理的核心思路; 在102这台服务器中的nginx的html目录中放入这样的资源 其中路径引入的方式需要以根路径的方式引 ...

【Nginx反向代理和负载均衡】 反向代理和正向代理 反向代理 描述:反向代理是指以代理服务器来接受连接请求，然后将请求转发给内部网络上的服务器，并将从服务器上得到的结果返回给请求连接的客户端，此时代理服务器对外就表现为一个反向代理服务器,而且整个过程对于客户端而言是透明的。 正向代理 描述:正向代理意思是一个位于客户端和原始服务器(origin server)之间的服务器，为了从原始服务器取得内容，客户端向代理发送一个请求并指定目标(原始服务器)，然后由代理向原始服务器转交请求并将获得的内容返回给客户端。 简单的说类似于采用VPN来访问google: 区别正向代理、反向 都是站在客户端的角度，看代理服务器是帮客户端代理，还是帮服务端代理 使用proyx_pass进行代理配置 浏览器访问虚拟机ip(比如：http://test1.dselegent.icu/)就会跳转到 http://www.bilibili.com，同时域名没有变化（不支持https） 12345678server { listen 80; server_name test1.dselege ...

【Nginx虚拟主机和域名解析】 虚拟主机使用特殊的软硬件技术，把一台运行在因特网上的服务器主机分成一台台“虚拟”的主机，每一台虚拟主机都具有独立的域名，具有完整的Internet服务器（WWW、FTP、Email等）功能，虚拟主机之间完全独立，并可由用户自行管理，在外界看来，每一台虚拟主机和一台独立的主机完全一样。 域名解析就是域名到IP地址的转换过程，IP地址是网路上标识站点的数字地址，为了简单好记，采用域名来代替ip地址标识站点地址，域名的解析工作由DNS服务器完成。 域名、dns、ip地址的关系 域名是相对网站来说的，IP是相对网络来说的。当输入一个域名的时候，网页是如何做出反应的？ 输入域名---->域名解析服务器（dns）解析成ip地址—>访问IP地址—>完成访问的内容—>返回信息。 Internet上的计算机IP是唯一的，一个IP地址对应一个计算机。 一台计算机上面可以有很多个服务，也就是一个ip地址对应了很多个域名，即一个计算机上有很多网站。 IP地址和DNS地址的区别 IP地址是指单个主机的唯一IP地址，而DNS服务器地址是用于域名解析 ...

【Nginx的目录介绍】 Nginx目录结构 1234567891011121314151617181920212223242526272829303132[root@localhost ~]# tree /usr/local/nginx/usr/local/nginx├── client_body_temp # POST 大文件暂存目录├── conf # Nginx所有配置文件的目录│ ├── fastcgi.conf # fastcgi相关参数的配置文件│ ├── fastcgi.conf.default # fastcgi.conf的原始备份文件│ ├── fastcgi_params # fastcgi的参数文件│ ├── fastcgi_params.default │ ├── koi-utf│ ├── koi-win│ ├── mime.types ...

【Nginx的安装和启动】 Nginx的介绍 Nginx (engine x) 是一个高性能的HTTP和反向代理web服务器，同时也提供了 IMAP/POP3/SMTP服务。Nginx是由伊戈尔·赛索耶夫为俄罗斯访问量第二的 Rambler.ru站点（俄文：Рамблер）开发的，第一个公开版本0.1.0发布于2004 年10月4日。 其将源代码以类BSD许可证的形式发布，因它的稳定性、丰富的功能集、简单的配 置文件和低系统资源的消耗而闻名。2011年6月1日，nginx 1.0.4发布。 Nginx是一款轻量级的Web 服务器/反向代理服务器及电子邮件（IMAP/POP3） 代理服务器，在BSD-like 协议下发行。其特点是占有内存少，并发能力强，事实 上nginx的并发能力在同类型的网页服务器中表现较好，中国大陆使用nginx网站 用户有：百度、京东、新浪、网易、腾讯、淘宝等。 版本区别 常用版本分为四大阵营 Nginx开源版 http://nginx.org/ Nginx plus 商业版 https://www.nginx.com openresty h ...

【Vue3组件通信方总结式】 通信仓库地址:https://gitee.com/jch1011/vue3_communication.git 不管是vue2还是vue3,组件通信方式很重要,不管是项目还是面试都是经常用到的知识点。 props props可以实现父子组件通信,在vue3中我们可以通过defineProps获取父组件传递的数据。且在组件内部不需要引入defineProps方法可以直接使用！ 父组件给子组件传递数据 1<Child info="我爱祖国" :money="money"></Child> 子组件获取父组件传递数据:方式1 123456789const props = defineProps({ info:{ type:String,//接受的数据类型 default:'默认参数',//接受默认数据 }, money:{ type:Number, default:0 }}) 子组件获取 ...

【Vue3自动导入配置】 自动导入组件库组件 unplugin-vue-components 安装 1pnpm install unplugin-vue-components -D 然后将下面的代码添加到 Vite 的配置文件。 Vite配置 12345678910111213141516171819202122232425// vite.config.jsimport { defineConfig } from 'vite'import Components from 'unplugin-vue-components/vite'import { ElementPlusResolver, AntDesignVueResolver, VantResolver, HeadlessUiResolver, ElementUiResolver} from 'unplugin-vue-components/resolvers'export default defineConfig(&# ...

【Router 4】 使用Vue3 安装对应的router4版本 使用Vue2安装对应的router3版本 1npm install vue-router@4 路由配置 与之前版本区别： 由 createRouter() 替换 new Router() 路由模式由 createWebHistory() 替换 mode: 'history' main.js中由 .use(router) 替换 new Vue({ router }) 以前版本写法： 1234567891011121314151617181920212223242526// router/index.jsimport Vue from 'vue';import Router from 'vue-router';import routes from './routes'Vue.use(Router);const router = new Router({ // 区别1 mode: 'history', // 区 ...

【Pinia】 pinia是什么？ 前言 Vue3已经推出很长时间了，它周边的生态也是越来越完善了。之前我们使用Vue2的时候，Vuex可以说是必备的，它作为一个状态管理工具，给我们带来了极大的方便。Vue3推出后，虽然相对于Vue2很多东西都变了，但是核心的东西还是没有变的，比如说状态管理、路由等等。再Vue3种，尤大神推荐我们使用pinia来实现状态管理，他也说pinia就是Vuex的新版本。 那么pinia究竟是何方神圣，本篇文章带大家一起学透它！ 如果你学过Vue2，那么你一定使用过Vuex。我们都知道Vuex在Vue2中主要充当状态管理的角色，所谓状态管理，简单来说就是一个存储数据的地方，存放在Vuex中的数据在各个组件中都能访问到，它是Vue生态中重要的组成部分。 既然Vuex那么重要，那么在Vue3中岂能丢弃！ 在Vue3中，可以使用传统的Vuex来实现状态管理，也可以使用最新的pinia来实现状态管理，我们来看看官网如何解释pinia的。 官网解释： Pinia 是 Vue 的存储库，它允许您跨组件/页面共享状态。 从上面官网的解释不难看出，pinia和Vuex ...

【TS类型声明 keepAlive】 Ts 类型声明使用 & 讲解 该文章未归纳完，那么多API肯定也说不完。。不过也涵盖了主要的组合式 API 的 TS类型。 核心：大部分都是运用API函数泛型来定义类型。 父组件相关的 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100<template> <el-button @click="onsub">测试</el-button> <input type="text" @change="handleChange" /> <child ref='childRef' : ...