静水流深，沧海一粟-CSDN博客

原创 React 第八章 React-router v6

URL参数处理：在单页面应用中，通常需要从URL中获取参数，例如页面的过滤条件、排序方式等。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就会更加高效。当用户点击网页中的链接时，浏览器不会刷新整个页面，而是通过 JavaScript 监听 URL 的变化，并根据新的 URL 加载对应的页面内容。在单页面应用中，页面只加载一次，所有的操作都是在页面上动态加载内容并改变 URL。后端路由主要用于处理URL的请求，将不同的URL请求映射到不同的逻辑处理函数上。

2024-03-10 14:58:40 1252

原创 json-server 快速搭建本地服务器

使用json-server，你只需创建一个JSON文件，定义其中的数据结构和数据，并将该文件作为参数传递给json-server。json-server会根据文件内容自动生成对应的API，并监听指定的端口。json-server非常适合前端开发人员进行本地开发和测试，因为它可以快速地创建一个模拟的后端服务器，无需依赖真实的后端API。同时，它还可以用作临时接口的提供者，方便和后端开发人员协同工作。它能够根据一个JSON文件自动生成API，并提供了对数据的增删改查的支持。文件中的数据作为API的数据源。

2024-03-10 14:57:37 401

原创 React 第七章 Hooks

Hook是React 16.8的新增特性。它可以让你在不编写class的情况下使用state以及其他的React特性。Hooks告别令人疑惑的生命周期例如下面的例子，相同的代码在不同的生命周期中存在了两份// 类组件super();count : 0document.title = `你点击了${this.state.count}次`;document.title = `你点击了${this.state.count}次`;

2024-03-06 10:16:41 1180

原创 React 第六章生命周期

生命周期是一个物体、生物或概念从诞生、成长、衰老到死亡的过程。React在组件的生命周期中提供了一系列的钩子函数（类似于事件），可以让开发者在函数中注入代码，这些代码会在适当的时候运行。生命周期钩子函数是属于类组件所独有的东西，但是从React 16.8推出Hooks以来，整体已经开始以函数组件为主，因此这里我们仅介绍一些常用的生命周期钩子函数。

2024-03-06 10:16:20 587

原创 React 第五章表单

的模式，将视图和视图模型进行绑定，视图模型的改变，会自然的带来视图的改变。开发人员需要专注在视图模型上面。因此，这里所谓的受控组件，本质上其实就是将表单中的控件和视图模型（状态）进行绑定，之后都是针对状态进行操作。中推荐使用受控组件来对表单进行操作，这样能够对表单控件的数据进行一个统一管理。，最重要的是要转换思想，这一步非常重要，往往也比较困难。节点，然后进行操作。而在现代前端开发中，采用的是。方案进行处理，此时替代的方案就是非受控组件。但是在某些特殊情况下，需要使用以前传统的。时代，开发人员需要获取到。

2024-03-04 22:23:26 541

原创 React 第四章组件状态与数据传递

每次点击按钮，虽然我们设置了四次 count，但是count只加了 1。在改变 count 值的时候，count 数据还没有改变，所以只加了1。中，如果子组件需要向父组件传递数据，同样是通过触发父组件传递给子组件的事件来进行传递。早期类组件被称之为有状态组件，就是因为在类组件中能够维护组件数据。中组件会存在层级关系，那么自然会涉及到组件之间进行数据的传递。执行后的数据，可以提前使用一个变量来存储计算结果，或者使用。的第二个参数，它是一个函数，这个函数会在。元素的事件中，则其是异步的，否则是同步。

2024-03-04 22:21:20 1031

原创 React 第三章组件与事件绑定

React。

2024-03-03 11:03:20 381

原创 Sora - 探索AI视频模型的无限可能

