前端安全：如何防范跨站脚本攻击(XSS)
聚沙成塔·每天进步一点点 本文回顾 ⭐ 专栏简介前端安全：如何防范跨站脚本攻击 (XSS)1. 引言2. 什么是跨站脚本攻击 (XSS)？2.1 XSS的分类 3. XSS攻击的危害4. XSS的常见攻击手法4.1 注入恶意脚本4.2 伪造表单和链接4.3 操纵DOM结构 5. 如何防范XSS攻击5.1 输入验证和输出编码5.2 使用安全的库和框架5.3 Content Security Polic...
Nginx部署前端Vue项目的深度解析
目录 一、准备工作 1.1 开发环境 1.2 服务器环境 1.3 Nginx安装 二、构建Vue项目 三、上传静态文件到服务器 四、配置Nginx 五、测试并重新加载Nginx 六、访问Vue应用 七、高级配置 7.1 启用HTTPS 7.2 启用Gzip压缩 7.3 缓存控制 八、常见问题与解决方案 8.1 404错误 8.2 权限问题 8.3 跨域问题 九、总结 一、准备工作 1.1 开发环境 1...
技能 | 使用vercel部署前端项目
大家好!我是程序媛小李,今天来为大家分享使用vercel部署前端项目的内容 登录 Vercel，点击 “New Project”。 连接到你的代码仓库（GitHub、GitLab、Bitbucket）。 选择你的 Vue 项目仓库。 在部署设置中，确认框架设置为 Vue。 点击 “Deploy” 完成部署。 接下来是部署成功的页面 看着还是很喜庆的! 它还给我们生成了一个域名,直接点击就可以访问啦! ...
【前端开发秘籍】Vue3命名路由，让你的SPA导航更优雅！
Hey小伙伴们，今天要给大家带来的是一个非常实用的前端开发技巧——Vue3中的命名路由使用方法！无论你是前端新手还是资深开发者，都能从中收获满满！👩💻✨ 📚 开场白 Hey大家好，我是你们的前端小导师！今天我们要聊的是如何在Vue3中使用命名路由，让我们的单页面应用（SPA）导航更加高效和优雅。🌟 💡 引入话题 想象一下，你正在开发一个复杂的网站，里面有多个视图和嵌套路由。这时候，使用命名路由可以...
《前端攻城狮 · Snowflake 雪花算法》
文章目录 写在前面的话利用现有库自定义实现雪花ID和UUID总结陈词 写在前面的话 雪花 ID 是一种分布式唯一 ID 生成算法，通常由 Twitter 提出的。它的结构通常包括时间戳、机器 ID 和序列号等部分。 如果你想在 Vue.js 中实现雪花 ID 的生成，可以选择自己实现算法，或者使用现成的库。 利用现有库 Step1、下载依赖snowflake-id npm install snowf...
【后端学前端】纯HTML实现响应式布局
一、引言 响应式布局是指网站能够根据不同设备的屏幕尺寸和分辨率自动调整页面布局，以提供更好的用户体验。作为一名后端Java开发者，了解响应式布局的实现技巧对于我们构建高质量的前端页面具有重要意义。 二、常见实现方式 1. 媒体查询（Media Query） 媒体查询是响应式布局的核心技术，它允许我们根据不同的设备特性（如屏幕宽度、分辨率等）应用不同的CSS样式。 示例代码： <!DOCTYPE ht...
《前端攻城狮 · Vue 使用腾讯地图》
文章目录 写在前面的话获取腾讯地图 API 密钥引入腾讯地图 API创建地图组件使用地图组件实现效果总结陈词 写在前面的话 本篇文章介绍如何在Vue项目中使用腾讯地图API。 获取腾讯地图 API 密钥 登录 腾讯地图开放平台，注册并创建一个应用。获取 API 密钥（Key）。 引入腾讯地图 API 在 public/index.html 文件中引入腾讯地图的 JavaScript API。将以下代...
前端实现首次访问，后续从本地访问
在前端实现将PDF文件下载到用户的本地磁盘，并在后续加载时使用本地文件，而不是重新从服务器下载，可以通过以下步骤实现： 1. **使用`<a>`标签的`download`属性**：当用户首次点击下载PDF时，通过`<a>`标签将PDF文件保存到用户的设备上。 2. **保存下载链接**：将下载PDF的链接保存到LocalStorage中，以便后续可以检查是否已经下载过该文件。 3. **检测本地文件*...
【2024】前端学习笔记1-HTML主体框架-文本标签
学习笔记 HTML主体框架 标题标签：h 段落标签：p 加粗标签：strong、b 斜体文本标签：em、i 下划线标签：u 上标、下标：sup、sub 内联容器：span 换行标签：br HTML主体框架 HTML主体框架 <!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>我是标题</title></head...
前端面试题-Vite的打包速度为什么比Webpack快?
哈喽小伙伴们大家好!今天继续为大家分享一道面试题 大家都知道,Vite和Webpack是前端开发中用来构建项目的两个框架,Webpack是针对Vue2的,而Vite则是为vue3量身定制的,他们有哪些区别呢?为什么我们推荐使用Vite呢?Webpack又有哪些缺点呢?这篇文章我们来一探究竟。 Vite和Webpack的区别主要体现在以下几个方面. 1、开发模式的差异 在开发环境中，Webpack 是先...