极难利用的XSS（CVE-2023-22462）

前言

本身XSS的利用成本就很高，选哟用户交互才可以实现，再加上React的呈现周期，就更难利用了。

原因

React组件的生命周期分为三个阶段：

挂载阶段：在这个阶段，组件被创建并且插入到DOM中。React提供了三个生命周期方法：

constructor(): 构造函数，组件被创建时调用，用于初始化组件的状态（state）和绑定事件处理函数（可以使用箭头函数代替）。

render(): 渲染函数，必须定义，返回要显示的内容（React元素或组件）。

componentDidMount(): 组件挂载到DOM后调用，可以在这里进行异步数据获取等操作。

更新阶段：在这个阶段，组件的状态或属性发生了改变。React提供了五个生命周期方法：

shouldComponentUpdate(): 组件即将更新时调用，可以返回一个布尔值，用于决定是否需要更新组件。

render(): 同挂载阶段。

getSnapshotBeforeUpdate(): 组件即将更新前调用，可以在这里获取更新前的DOM状态。

componentDidUpdate(): 组件更新完成后调用，可以进行DOM操作等操作。

componentWillUnmount(): 组件将要卸载前调用，可以进行资源清理等操作。

卸载阶段：在这个阶段，组件被从DOM中卸载。React提供了一个生命周期方法：

componentWillUnmount(): 同更新阶段。
需要注意的是，componentWillMount()和componentWillReceiveProps()这两个方法在新版的React中已经被标记为过时，推荐使用constructor()和componentDidUpdate()代替。此外，在React v17中，componentWillUnmount()也被标记为过时，可以使用cleanup()替代。

参考：

React官方文档：https://reactjs.org/docs/react-component.html
React生命周期图解：http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/
React生命周期详解：https://segmentfault.com/a/1190000016686254
React生命周期与实战：https://www.cnblogs.com/whosmeya/p/13021839.html