在AI技术不断进步的今天，从业者应积极拥抱变革，通过技能升级和终身学习来适应新的职业环境。这不仅有助于个人职业的可持续发展，也是对社会进步的贡献。让我们携手迎接AI时代，共同创造一个充满机遇和挑战的未来。Sora技术的问世，标志着AI在内容创作和媒体制作领域的一次重大飞跃。它不仅展示了AI在理解和生成复杂视觉内容方面的潜力，也为各行各业带来了前所未有的变革。从简化视频制作流程到改变广告创意的生成方式，Sora正在重塑我们对创意工作的认知。Sora技术的发展，让我们对未来充满期待。

2024-03-03 11:02:25 1565 1

原创 Pake 轻松构建轻量级多端桌面应用

利用 Rust 轻松构建轻量级多端桌面应用，支持 Mac / Windows / Linux。：可以使用「常用包下载」方式来体验 Pake 的能力，也可试试 Action 方式。：可以使用「命令行一键打包」，对 Mac 比较友好，Windows / Linux 需要环境配置。：假如你前端和 Rust 都会，那可试试下面的「定制开发」，可深度二次开发定制你的功能。

2024-03-02 11:00:42 506

原创 React 第二章 JSX

JSX是一种JavaScript的扩展语法，用于在React中编写组件的结构。JSX允许开发者将HTML结构和JavaScript代码混合在一起，使得编写React组件更加直观和简洁。通过使用JSX，开发者可以在JavaScript中直接编写类似HTML的标记，例如<div>、<p>等，同时可以将JavaScript表达式嵌入到标记中，使得动态的数据渲染变得更加方便。在React中，JSX被转换为React元素，然后由React进行渲染和更新。

2024-03-02 09:53:35 621

原创 NodeJs 第二十七章进程和线程

进程是计算机运行程序的实例，它是操作系统对一个正在运行中的程序的抽象。每个进程都有自己的地址空间，包括代码、数据、堆栈等，以及运行时所需的资源，如打开的文件、设备等。进程是操作系统进行资源分配和调度的基本单位，它可以独立运行、中断和恢复。一个应用程序，总是通过操作系统启动的，当操作系统启动一个应用程序时，会给其分配一个进程一个进程拥有内存空间，原则上不受其他进程干扰。进程之间是可以通信的，只要两个进程双方遵守一定的协议，比如ipc。

2024-03-01 10:10:57 917

原创 React 第一章概述

React起源于Facebook的内部项目，因为该公司对市场上所有框架都不满意，就决定自己写一套，用来架设Instagram的网站。React的实质其实是一个用于构建用户界面的JavaScript库。React主要用于构建UI。React于2013年5月开源，由于拥有较高的性能，代码逻辑简单，越来越多的人已开始关注和使用它。UIfn(state)由于React的设计思想极其独特，属于革命性创新，性能出众，所以，越来越多的人开始关注和使用，认为它可能是将来。

2024-03-01 10:07:33 878

原创 NodeJs 第二十六章 Node组成原理

Node.js是一个开源的、跨平台的JavaScript运行环境，依赖于Google V8引擎，用于构建高性能的网络应用程序。Node.js采用事件驱动、非阻塞I/O模型，使得它能够处理大量并发连接，适用于构建实时应用、高吞吐量的后端服务和网络代理等。Node.js广泛应用于Web开发、服务器端开发、实时通信、大数据处理等领域，被许多大型互联网公司和开发者使用和推崇。

2024-02-23 17:38:28 363

原创项目升级神器 Taze,告别查找单个依赖版本的烦恼

例如，taze major将检查所有更改并跳转到最新的稳定更改，包括主要更改（重大更改），或者taze minor跳转到同一主要版本中的最新次要更改。只需添加-r扫描包含它们的子目录package.json并一起更新。Taze 主要是用在项目重构或者项目升级的时候检查依赖版本。Taze 无需安装，可以直接执行 npx taze 即可。默认情况只会检查 package.json 依赖版本。使用taze.config.jsfile，您可以配置与命令相同的选项。要忽略范围，请显式设置允许的最大版本更改。

2024-02-23 17:37:28 384

原创 HTTP 第六章跨资源共享(CORS)

