IceWindy's Blog

本笔记为下面视频的笔记 【1个项目学会TypeScript核心基础语法】 https://www.bilibili.com/video/BV12P411E79E/ TypeScript安装 TypeScript是JavaScript的超集，为JavaScript新增了许多新的特性。 TypeScript并不能在浏览器中直接执行，因此跟JavaScript不同的是，我们需要安装一个编译器去将TypeScript转换成JavaScript 1npm install -g typescript //全局安装 安装完成后我们可以通过命令来检查我们的安装情况 12❯ tsc -vVersion 5.0.2 接着我们在项目文件夹下使用终端 12345678910111213❯ tsc --initCreated a new tsconfig.json with: ...

Vue的项目逻辑 为了更深刻了解Vue的项目逻辑，我们可以尝试不使用脚手架搭建一次Vue项目。 单文件组件 Vue的单文件组件（即.vue文件，英文 Single-File Component，简称 SFC），是把Vue组件（模板template、逻辑script、样式style）封装在同一个文件的格式。封装在一个文件内方便对多组件项目进行管理。 它常见的格式如下所示 1234567891011<script>//页面逻辑</script><template><!--HTML模板--></template><style>/*CSS样式*/</style> Vue 的单文件组件是网页开发中 HTML、CSS 和 JavaScript 三种语言经典组合的自然延伸。 main.js 我们编写完我们的单文件组件后，我们还需要编写一个mian.js，以用来注册单文件组件以及挂载单文件组件 1234import { createApp } from 'vue'import A ...

我们这里继续使用蛋老师的例子 1git checkout -f 06-start v-on v-on用于监听事件。在日常的开发中，常常会缩写成@，后面不需要加: 现在我们想要在网页上通过输入框和添加按钮新增一行我们不同口味的鱿鱼丝，这时候我们就用到了v-on，使用v-on在按钮处监听点击submit事件，然后再对事件进行处理。 1234<form @submit="处理方法"> <input type="text" placeholder="输入爱吃的鱿鱼丝..." /> <button type="submit">添加</button></form> 那么这里处理方法我们应该如何添加呢，这时候就用到了在createApp中与computed等同级的属性methods methods methods与computed都可以用来定义组件中的方法，但它们的使用场景和行为略有不同。 computed是一个计算属性，用于根据响应式依赖进行计算和 ...

