当前位置: 首页 > news >正文

Vue框架的使用 搭建打包 Vue的安全问题(Xss,源码泄露)

前言

什么是Vue? Vue是轻量级的js框架 可以帮助我们一键构造网站,打包app程序等

Vue的基本使用

1、构造框架并启用

新建一个 目录

使用终端切换到当前的目录

创建vue项目 

第一个弹出使用语法我们选择是  剩下的全选择否  

发现创建好了

接着进行初始化  

切换到目录下

安装依赖   如果觉得慢可以进行配置本地的源  或者淘宝的 cnpm

安装完成 之后启用

以开发者模式进行运行

搭建好了  我们以开发者模式进行的所以会有源码泄露问题   

我们进行看看vue的路由

页面有个you did it  全局找一下

首页文件就是这个src/app.vue

还有2个库的导入  

2、使用phpstudy进行启用

如果我们直接使用phpstudy进行启动的时候 会不识别vue   所以我们需要进行打包(类似于上节课的webpack打包器的功能)

打包文件在  dist目录下 我们直接使用小皮面板查看就行

Vue的安全问题(源码泄露)

修改保存之后重新进行打包即可

或者是手动进行找   复制路径  直接访问就能下载了

下载js文件之后我们进行还原

实战之通过手段拿到Vue源码如何进行进下一步挖掘

拿到源码.zip  进行解压   

使用以上的2中的一种进行打开    

Xss问题