跨源资源共享（CORS，或通俗地译为跨域资源共享）是一种基于 HTTP 头的机制，该机制通过允许服务器标示除了它自己以外的其他源（域、协议或端口），使得浏览器允许这些源访问加载自己的资源。跨源资源共享还通过一种机制来检查服务器是否会允许要发送的真实请求，该机制通过浏览器发起一个到服务器托管的跨源资源的“预检”请求。在预检中，浏览器发送的头中标示有 HTTP 方法和真实请求中会用到的头。例如：运行在 https://baidu.com 的js代码使用向 https://google.com 发起请求。

2024-02-22 08:00:00 998

原创 NodeJS 第二十五章 XSS攻击和防御

是一种常见的网络安全漏洞，攻击者通过注入恶意脚本代码到受信任的网站中，使用户在访问该网站时执行该恶意代码。这种攻击通常发生在用户与网站交互的地方，如表单输入、评论框等。

2024-02-22 08:00:00 885

原创 NodeJs 第二十四章 CSRF攻击和防御

跨站请求伪造是一种攻击，它迫使最终用户在其当前经过身份验证的 Web 应用程序上执行不需要的操作，例如转移资金、更改电子邮件地址等。例如，这些非预期请求可能是通过在跳转链接后的 URL 中加入恶意参数来完成：对于在 https://www.baidu.com 有权限的用户，这个标签会在他们根本注意不到的情况下对 https://www.baidu.com 执行这个操作，即使这个标签根本不在 https://www.baidu.com 内亦可。：恶意网站把作为，通过模拟正常用户的操作，攻击其的站点。

2024-02-21 11:06:46 789

原创 websocket 实现原理和技术方案

WebSocket 是 HTML5 开始提供的一种浏览器与服务器进行全双工通讯的网络技术，用以取代轮询与长连接，使客户端浏览器具备像 C/S 框架下桌面系统的即使通讯能力websocket协议是建立在tcp协议之上的，建立连接需要三次握手。

2024-02-21 10:10:29 1678

原创 HTTP 第五章协议升级机制

协议升级不仅仅用于WebSocket，还可以将协议升级为 HTTP 2.0。这个机制是可选的。它并不能强制协议的更改（通常来说这一机制总是由客户端发起的）。如果它们支持新协议，实现甚至可以不利用 upgrade，在实践中，这种机制主要用于引导 WebSocket 连接。WebSocket协议是一个基于HTTP的协议，它在单个TCP连接上进行全双工通信。WebSocket主要功能是用来和服务端进行实时通信。如果想使用从0开始来实现WebSocket，你需要自己实现WebSocket协议，这需要深入理解。

2024-02-02 09:50:56 908

原创 HTTP第四章 HTTP/1.x 的连接管理

是一个 HTTP 的关键话题：打开和保持连接在很大程度上影响着网站和 Web 应用程序的性能。在 HTTP/1.x 里有多种模型：短连接、长连接和 HTTP 流水线。

2024-01-31 08:00:00 891

原创 HTTP第三章 HTTP 消息

消息是服务器和客户端之间交换数据的方式。消息由采用 ASCII 编码的多行文本构成。在 HTTP/1.1 及早期版本中，消息通过连接公开地发送。在 HTTP/2 中，消息被分到多个 HTTP 帧中。起始行(start-line)和 HTTP 消息中的 HTTP 头(HTTP headers)统称为请求头，而其有效负载被称为消息主体(body)。

2024-01-23 10:45:09 1023

原创 NodeJs 第二十三章客户端缓存

最后，通过客户端和服务器两位大佬的视角，来总结一下以上内容。

2024-01-23 08:00:00 2005

原创 NodeJs 第二十二章二维码

每个版本具有不同的容错能力，即可以容忍一定程度的损坏或污损而不影响信息的读取。是由一系列矩阵点(通常是白色或黑色的点)组成的图形，用于存储和传输信息。：适用于包含数字和一些字符的数据的编码模式，能够编码数字0到9，大写字母A到Z，以及一些符号字符。：适用于包含任意字符的数据的编码模式，能够编码所有的ASCII字符和部分非ASCII字符。：适用于包含一些特定的日文汉字字符的数据的编码模式，能够编码部分汉字字符。：适用于纯数字数据的编码模式，能够编码0到9的数字。取值范围是 1~40的数字。

