吃瓜网&黑料爆料：
js中事件穿透深度剖析与多种解决方案
在一次点击行为中，事件的触发过程为：mousedown - mouseup - click 三步。由于手机上没有鼠标，所以就用触摸事件去实现类似的功能。touch事件包含touchstart、touchmove、touchend 注意手机上并没有tap事件。
通过阻止弹窗的touchmove默认事件，进而阻止事件冒泡而导致底层页面滚动。具体实现如下：这种方案的缺点是：弹窗中不能有其它需要滚动的内容。如果有大段文字需要固定高度来滚动，则也会被阻止掉。具体做法时，当弹框出现中，让底层页面的 overflow=hidden；当弹框消失时，让底层页面的 overflow=auto。
事件处理覆盖：在vue.js中，多重嵌套组件的事件处理可能会因事件冒泡导致错误。为避免这种情况，可以使用.stop修饰符来阻止事件冒泡，确保事件只在当前组件中被处理。同时，合理设计事件传递机制也至关重要，这有助于确保事件能够正确地从子组件传递到父组件，同时避免不必要的触发。
鼠标事件的基本特性 默认不接收鼠标事件：在LayaAir中，精灵对象（Sprite）默认是不接受鼠标事件的，即mouseEnabled属性默认为false。自动开启鼠标事件：当给精灵对象设置任意鼠标事件监听时，该对象和它的所有父对象的mouseEnabled属性会自动被设置为true，从而开始接收鼠标事件。
服务端启动报错：可能是下载了与操作系统架构不匹配的文件，需重新下载正确的文件，并通过arch、uname a等命令查看系统架构。Vue项目Invalid Host header问题：在vue.config.js文件中增加disableHostCheck属性以解决。通过以上步骤，您可以成功搭建、配置并使用frp进行内网穿透，实现内网服务的公网访问。
移动端穿透问题的三种解决方案
1、通过阻止弹窗的touchmove默认事件，进而阻止事件冒泡而导致底层页面滚动。具体实现如下：这种方案的缺点是：弹窗中不能有其它需要滚动的内容。如果有大段文字需要固定高度来滚动，则也会被阻止掉。具体做法时，当弹框出现中，让底层页面的 overflow=hidden；当弹框消失时，让底层页面的 overflow=auto。
2、touch-action：none；在该元素上的操作不会触发用户 *** 的任何行为，无需进行3000ms延迟判断。
3、接下来是解决方案： 不要混用v-on：click和v-tap指令。 使用v-on：click.stop阻止单击事件继续传播。 利用css中的pointer-events属性精确控制点击事件的响应元素。此外，我还分享了一个滑动穿透的解决技巧。当h5页面内容较多，一屏展示不下时，在y方向可以滑动。
4、幸运的是，发现了page-style属性的妙用，它的存在使得动态调整页面样式变得异常方便。具体解决步骤如下：在需要控制滚动穿透的页面中，添加page-meta标签并设置page-style属性，例如：page-meta page-style=overflow：hidden。这样便能实现页面滚动的动态控制，无需担心移动端兼容性问题。
使用svg创建动态水印内容
使用svg的思路很简单，就是利用background-image：url(svgpath.svg)也能正常显示的特性(毕竟svg其实就是特殊一点的图片)。
采用动态水印：使用Canvas或SVG等技术生成动态水印，增加水印的复杂性和变化性，使其更难以被复制或去除。绑定用户信息：将水印与用户信息（如ID、IP、时间戳）绑定，实现水印的溯源功能，一旦内容被滥用，可以通过水印信息追踪到源头。定期更新水印：定期更换水印样式或内容，防止静态截图泄露导致的长期风险。
以下是一个示例代码：首先通过HTML5 Canvas创建画布，接着使用JavaScript绘制文字，并利用CSS定位，确保其在页面右下角显示。此外，通过使用SVG图形作为页面背景图片，能更灵活地添加水印。
动态水印与加密动态生成水印：通过Canvas动态绘制水印，并定期刷新（如每5秒重绘）。
水印的 *** 确定水印内容 水印内容通常包括个人姓名、昵称、网址、标志等，用于标识作品的归属。确保水印内容简洁明了，避免过于复杂导致影响图片整体美观。选择 *** 工具 可使用专业的图像处理软件，如Photoshop、GIMP等，这些软件提供了丰富的文字、图形编辑功能。
创建Vue3指令：在Vue3中，你可以通过app.directive *** 注册一个全局或局部的指令。为指令命名，例如vwatermark，并定义其钩子函数，如bind、inserted、update等。在指令中实现水印逻辑：在inserted或update钩子中，使用Canvas API或SVG来生成水印图案。将生成的水印图案作为背景图像添加到目标元素上。
php全栈开发工程师学哪些内容
1、进阶方向微服务架构：学习服务拆分原则、API网关（如Kong）、服务发现（Consul）。云原生技术：熟悉AWS/阿里云服务（如ECS、RDS、SLB）及Serverless架构（如AWS Lambda）。性能监控：使用Prometheus+Grafana搭建监控系统，分析APM数据（如New Relic）。通过系统掌握上述内容，PHP全栈工程师可独立承担从前端界面到后端服务、数据库设计的全流程开发，并具备解决复杂业务问题的能力。
2、系统学习HTML/CSS/ *** ，掌握PHP语法和mysql基础操作。框架与工具 通过Laravel文档和实战项目熟悉框架，同时学习Git和API开发。全栈实践 开发完整项目（如博客系统），整合前端交互、后端逻辑和数据库。持续优化 学习性能调优（缓存、队列）、安全防护（SQL注入、XSS）及最新技术趋势。
3、持续学习：跟踪PHP生态更新（如PHP 8新特性）、前端框架演进（如Vue 3组合式API）及新兴技术（如Serverless）。
4、进阶技术方向REStful API 开发：设计符合 REST 原则的接口，使用 *** ON 格式传输数据，结合 JWT 实现身份验证。实时通信：学习 WebSocket 协议，通过 Ratchet 或 Swoole 实现聊天室、通知推送等功能。企业级框架：深入 Symfony 或 Zend，掌握服务容器、事件驱动等高级特性。
5、使用框架开发小型项目（如博客系统），掌握路由、ORM、模板引擎。部署项目到服务器，配置域名、SSL 证书。实战阶段 参与开源项目或开发复杂应用（如电商系统），优化性能和安全性。学习 DevOps 工具（Docker、CI/CD 流水线）。
6、熟悉开发流程。中级开发者：深入学习Laravel框架，掌握ORM与RESTful API开发，尝试构建电商类中型项目。高级开发者：专注于性能优化（如数据库索引优化、代码 profiling）与部署自动化，参与开源项目或企业级应用开发。通过系统学习上述内容，可逐步掌握PHP从基础到高级的全栈开发能力，适应不同规模项目的需求。