props props简单来说就是向组件中传递数据。很多时候，我们都有类似的需求：我们正在构建一个博客，我们可能需要一个表示博客文章的组件。我们希望所有的博客文章分享相同的视觉布局，但有不同的内容。要实现这样的效果自然必须向组件中传递数据，例如每篇文章标题和内容，这就会使用到 props。 假如我们需要传递给我们博客文章一个标题，我们需要在组件template同级的属性props中声明 12345678export default { template: /*html*/` <h4> {{title}} </h4> `, props: { title: String }} 然后我们可以在父组件这样写 123456789101112131415import Test from "./Test.js";export default { components: {Test}, ...

在Vue的createApp方法中，除了data(){}存放映射到页面的值、computed存放方法，还有一个属性template，这个属性说白了就是用来写HTML文件的。 由于Vue是挂载到DOM上的，因此我们可以通过template属性，把我们组件的HTML代码编写在里面，就可以不用多次书写HTML，可以用Vue一对多挂载上去 Vuejs一大特点就是组件式开发，组件式开发简单来说就是把一个网页各部分都拆分开来，当作一个个组件进行开发，组件就是一个个单独可用的功能块，然后通过复用组件达到代码的复用的效果。 根组件 我们目前写的这个网页可以看作是一个根组件，我们可以通过组件拆分的方式拆分我们的根组件，将其拆分为不同功能块的子组件。 首先我们创建一个components文件夹，用来存放组件，然后我们在里面创建一个App.js，这个文件用来存放我们的根组件，我们将我们index.html代码移动过来 123456789101112131415161718192021222324252627282930313233343536373839404142export defa ...

filter 现在我们完成一个需求，将显示区域划分为上下两个部分，一个是零食的未购区域，一个是零食的已购区域。 首先我们需要将已购买和未购买筛选出来，这时候我们就用到了数组的filter方法，我们在v-for对foods添加filter方法 123456789101112131415161718192021<section> <h2>已购零食</h2> <ul> <li v-for="food in foods.filter(item => item.purchased)"> <img v-bind:src="food.image"> <span>{{ food.name }}</span> <input type="checkbox" v-model="food.purchased"> ...

Banner识别 识别一个网站的Banner信息（服务器对外显示的一些基础信息）对整个渗透测试过程具有十分重要的作用。我们往往可以通过网站网站的Banner信息，可以得到很多方向与思路，如尝试相关历史漏洞，或根据当前系统的特性，进行尝试。 操作系统 ping判断，Windows TTL一般为128，Linux则为64。TTL大于100一般为Windows，几十的一般为Linux nmap -O Windows大小写不敏感，Linux大小写区分 网站服务 \ 容器类型 F12查看响应头Server字段 浏览器插件 Wappalyzer 脚本类型 通过插件也可以查到脚本类型 数据库类型 CMS识别 CMS：网站内容管理 常见的CMS：dedecms（织梦）、Discuz、phpcms等 在线识别工具 在线指纹识别,在线cms识别小插件–在线工具 (bugscaner.com) Onlinetools https://github.com/iceyhexman/onlinetools Wappalyzer除了作为一个浏览器插件，还具有一个Pytho ...

前期信息收集 信息收集是指通过各种方式获取所需要的信息 信息包括目标站点ip、中间件、脚本语言、端口、邮箱等，包括资产收集但不限于资产收集 信息收集的意义 渗透测试成功的保障 更多的暴露面 更大的可能性 信息收集的分类 主动信息收集 通过直接对网站进行操作、扫描等，这种是有网络流量经过目标服务器的信息收集方式 被动信息收集 基于公开的渠道，如搜索引擎，在不与目标交互的情况下获取信息，并尽量避免留下痕迹 需要收集的信息 服务器信息（端口、服务、真实ip） 网站信息(网站架构[操作系统、中间件、数据库、编程语言]、指纹信息、WAF、敏感目录、敏感文件、源码泄露、旁站、C段) 域名信息(whois、 备案信息、子域名) 管理员信息(姓名、职务、生日、联系电话、邮件地址) 以上均是包括但不限于 域名信息收集 whois查询 通过whois查询，我们可以收集到域名的ip及其所有者的信息 可以通过域名注册商、站长工具、命令行查询等等方式查询到whois 域名备案信息 在中国大陆解析网站都需要备案，备案具有网站的很多信息，同样的我们也可以通过站长工具进行查询 注册人、邮箱反查 通 ...

1git checkout 02-start v-for 打开示例代码，我们看到我们返回值内有一个列表。 加入我们需要将这个列表在HTML文档中展示出来，我们并不需要一行一行手动使用插值表达式，vue给我们提供了一个标签内的属性——v-for，可以很方便的循环我们的标签。 在v-for值内我们通过item in items的形式，遍历items内的值 12345678<div id="app"> <h1>{{ title }}</h1> <ul> <li v-for="food in foods"> <span>{{food.name}}</span> </li> </ul></div> v-bind 我们可以看到我们在foods的属性内有一个图片属性，如果我们想展示我们的图片，直 ...

开发入门的代码示例来源于 技术蛋老师 https://space.bilibili.com/327247876 12git clone https://gitee.com/eggtoopain/vue3-entry-video-related-codegit checkout 01-start 创建应用 每次使用Vue的时候，我们都需要使用创建App，通过Vue内的createApp函数我们可以很方便的创建我们的一个App。 这个函数有一个可选选项，我们可以传入一个对象。然后我们还需要使用mount()方法将我们创建的应用挂载到DOM上，没有挂载到DOM上的应用则不受影响 1Vue = createApp({}).mount('#app'); 接下来我们在一个div元素中，使用id指明我们挂载的app 123456789101112131415<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&quo ...