2024-01-22 11:47:47 689

原创 NodeJs 第二十一章模版引擎

是一种用于生成动态网页的工具。它将静态的模板文件与动态的数据源相结合，生成最终的网页。模板引擎通常用于Web开发中，可以方便地将数据动态地插入到页面中，从而生成具有动态内容的网页。，开发者可以将网页的结构和内容分离开来，提高代码的可维护性和复用性。同时，模板引擎也提供了一种易于理解和使用的方式来生成动态网页，降低了开发的难度和复杂度。这些引擎提供了丰富的语法和功能，以满足不同的需求。它们通常支持循环、条件判断、过滤器等功能，使开发者能够更方便地进行网页开发。，不使用框架，属于早期前后端未分离的开发模式。

2024-01-22 10:34:41 411

原创 NodeJs 第二十章代理

但是在浏览器发送ajax 到服务端，服务端响应到浏览器会出现跨域。这个时候就需要配置代理，node 此时就可以充当这个角色。是一种中间服务，能够代理用户与网络资源之间的通信。代理服务器可以缓存网页内容、过滤网络流量或隐藏用户的真实IP地址等功能。在日常开发中，我们接触最多的是客户端发送ajax到服务端。创建了一个开发服务，充当代理角色。这个代理服务主要是利用。我们的感知是从客户端直接发送。中间件，实现代理服务器。

2024-01-21 17:34:55 639

原创 NodeJs 第十九章防盗链

防盗链（Hotlinking）指的是一种网站技术，用于阻止其他网站直接链接到自己的资源（如图片、音频、视频等），而是强制让访问者访问资源所在网站。防盗链的目的是保护资源的安全性和减少带宽消耗。可以通过设置服务器的HTTP头部信息来实现。服务器可以检查请求来源的HTTP头部中的Referrer字段，如果该字段为空或与自己的域名不匹配，服务器可以拒绝提供资源。还可以减少带宽消耗，因为资源只能通过原始网站访问，而不是被其他网站直接链接。有助于防止其他网站未经许可使用自己的资源，从而保护了原始网站的权益。

2024-01-21 09:23:12 594

原创 NodeJs 第十八章图片水印

图片处理是一个专业的事情。秉承着专业的事情就要交给专业的人处理。所以我们就要站在巨人的肩膀上去处理问题。是一个完全用JavaScript为Node编写的图像处理库，没有外部依赖。本示例是将一张图片作为我们目标图片的水印。

2024-01-20 23:17:15 689

原创 HTTP 第二章发展历史

是万维网（World Wide Web）的基础协议。1989 年，当时在 CERN 工作的 Tim Berners-Lee 博士写了一份关于建立一个通过网络传输超文本系统的报告。这个系统起初被命名为。Tim Berners-Lee 对于 Web 的最初设想不是一个只读媒体，是可以远程添加或移动文档，是一种分布式文件系统。1990 年项目实施期间被更名为万维网（World Wide Web）。基于现有的TCP 和 IP 协议基础建立。由四部分组件。

2024-01-20 16:15:51 1687

原创 HTTP 第一章概述

服务端可以表现为仅有一台机器，实际可以是共享负载的一组服务器集群（负载均衡）或是其他类型的软件（如缓存、数据库服务、电商服务等），按需完整或部分地生成文档。代理可以是透明的，即转发它们收到的请求并不做任何修改，也可以表现得不透明，将它传递给服务端之前使用一些手段修改这个请求。是一种简单、易用、具有可扩展性的协议，其客户端—服务器模式的结构，加上能够增加标头的能力，使得。遵循经典的客户端—服务端模型，客户端打开一个连接以发出请求，然后等待直到收到服务器端响应。中，这些报文被嵌入到了一个新的二进制结构，

2024-01-19 17:07:34 895