<template><div><h1>XSS 漏洞演示</h1><input v-model="userInput" placeholder="输入你的内容" /><button @click="showContent">显示内容</button><div v-html="displayContent"></div></div>
</template><script>
export default {data() {return {userInput: '', // 用户输入displayContent: '' // 显示的内容};},methods: {showContent() {// 直接将用户输入的内容渲染到页面this.displayContent = this.userInput;}}
};
</script>

payload:<img src='xxx' οnerrοr="javascript:alert(1)">   这个Xss姿势利用的就是当 src不符合正确的形式的时候就会进行报错提示

相关文章:

Vue框架的使用 搭建打包 Vue的安全问题(Xss,源码泄露)

前言 什么是Vue&#xff1f; Vue是轻量级的js框架 可以帮助我们一键构造网站&#xff0c;打包app程序等 Vue的基本使用 1、构造框架并启用 新建一个 目录 使用终端切换到当前的目录 创建vue项目 第一个弹出使用语法我们选择是 剩下的全选择否 发现创建好了 接着进行…...

Java+SpringBoot+Vue+数据可视化的音乐推荐与可视化平台(程序+论文+讲解+安装+调试+售后)

感兴趣的可以先收藏起来&#xff0c;还有大家在毕设选题&#xff0c;项目以及论文编写等相关问题都可以给我留言咨询&#xff0c;我会一一回复&#xff0c;希望帮助更多的人。 系统介绍 在互联网技术以日新月异之势迅猛发展的浪潮下&#xff0c;5G 通信技术的普及、云计算能力…...

day2 - SpringBoot框架开发技术

主要内容 1. SpringBoot简介 2. 构建springboot工程 3. springboot接口返回json 4. springboot热部署 5. springboot资源属性配置 6. springboot整合模板引擎 7. springboot异常处理 8. springboot整合MyBatis 9. springboot整合redis 10. springboot整合定时任务 11. springbo…...

Flash-03

1-问题&#xff1a;Flash软件画两个图形&#xff0c;若有部分重合则变为一个整体 解决方法1&#xff1a;两个图形分属于不同的图层 解决方法2&#xff1a;将每个图形都转化为【元件】 问题2&#xff1a;元件是什么&#xff1f; 在 Adobe Flash&#xff08;现在称为 Adobe Anim…...

新建菜单项的创建之CmpGetValueListFromCache函数分析

第一部分&#xff1a; PCELL_DATA CmpGetValueListFromCache( IN PHHIVE Hive, IN PCACHED_CHILD_LIST ChildList, OUT BOOLEAN *IndexCached, OUT PHCELL_INDEX ValueListToRelease ) 0: kd> dv KeyControlBlock 0xe1…...

【Word2Vec】Skip-gram 的直观理解(深入浅出)

01 什么是skip-gram 一句话来说就是&#xff0c;给定中心词&#xff0c;然后预测其周围的词&#xff1a; 02 模型结构 对于skip-gram来说&#xff0c;输入是一个[1 x V]维的ont-hot向量&#xff0c;其中V为词表大小&#xff0c;值为1的那一项就表示我们的中心词。经过一个[V x…...

在MacOS上打造本地部署的大模型知识库(一)

一、在MacOS上安装Ollama docker run -d -p 3000:8080 --add-hosthost.docker.internal:host-gateway -v open-webui:/app/backend/data --name open-webui --restart always ghcr.io/open-webui/open-webui:main 最后停掉Docker的ollama&#xff0c;就能在webui中加载llama模…...

(21)从strerror到strtok:解码C语言字符函数的“生存指南2”

❤个人主页&#xff1a;折枝寄北的博客 ❤专栏位置&#xff1a;简单入手C语言专栏 目录 前言1. 错误信息报告1.1 strerror 2. 字符操作2.1 字符分类函数2.2 字符转换函数 3. 内存操作函数3.1 memcpy3.2 memmove3.2memset3.3 memcmp 感谢您的阅读 前言 当你写下strcpy(dest, s…...

DeepSeek推出DeepEP:首个开源EP通信库,让MoE模型训练与推理起飞!

今天&#xff0c;DeepSeek 在继 FlashMLA 之后&#xff0c;推出了第二个 OpenSourceWeek 开源项目——DeepEP。 作为首个专为MoE&#xff08;Mixture-of-Experts&#xff09;训练与推理设计的开源 EP 通信库&#xff0c;DeepEP 在EP&#xff08;Expert Parallelism&#xff09…...

1.2 Kaggle大白话:Eedi竞赛Transformer框架解决方案02-GPT_4o生成训练集缺失数据

目录 0. 本栏目竞赛汇总表1. 本文主旨2. AI工程架构3. 数据预处理模块3.1 配置数据路径和处理参数3.2 配置API参数3.3 配置输出路径 4. AI并行处理模块4.1 定义LLM客户端类4.2 定义数据处理函数4.3 定义JSON保存函数4.4 定义数据分片函数4.5 定义分片处理函数4.5 定义文件名排序…...

数据结构-顺序表专题

大家好&#xff01;这里是摆子&#xff0c;今天给大家带来的是C语言数据结构开端-顺序表专题&#xff0c;主要介绍了数据结构和动态顺序表的实现&#xff0c;快来看看吧&#xff01;记得一键三连哦&#xff01; 1.数据结构的概念 1.1什么是数据结构&#xff1f; 数据结构是计…...

docker和containerd从TLS harbor拉取镜像

私有镜像仓库配置了自签名证书&#xff0c;https访问&#xff0c;好处是不需要处理免费证书和付费证书带来的证书文件变更&#xff0c;证书文件变更后需要重启服务&#xff0c;自签名证书需要将一套客户端证书存放在/etc/docker/cert.d目录下&#xff0c;或者/etc/containerd/c…...

kafka-关于ISR-概述

一. 什么是ISR &#xff1f; Kafka 中通常每个分区都有多个副本&#xff0c;其中一个副本被选举为 Leader&#xff0c;其他副本为 Follower。ISR 是指与 Leader 副本保持同步的 Follower 副本集合。ISR 机制的核心是确保数据在多个副本之间的一致性和可靠性&#xff0c;同时在 …...

el-input实现金额输入

需求&#xff1a;想要实现一个输入金额的el-input&#xff0c;限制只能输入数字和一个小数点。失焦数字转千分位&#xff0c;聚焦转为数字&#xff0c;超过最大值&#xff0c;红字提示 效果图 失焦 聚焦 报错效果 // 组件limitDialog <template><el-dialog:visible.s…...

C++11智能指针

一、指针管理的困境 资源释放了&#xff0c;但指针没有置空&#xff08;野指针、指针悬挂、踩内存&#xff09; 没有释放资源&#xff0c;产生内存泄漏问题&#xff1b;重复释放资源&#xff0c;引发coredump 二、智能指针...

安装Git(小白也会装)

一、官网下载&#xff1a;Git 1.依次点击&#xff08;红框&#xff09; 不要安装在C盘了&#xff0c;要炸了&#xff01;&#xff01;&#xff01; 后面都 使用默认就好了&#xff0c;不用改&#xff0c;直接Next&#xff01; 直到这里&#xff0c;选第一个 这两种选项的区别如…...

驭势科技9周年:怀揣理想,踏浪前行

2025年的2月&#xff0c;驭势科技迎来9岁生日。位于国内外不同工作地的Uiseeker齐聚线上线下&#xff0c;共同庆祝驭势走过的璀璨九年。 驭势科技联合创始人、董事长兼CEO吴甘沙现场分享了驭势9年的奔赴之路&#xff0c;每一段故事都包含着坚持与拼搏。 左右滑动查看更多 Part.…...

一款在手机上制作电子表格

今天给大家分享一款在手机上制作电子表格的&#xff0c;免费好用的Exce1表格软件&#xff0c;让工作变得更加简单。 1 软件介绍 Exce1是一款手机制作表格的办公软件&#xff0c;您可以使用手机exce1在线制作表格、工资表、编辑xlsx和xls表格文件等&#xff0c;还可以学习使用…...

Python解决“比赛配对”问题

Python解决“比赛配对”问题 问题描述测试样例解决思路代码 问题描述 小R正在组织一个比赛&#xff0c;比赛中有 n 支队伍参赛。比赛遵循以下独特的赛制&#xff1a; 如果当前队伍数为 偶数&#xff0c;那么每支队伍都会与另一支队伍配对。总共进行 n / 2 场比赛&#xff0c;…...

【AI论文】RAD: 通过大规模基于3D图形仿真器的强化学习训练端到端驾驶策略

摘要&#xff1a;现有的端到端自动驾驶&#xff08;AD&#xff09;算法通常遵循模仿学习&#xff08;IL&#xff09;范式&#xff0c;但面临着因果混淆和开环差距等挑战。在本研究中&#xff0c;我们建立了一种基于3D图形仿真器&#xff08;3DGS&#xff09;的闭环强化学习&…...

使用docker在3台服务器上搭建基于redis 6.x的一主两从三台均是哨兵模式

一、环境及版本说明 如果服务器已经安装了docker,则忽略此步骤,如果没有安装,则可以按照一下方式安装: 1. 在线安装(有互联网环境): 请看我这篇文章 传送阵>> 点我查看 2. 离线安装(内网环境):请看我这篇文章 传送阵>> 点我查看 说明&#xff1a;假设每台服务器已…...

HTML 语义化

目录 HTML 语义化HTML5 新特性HTML 语义化的好处语义化标签的使用场景最佳实践 HTML 语义化 HTML5 新特性 标准答案&#xff1a; 语义化标签&#xff1a; <header>&#xff1a;页头<nav>&#xff1a;导航<main>&#xff1a;主要内容<article>&#x…...

vue3 字体颜色设置的多种方式

在Vue 3中设置字体颜色可以通过多种方式实现&#xff0c;这取决于你是想在组件内部直接设置&#xff0c;还是在CSS/SCSS/LESS等样式文件中定义。以下是几种常见的方法&#xff1a; 1. 内联样式 你可以直接在模板中使用style绑定来设置字体颜色。 <template><div :s…...

生成 Git SSH 证书

&#x1f511; 1. ​​生成 SSH 密钥对​​ 在终端&#xff08;Windows 使用 Git Bash&#xff0c;Mac/Linux 使用 Terminal&#xff09;执行命令&#xff1a; ssh-keygen -t rsa -b 4096 -C "your_emailexample.com" ​​参数说明​​&#xff1a; -t rsa&#x…...

LINUX 69 FTP 客服管理系统 man 5 /etc/vsftpd/vsftpd.conf

FTP 客服管理系统 实现kefu123登录&#xff0c;不允许匿名访问&#xff0c;kefu只能访问/data/kefu目录&#xff0c;不能查看其他目录 创建账号密码 useradd kefu echo 123|passwd -stdin kefu [rootcode caozx26420]# echo 123|passwd --stdin kefu 更改用户 kefu 的密码…...

【电力电子】基于STM32F103C8T6单片机双极性SPWM逆变(硬件篇)

本项目是基于 STM32F103C8T6 微控制器的 SPWM(正弦脉宽调制)电源模块,能够生成可调频率和幅值的正弦波交流电源输出。该项目适用于逆变器、UPS电源、变频器等应用场景。 供电电源 输入电压采集 上图为本设计的电源电路,图中 D1 为二极管, 其目的是防止正负极电源反接, …...

Java数值运算常见陷阱与规避方法

整数除法中的舍入问题 问题现象 当开发者预期进行浮点除法却误用整数除法时,会出现小数部分被截断的情况。典型错误模式如下: void process(int value) {double half = value / 2; // 整数除法导致截断// 使用half变量 }此时...

jmeter聚合报告中参数详解

sample、average、min、max、90%line、95%line,99%line、Error错误率、吞吐量Thoughput、KB/sec每秒传输的数据量 sample&#xff08;样本数&#xff09; 表示测试中发送的请求数量&#xff0c;即测试执行了多少次请求。 单位&#xff0c;以个或者次数表示。 示例&#xff1a;…...

Vite中定义@软链接

在webpack中可以直接通过符号表示src路径&#xff0c;但是vite中默认不可以。 如何实现&#xff1a; vite中提供了resolve.alias&#xff1a;通过别名在指向一个具体的路径 在vite.config.js中 import { join } from pathexport default defineConfig({plugins: [vue()],//…...

android RelativeLayout布局

<?xml version"1.0" encoding"utf-8"?> <RelativeLayout xmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"match_parent"android:layout_height"match_parent"android:gravity&…...