原创 NodeJs 第十七章文件上传

前端上传文件有两种方式FormData</</</</</FormDataFormDataappend()FormData是一种在HTTP传输协议中用于在Web表单中传输文件的编码方式。它是一种灵活的编码方式，能够同时处理表单中的多个字段和文件上传。在编码中，表单中的每个数据字段都被封装成一个消息体，并以一定的分隔符分隔消息体。这个编码方式使用了类似于的格式，但主要用于表单数据的传输。每个消息体包含一个字段名称和字段值，以及一个可选的文件上传字段。当使用。

2024-01-18 17:30:26 1467

原创 NodeJs 第十六章 JWT

jwt全称，强行翻译过来就是json格式的互联网令牌它要解决的问题，就是为多种终端设备，提供统一的、安全的令牌格式因此，jwt只是一个令牌格式而已，你可以把它存储到cookie，也可以存储到localstorage，没有任何限制！同样的，对于传输，你可以使用任何传输方式来传输jwt，一般来说，我们会使用消息头来传输它...set-cookie:token=jwt令牌authorization:jwt令牌...{..., token:jwt令牌}

2024-01-17 10:00:00 1030

原创 NodeJs 第十五章 session

在计算机科学领域来说，尤其是在网络领域，会话(session)是一种持久网络协议，在用户(或用户代理)端和服务器端之间创建关联，从而起到交换数据包的作用机制，session在网络协议(例如telnet或FTP)中是非常重要的部分。Session代表服务器和客户端一次会话的过程。中间件进行 session操作。

2024-01-16 17:14:59 457

原创 NodeJs 第十四章 JSONP 和 CORS

在跨域访问时，JS只能拿到一些最基本的响应头，如：Cache-Control、Content-Language、Content-Type、Expires、Last-Modified、Pragma，如果要访问其他头，则需要服务器设置本响应头。当浏览器看到服务器允许自己访问后，高兴的像一个两百斤的孩子，于是，它就把响应顺利的交给js，以完成后续的操作。服务器收到预检请求后，可以检查预检请求中包含的信息，如果允许这样的请求，需要响应下面的消息格式。这是一个预检请求，它的目的是询问服务器，是否允许后续的真实请求。

2024-01-16 11:14:47 1019

原创 NodeJs第十三章 cookie

以上，就是cookie原理部分的内容。登录请求浏览器发送请求到服务器，附带账号密码服务器验证账号密码是否正确，如果不正确，响应错误，如果正确，在响应头中设置cookie，附带登录认证信息（至于登录认证信息是设么样的，如何设计，要考虑哪些问题，就是另一个话题了，可以百度 jwt）客户端收到cookie，浏览器自动记录下来后续请求浏览器发送请求到服务器，希望添加一个管理员，并将cookie自动附带到请求中。

2024-01-15 10:56:48 1402

原创 NodeJs 第十二章 nodemon

是一个监视器，用于监控工程中的文件变化，如果发现文件有变化，可以执行一段脚本。正在运行时，如果您需要手动重新启动应用程序，您可以输入。并且可以位于当前工作目录或主目录中。本章节只介绍基础用法，深入学习请参考。支持本地和全局配置文件，通常被命名。，并使用这个值作为启动程序。选项指定替代的本地配置文件。，而不是停止并重新启动。将重新启动您的进程。

2024-01-14 22:09:43 419

原创 NodeJs 第十一章 express

是可以访问请求对象( req)、响应对象( res) 以及next应用程序请求-响应周期中的函数。该next函数是 Express 路由器中的一个函数，当被调用时，它会执行当前中间件之后的中间件。路由指的是确定应用程序如何响应对特定端点的客户机请求，这是一个URI(或路径)和一个特定的HTTP请求方法(GET、POST等)。可以将路由器创建为一个模块，在其中加载一个中间件函数，定义一些路由，并将路由器模块挂载到主应用的某个路径上。每个路由都可以有一个或多个handler函数，这些函数在匹配路由时执行。

2024-01-13 17:10:04 1107

空空如也

空空如也