面试总结

最新推荐文章于 2024-04-15 02:24:27 发布
最新推荐文章于 2024-04-15 02:24:27 发布
阅读量1.6k 收藏
点赞数 1
分类专栏： 浏览器基本原理 文章标签： 面试
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Welkin_qing/article/details/88788064
版权

文章目录

一、什么是重绘和重排

  • 重绘：是一个元素外观的改变所触发的浏览器行为
    例如改变visibility、outline、背景色等属性。浏览器会根据元素的新属性重新绘制，使元素呈现新的外观。
  • 重排是更明显的一种改变，可以理解为渲染树需要重新计算。

重绘不会带来重新布局，并不一定伴随重排。

触发重排的操作

  1. DOM 的几何属性发上变化
    DOM元素的属性变化时，浏览器会重新渲染该部分，而且会涉及到子节点/兄弟节点的重新计算。重排一定会引起浏览器的重绘，代价是很大的。
  2. DOM 树的结构发生变化
    DOM树的增 删 移动 ，会出发重排，浏览器引擎布局过程是从上到下的，从左到右的过程。 所以，如果在body最前面插入一个元素，会导致整个文档的重新渲染，而在其后插入一个元素，则不会影响到前面的元素。
  3. 获取某些属性
    当获取一些属性的时候， 为了取得正确的值，会进行重排。 offsetTop、offsetLeft、 offsetWidth、offsetHeight、scrollTop、scrollLeft、scrollWidth、scrollHeight、clientTop、clientLeft、clientWidth、clientHeight、getComputedStyle() (currentStyle in IE)。所以，在多次使用这些值时应进行保存。
  4. 改变元素样式也会引起重排

减少重排的做法

  1. 将多次改变样式属性的操作合并成一次操作
var changeDiv = document.getElementById(‘changeDiv’);
changeDiv.style.color = ‘#093′;
changeDiv.style.background = ‘#eee’;
changeDiv.style.height = ’200px’;

合并为以下：

div.changeDiv {
background: #eee;
color: #093;
height: 200px;
}

document.getElementById(‘changeDiv’).className = ‘changeDiv’;

  1. 将需要多次重排的元素，position属性设为absolute或fixed，这样此元素就脱离了文档流，它的变化不会影响到其他元素。例如有动画效果的元素就最好设置为绝对定位。

  2. 在内存中多次操作节点，完成后再添加到文档中去。例如要异步获取表格数据，渲染到页面。可以先取得数据后在内存中构建整个表格的html片段，再一次性添加到文档中去，而不是循环添加每一行。

  3. 由于display属性为none的元素不在渲染树中，对隐藏的元素操作不会引发其他元素的重排。如果要对一个元素进行复杂的操作时，可以先隐藏它，操作完成后再显示。这样只在隐藏和显示时触发2次重排。

  4. 在需要经常获取那些引起浏览器重排的属性值时，要缓存到变量。

二、cookie、session、localstorage

1. 存储机制上的区别

https://blog.csdn.net/liuchao_sun/article/details/79634162

localStorage、sessionStorage、cookies都可以用来在浏览器进行数据的缓存存储。sessionStorage、cookies这两个存储随着关闭浏览器或者停止对服务器的访问而会消失，并不会永久的存在。

localStorage不会通过这种方式清除，只有当用户手动清除浏览器缓存才能真正的清除掉数据。

session不是用来存储在客户端，而是存储在整个会话当中（即浏览器访问服务器这个过程，关闭浏览器或停止服务器即断开会话），浏览器关闭，session即清除。

localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储。

在以前，这些缓存存储都是由 cookies 完成的。但是cookies不适合大数据量的存储，它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不高。

在 HTML5 中，数据不是由每个服务器请求传递的，而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。对于不同的网站，数据存储于不同的区域，并且一个网站只能访问其自身的数据。

即当浏览器打开的tab满足同源策略后，可以在各页面之间进行数据的相互存取操作，这样就可以不用反复进行重复的数据请求操作，如登录权限，获取用户信息等等。

2. cookie

https://blog.csdn.net/fifteen718/article/details/81735596
Cookie是用于维持服务端会话状态的，通常由服务端写入，在后续请求中，供服务端读取。

a. HTTP 请求时，cookie 的使用过程

  1. server通过HTTP Response中的"Set-Cookie: header"把cookie发送给client

  2. client把cookie通过HTTP Request 中的“Cookie: header”发送给server

  3. 每次HTTP请求，Cookie都会被发送。（浏览器发送请求的实时，cookie会自动携带在请求头里面）

b. HTTP 请求发送cookie 的条件

1、本地已经缓存有cookies

2、根据请求的URL来匹配cookies的domain、path属性，如果都符合才会发送。

2. cookie、session、localstorage哪些可以跨域

  1. cookie 可以跨域
    利用nginx的方向代理来解决cookie跨域问题，其实是通过“欺骗”浏览器来实现的，通过nginx，我们可以将不同工程的cookie放到nginx域下，通过nginx反向代理就可以取到不同工程写入的cookie。

参考文章：
https://www.cnblogs.com/waters/articles/2869855.html
https://blog.csdn.net/chou_out_man/article/details/80664413

  1. LocalStorage是不能跨域的，但是，可以借助postMessage和iframe来实现跨域的数据读取。

三、跨域

1. 通过script 的src 属性去访问，不受同源策略的影响吗？

为了既保护用户信息安全，又规避跨域（不同源则为跨域）限制，因此需要使用这种特殊的技术–jsonp.
<scripr>标签是不受同源策略的限制的，它可以载入任意地方的 JavaScript 文件，而并不要求同源。

jsonp利用script标签具有跨域能力的特点，允许用户通过script的src属性向服务器发送请求，并传递一个函数名作为参数，服务端返回数据时会将这个callback函数作为函数名包裹住从服务端接收的json数据，客户端会按照定义好的方式处理数据。举例如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JSONP 实例</title>
</head>
<body>
<div id="list"></div>
<script type="text/javascript">
function callbackFunction(result, methodName) {
　　var html = '<ul>';
　　for(var i = 0; i < result.length; i++) {
　　　　html += '<li>' + result[i] + '</li>';
　　}
　　html += '</ul>';
　　document.getElementById('list').innerHTML = html;
}
</script>
<script type="text/javascript" src="http://www.myweb.com/demo/jsonp.php?jsoncallback=callbackFunction"></script>
</body>
</html>

以上，callbackFunction函数名作为参数传递给服务器，服务器返回数据形式为:callbackFunction([“list1”,“list2”]),显示结果会按照 callbackFunction()函数来处理。

a. 同源策略

协议、端口号、域名相同

b. 同源策略会限制

  1. cookie、localStorage、indexDB无法读取，
  2. DOM无法获得，
  3. Ajax请求不能发送。

这样做的好处在于保护了用户信息安全。为了保护用户信息安全

2. cors 通过什么方式去跨域

本意：cross origin resource share，跨资源共享

场景：服务端的代码在我的控制范围之内，换言之，后台提供的api代码，我是有权限去操作的。只需要在服务端编写代码，浏览器端不用写任何代码。

这种方式最简单，只需要在服务端设置几个头信息即可。

在node中，设置如下：

res.setHeader('Access-Control-Allow-Origin', "*"); //针对哪个域名可以访问，*表示所有
res.setHeader('Access-Control-Allow-Credentials', true); //是否可以携带cookie
res.setHeader('Access-Control-Allow-Methods', 'POST, GET, PUT, DELETE, OPTIONS');

四、关于js的一些小问题

1. 原型的概念

用我自己的话说：
原型对象：就是通过原型属性指向的那个对象
原型对象的用途：让所有对象实例共享他所包含的属性和方法
原型链：每一个构造函数都有一个原型对象，原型对象包含一个指向构造函数的指针，而实例有一个指向原型对象的指针，我们让原型对象等于另一个实例，此时，该原型对象内部则有一个指向另一个原型对象的指针
所有的默认原型对象都是object 的实例，因此默认原型对象的内部指针指向object.prototype，自定义类型继承于object ，所以自定义类型都会继承来自object 的toString valueOf 方法

在这里插入图片描述
这是我自己理解的，欢迎指点
在这里插入图片描述

创建对象的原型模式：我们创建每一个函数都有一个prototype（原型）属性，这个属性是一个指针，指向一个对象，而这个对象的用途是包含可以由特定的所有实例共享的属性和方法。从字面意思理解，那么prototype就是通过调用构造函数而创建的那个对象实例的原型对象。使用原型对象的好处是可以让所有对象实例共享它所包含的属性和方法。我们可以通过对象实例访问保存在原型中的值，但却不能通过对象实例重写原型中的值。如果我们在实例中添加了一个与原型实例中同名的属性，那么我们在实例中创建该属性，该属性将会屏蔽原型中的属性。

只要创建一个新函数，就会根据一组特定的规则为函数创建一个prototype（原型）属性，这个属性指向函数的原型对象

2. 原型链的作用

用于实现JS中的实现继承。

原型链的概念：
原型链作为实现继承的主要方法，其基本思想是利用原型让一个引用类型继承另一个引用继承的属性和方法。了解一下构造函数、原型和实例的关系：每个构造函数都是一个原型对象，原型对象都包含一个指向构造函数的指针，而实例都包含一个指向原型对象的内部指针。假如我们让原型对象等于另一个类型的实例，那么此时的原型对象将包含一个指向另一个原型的指针，相应的另一个原型中包含着一个指向另一个构造函数的指针。如此层层递进，就构成了实例与原型的链条。

当函数调用时，需查找和获取的变量和元素都会通过原型链机制一层层的往上搜索在原型对象或继承来的对象中获得。

当函数被创建，就有了作用域，当被调用时，就有了作用域链，当被继承时就有了原型链，当需要获取作用域链或原型链上的变量或值时，就有了闭包。

3. object 的原型指向什么？

null

首先要明确一点，原型链是指对象的原型链，所以原型链上的所有节点都是对象，不能是字符串、数字、布尔值等原始类型。
规范要求原型链必须是有限长度的(从任一节点出发，经过有限步骤后必须到达一个终点。显然也不能有环。)
所有的引用类型默认都继承了object （这个继承通过原型链实现的）
所有函数的默认原型都是 object 的实例，因此默认原型都会包含一个默认指针，指向object.prototype ，这也是所有自定义类型会继承toString valueOf 等默认方法的根本原因

当我们去取object 的原型时，应该返回什么？
即：Object.prototype.proto;

  1. 如果属性存在，那么返回属性的值。
  2. 如果属性不存在，那么返回undefined。
  3. 不管属性存在还是不存在，有可能抛异常。

2和3都不行，因为返回undefined一种解释是原型不存在，但是也相当于原型就是undefined。这样，在原型链上就会存在一个非对象的值。同时，抛出异常也不是一个好的设计

所以最佳选择就是 null ，一方面，你没法访问null的属性，所以起到了终止原型链的作用；另一方面，null在某种意义上也是一种对象，即空对象，因为null一开始就是为表示一个“空”的对象存在的。这样一来，就不会违反“原型链上只能有对象”的约定。

所以，“原型链的终点是null”虽然不是必须不可的，但是却是最合理的。

4. sort 是怎么排序的？

https://www.cnblogs.com/saifei/p/9043821.html
w3school上的原话是：sort() 方法用于对数组的元素进行排序，
arrayObject.sort(sortby)
（记住sort方法排序改变的是原有的数组不生成副本）如果调用该方法时没有使用参数，将按字母顺序
（Ascall编码）对数组中的元素进行排序，说得更精确点，是按照字符编码的顺序进行排序。要实现这一点，首先应把数组的元素都转换成字符串（如有必要），以便进行比较。
如果要想进行升序或是降序排序的话，要提供比较函数。

  1. 不传参数，可以直接按照字母顺序排序
  2. 是按照升序还是降序，指定一个函数
    在这里插入图片描述
  3. 按照数组对象中某个属性值进行排序
    在这里插入图片描述
  4. 根据参数来确定是升序还是降序
    在这里插入图片描述

5. 字符串和数组之间的转换

1. 数组转字符串（join）
var a, b,c; 
a = new Array(a,b,c,d,e); 
b = a.join('-'); //a-b-c-d-e  使用-拼接数组元素
c = a.join(''); //abcde
2. 字符串转数组（split）
var str = 'ab+c+de';
var a = str.split('+'); // [ab, c, de]
var b = str.split(''); //[a, b, +, c, +, d, e]

6. startwith的用法

这个方法来自ES6 里

  • includes()：返回布尔值，表示是否找到了参数字符串。
  • startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。（从左往右）
  • endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。 （从右往左）
let s = 'Hello world!';
 
s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true

这三个方法都支持第二个参数，表示开始搜索的位置：

var s= 'Hello world!'
s.startWith('world', 6)  //true
s.endsWith('Hello', 5)  //true
s.includes('Hello', 6)  //false

使用第二个参数时，endsWith 的行为与其他两个方法有所不同。它针对前n 个字符，而其他方法针对从第n 个位置到字符串结束位置之间的字符

7. 使用正则

1. 抽离字符串中的字符

	var a = "jknsaj454554afaFa4551gas5g"
    var c = /\d/g;
    console.log(a.replace(/\d/g, ''))//jknsajafaFagasg
    console.log(a.replace(/[0-9]/g, ''))//jknsajafaFagasg

2. 抽离字符串中的数字

console.log(a.replace(/[^0-9]/g, ''))//45455445515
console.log(a.replace(/[^\d]/g, ''))//45455445515

五、协议

1. DNS的作用是什么？

DNS（Domain Name System） 域名系统。
作用是域名解析

它会在你上网输入网址后，把它转换成IP，然后去访问对方服务器，没有它，你想上百度就要记住百度的IP，上163就要记住163的IP，有了DNS的处理，你只需要记住对应网站的域名–也就是网址就可以了。

2. tcp三次握手

SYN：同步序列编号，是tcp建立连接时的握手信号
ACK：确认字符
ESTABLISHED：已建立的状态

  1. 客户端首先发送一个SYN 给服务器，表明发送一个标有SYN 的数据包
  2. 服务端接收到SYN 并进入到SYN_RCVD 状态，同时向客户端发送标有SYN/ACK 的数据包
  3. 客户端接收到SYN/ACK 后进入到ESTABLISHED状态，并向服务器端发送标有ACK 的数据包

3. tcp 为什么需要三次握手？

因为第一次表示是客户端发到服务端建立了连接，第二次表示服务端到客户端建立了连接，每次连接时独立的，需要确认双方都建立连接成功后才能进行数据的传输。

4. 状态码

详情：https://blog.csdn.net/Welkin_qing/article/details/88751801#3_HTTP_Status_code_Status_text_65

  • 1xx： 表示临时回应
  • 2xx：表示成功
    • 200
  • 3xx：表示请求目标有变化
    • 301
    • 302
  • 4xx：客户端错误
    • 404
  • 5xx：服务端错误

六、css

1. icon-font 字体图标以及用法

2. 响应式布局

  1. 设置meta标签
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="HandheldFriendly" content="true">
  1. 通过媒体查询设置样式media query
    media query 是响应式设计的核心，它能够和浏览器进行沟通，告诉浏览器页面如何呈现，假如一个终端的分辨率小于980px，那么可以这样写
@media screen and (max-width:980px){
     #head { … }
     #content { … }
     #footer { … }
}  /*这里面的样式会覆盖掉之前所定义的样式。*/

3. 前端性能优化方案

1、尽量减少 HTTP 请求
2、使用浏览器缓存
3、使用压缩组件
4、图片、JS 的预载入
5、将脚本放在底部
6、将样式文件放在页面顶部
7、使用外部的 JS 和 CSS
8、精简代码

（1） 减少 http 请求次数：CSS Sprites, JS、CSS 源码压缩、图片大小控制合适；网页
Gzip，CDN 托管，data 缓存 ，图片服务器。
（2） 前端模板 JS+数据，减少由于 HTML 标签导致的带宽浪费，前端用变量保存 AJAX
请求结果，每次操作本地变量，不用请求，减少请求次数
（3） 用 innerHTML 代替 DOM 操作，减少 DOM 操作次数，优化 javascript 性能。
（4） 当需要设置的样式很多时设置 className 而不是直接操作 style。
（5） 少用全局变量、缓存 DOM 节点查找的结果。减少 IO 读取操作。
（6） 避免使用 CSS Expression（css 表达式)又称 Dynamic properties(动态属性)。
（7） 图片预加载，将样式表放在顶部，将脚本放在底部 加上时间戳。
（8） 避免在页面的主体布局中使用 table，table 要等其中的内容完全下载之后才会显
示出来，显示比 div+css 布局慢。

七、vue

1. vue的指令

指令的职责是，当表达式的值改变时，产生的影响作用于DOM（v-for是例外情况）

  1. v-html 双大括号会将数据解释为普通文本，而非 HTML 代码。为了输出真正的 HTML，你需要使用 v-html 指令

内容按普通 HTML 插入 - 不会作为 Vue 模板进行编译 。如果试图使用 v-html 组合模板，可以重新考虑是否通过使用组件来替代。

<body>
    <div id="app">
        {{ message }}
        <p v-html="htmlmessage"></p>
    </div>
    <script>
        var app = new Vue({
            el: '#app',
            data: {
                message: 'Hello Vue!',
                htmlmessage: '<div style="width:100px;height:100px;border:1px solid black"></div>'
            }
        })
    </script>
</body>

因为我是这样写的，所以结果是在p 标签里有一个div盒子，也就是p的内容被替换成了一个html 标签
在这里插入图片描述

注意：

  • 在网站上动态渲染任意 HTML 是非常危险的，因为容易导致 XSS 攻击。只在可信内容上使用 v-html，永不用在用户提交的内容上。
  • 在单文件组件里，scoped 的样式不会应用在 v-html 内部，因为那部分 HTML 没有被 Vue 的模板编译器处理。如果你希望针对 v-html 的内容设置带作用域的 CSS，你可以替换为 CSS Modules 或用一个额外的全局

  1. v-text
    用于解决插值表达式（{{}}）闪烁的问题
    在这里插入图片描述
    可以看到结果，插值表达式上并没有指定标签，而v-text 指定了标签，同时也解决了插值表达式闪烁的问题

  2. v-show
    根据表达式之真假值，切换元素的 display CSS 属性，当条件变化时该指令触发过渡效果
    元素会被渲染，只是简单的进行css 样式切换（可以频繁切换）

在这里插入图片描述
我有设置改变我的条件
0/false 元素会被隐藏
1/true 元素会出现
字符串的false 元素也会出现

  1. v-if
    会根据条件进行渲染不渲染（true 渲染dom，false不渲染dom）
    在这里插入图片描述
    0/false 元素不渲染
    1/true 元素会被渲染
    字符串的false 元素也会被渲染
    还有 v-else v-else-if

  2. v-for
    基于源数据多次渲染元素或模板块。此指令之值，必须使用特定语法 alias in expression ，为当前遍历的元素提供别名

<div v-for="item in items">
  {{ item.text }}
</div>

注意：当和 v-if 一起使用时，v-for 的优先级比 v-if 更高。详见列表渲染教程

  1. v-on（简写@）注册事件（用于监听dom事件）
    on 的函数写在methods 里
    绑定事件监听器。事件类型由参数指定。表达式可以是一个方法的名字或一个内联语句，如果没有修饰符也可以省略。

用在普通元素上时，只能监听原生 DOM 事件。用在自定义元素组件上时，也可以监听子组件触发的自定义事件。

在监听原生 DOM 事件时，方法以事件为唯一的参数。如果使用内联语句，语句可以访问一个 $event 属性：v-on:click=“handle(‘ok’, $event)”。

<div id="app">
        {{ message }}
        <p v-text="message"></p>
        <div v-if="message" style="width:100px;height:100px;border:1px solid black"></div>
        <!-- <p v-html="htmlmessage"></p> -->
        <button @click="todoThis">button</button>
    </div>
    <script>
        var app = new Vue({
            el: '#app',
            data: {
                message: 'false',
                htmlmessage: '<div style="width:100px;height:100px;border:1px solid black"></div>'
            },
            methods: {
                todoThis(){
                    alert('hello')
                }
            },
        })
    </script>
  1. v-bind 属性绑定（缩写：）
    绑定class（常常和data，computed里的数据一起用）
    v-bind不触发dom事件，也就是将上边的代码改成v-bind 再点击不会触发函数
    通常用来父子传值的时候使用
  <div id="app">
        {{ message }}
        <p v-text="message"></p>
        <div :class="{box:message}" style="width:100px;height:100px;border:1px solid black"></div>
        <!-- <p v-html="htmlmessage"></p> -->
        <!-- <button :click="todoThis">button</button> -->
    </div>
    <script>
        var app = new Vue({
            el: '#app',
            data: {
                message: 'false',
                htmlmessage: '<div style="width:100px;height:100px;border:1px solid black"></div>'
            },
            methods: {
                todoThis(){
                    alert('hello')
                }
            },
        })
    </script>

在这里插入图片描述
8. v-model
表单控件双向绑定

  • <input>
  • <select>
  • <textarea>
  • components
    在这里插入图片描述
  1. v-slot

限用于

  • <template>
  • 组件 (对于一个单独的带 prop 的默认插槽)

提供具名插槽或需要接收 prop 的插槽。

  1. v-pre
    不解析这个节点的内容，跳过编译
    在这里插入图片描述
<span v-pre>{{hhhhhhhhhhhhh}}</span>
  1. v-cloak
    这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如
    [v-cloak] { display: none }一起用时，这个指令可以隐藏未编译的 Mustache 标签直到实例准备完毕。

用我自己的话说：用于{[}} 插值表达式使用比较多，若都是用v-text 比较麻烦。则在vue 管理的模板入口节点作用v-cloak 指令，有v-cloak{display：none}时，浏览器在解析的过程中，发现具有v-cloak 的属性隐藏不显示，所以就看不见闪烁的问题，当vue 解析替换完成之后，vue会自动把v-cloak 样式移出

  1. v-once
    只渲染元素和组件一次。随后的重新渲染，元素/组件及其所有的子节点将被视为静态内容并跳过。这可以用于优化更新性能。
    在这里插入图片描述
    下面的那个0 就是使用v-once 绑定的元素

2. vue 组件的生命周期

https://www.cnblogs.com/webbest/p/6722780.html
vue 使用component定义组件

3. 生命周期函数（钩子函数）

一共分为8个阶段

  • 创建前后
    • 在beforeCreated阶段，vue实例的挂载元素$el和数据对象data都 为undefined，还未初始化。
    • 在created阶段，vue实例的数据对象data有了， $el还没有。
  • 载入前/后
    • 在beforeMount阶段，vue实例的$el和data都初始化了，但还是挂 载之前为虚拟的dom节点，data.message还未替换
    • 在mounted阶段，vue实 例挂载完成，data.message成功渲染。
  • 更新前/后
    • 当data变化时，会触发beforeUpdate和updated方法
  • 销毁前/后
    • 在执行destroy方法后，对data的改变不会再触发周期函数，说明 此时vue实例已经解除了事件监听以及和dom的绑定，但是dom结构依然存在

4. 父子组件相互通信

https://blog.csdn.net/Welkin_qing/article/details/88572264#3__298

  • 父向子
    prop
  • 子向父
    （$emit）

webpack

基于整个项目进行构建得
gulp 是基于task 任务构建的

1.什么是webpack

是前端的一个构建工具，是基于node.js 开发的前端工具

2. webpack能干什么？

  1. 网页加载速度慢，因为要发起很多二次请求
  2. 要处理错综复杂的关系

SSR

https://www.jianshu.com/p/fcb98533bc18

前端前沿技术

https://blog.csdn.net/itwangyang520/article/details/81150795

前端离线方案（ServiceWorker）

https://www.jianshu.com/p/2fde65f0182d

xss sql

  • XSS攻击全称跨站脚本攻击，是为不和层叠样式表(Cascading Style Sheets, CSS)的缩写混淆，故将跨站脚本攻击缩写为XSS，XSS是一种在web应用中的计算机安全漏洞，它允许恶意web用户将代码植入到提供给其它用户使用的页面中。
  • 所谓SQL注入，就是通过把SQL命令插入到Web表单提交或输入域名或页面请求的查询字符串，最终达到欺骗服务器执行恶意的SQL命令。具体来说，它是利用现有应用程序，将（恶意的）SQL命令注入到后台数据库引擎执行的能力，它可以通过在Web表单中输入（恶意）SQL语句得到一个存在安全漏洞的网站上的数据库，而不是按照设计者意图去执行SQL语句。 [1] 比如先前的很多影视网站泄露VIP会员密码大多就是通过WEB表单递交查询字符暴出的，这类表单特别容易受到SQL注入式攻击．
    SQL注入攻击指的是通过构建特殊的输入作为参数传入Web应用程序，而这些输入大都是SQL语法里的一些组合，通过执行SQL语句进而执行攻击者所要的操作，其主要原因是程序没有细致地过滤用户输入的数据，致使非法数据侵入系统。
    根据相关技术原理，SQL注入可以分为平台层注入和代码层注入。前者由不安全的数据库配置或数据库平台的漏洞所致；后者主要是由于程序员对输入未进行细致地过滤，从而执行了非法的数据查询。基于此，SQL注入的产生原因通常表现在以下几方面：①不当的类型处理；②不安全的数据库配置；③不合理的查询集处理；④不当的错误处理；⑤转义字符处理不合适；⑥多个提交处理不当。
Welkin_qing
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
阿里巴巴一面 ：十道经典面试题解析
Trouvailless的博客
07-26 1090
谈到事务，我们就会想到数据库事务，很容易就想到原子性、一致性、持久性、隔离性。分布式事务跟数据库事务有点不一样，它是指事务的参与者、支持事务的服务器、资源服务器以及事务管理器分别位于不同的分布式系统的不同节点之上。简单来说，分布式事务指的就是分布式系统中的事务，它的存在就是为了保证不同数据库节点的数据一致性。...
阿里面经（一面）
m0_37671741的博客
09-08 177
一面： 1.自我介绍 2.介绍项目情况 3.Java内存泄漏（我举例了三种情况，第一种是引用计数法下，对象a和对象b形成引用环；第二种是连接资源未关闭，如jdbc，网络io连接等，第三种是通过饥饿式创建static对象，但未使用） 4.Java中String类是否可以被继承（我回答不能，因为被final关键字修饰。反问：被final关键字修饰的类一定不能被继承吗） 5.Java中的序列化（我回答方便存储，对象存储的时候涉及到序列化和反序列化） 6.Java中的error和exception 7
最近面了个阿里拿38K 出来的，让我见识到了面试基础成长笔记的天花板
stone_tmp的博客
02-02 97
然后去跳槽，发现，现在的面试这么难的嘛，动不动就底层原理，动不动就源码分析，Java 不好做了，做 Java 的人太多了，我还是转行吧。同样的，小编的好朋友的个人目标也是阿里，但之前一直在一家小公司，一呆就是好几年，现在通过不断学习和实践，提升了自己很多，也有了信心来阿里挑战。人人都有大厂梦，对于程序员来说，BAT 为首的一线互联网公司肯定是自己的心仪对象，毕竟能到这些大厂工作，不仅薪资高待遇好，而且能力技术都能够得到提升，最关键的是还能够给自己镀上一层金，让人瞻仰。short s1=1；
docker- compose 部署 RabbitMQ_docker-compose rabbitmq
最新发布
2401_84159966的博客
04-15 969
查看15672端口是否开放（如果没有连带5673一起开启）比如 http://127.0.0.1:15672。如果上面没有配置密码默认 账号密码都为guest。确认容器是否运行，如果没有换一个镜像。docker ps 检查容器是否启动。进入容器内 xxx容器名称/id。启动管理插件 在容器内运行!参看ip地址是否正确。
阿里前端实习电话面（一面）（被捞两次）
weixin_48730616的博客
06-24 580
学习前端时长一年半，以下是电话面试阿里前端被问的一些知识点，都是下来回顾的。 某一天我接到了阿里的hr电话，约面试时间，我以为阿里和其他公司一样会发邮件给我，所以一直在等，结果我在实验室接到了电话，说今天面试，我说没收到邮件，可以等我半小时，回寝室面吗，面试官同意了，我提着电脑着急忙慌回寝室，没有等到电话（哈哈哈哈哈哈）我的第一次面试没了，后来发现面试通知会发在官网，我天真了。 第二次电话面，面试官上来问我在上课的课程中哪一门学的比较好，我想了几秒，通信原理吧，然后面试官问那你在学这门课的过程中，你
阿里巴巴面试总结DOC版
11-05
阿里巴巴面试总结DOC版 本资源摘要信息主要总结了阿里巴巴面试中的问题和答案，涵盖了 Java 编程语言、设计模式、JVM 内存模型、ClassLoader 结构、UML 模型图、OSGi 框架、Spring 框架、iBatis 框架、Java 序列化...
全网最全-谷粒商城项目-面试总结-简历优化_Java-You的博客-CSDN博客 .html
03-09
全网最全-谷粒商城项目-面试总结-简历优化_Java-You的博客-CSDN博客 .html
《我想进大厂》面试总结.pdf
07-08
在进行《我想进大厂》的面试总结时，我们首先要了解面试对于求职者和招聘方的重要性。面试不仅仅是一个考核和选择的过程，它也反映了求职者的职业素养、技术能力、沟通技巧和解决问题的能力。而对于面试官而言，面试...
程序员们疯传的阿里P8呕心沥血总结:10万字JAVA面试总结分享《10万字总结.pdf》
03-20
10万字总结.pdf 在阿里内部上班，直接去取经，然后就得到了这个号称：《阿里P8呕心沥血10万字的JAVA面试资料》 里面总共含了基础篇、JVM 篇、多线程 &并发篇、Spring 篇、MyBatis 篇、Spring Boot 篇、MySQL 篇、...
阿里电话面试一面总结
03-28
本人经过阿里巴巴电话面试后，感受颇多，在这里向大家分享一下，里面介绍了面试官问的问题和答案，以及个人的感受，仅供正在准备面试的同学们参考
阿里巴巴JAVA岗电话面试题整理(含录音)
赵KK的博客
09-28 3443
2018年换工作的时候，投递了阿里的面试，电话面试，一般时间在19.00-22.00左右，现在自己整理一下 接下来都是手动整理，如需要完整版请微信。 阿里巴巴电话面试一面 1.问下项目应用技术，负责模块，表设计等。 2.java创建线程是怎么做的？ 3.Hashmap与ConcurrentHashmap？ 4.ConcurrentHashmap是如何实现线程安全的？ 5.多线程中线程池的作用？ 6...
阿里电话一面
laozrk1的博客
08-28 273
2020.8.27 19：00 阿里的电话一面。首先是因为昨天的代码0ac，上来先通过邮箱发过来阿里的伯乐系统，需要重新在面试官的监督下完成考试的两道题，第一题我因为考完的时候看了下别人的想法，知道是26进制转换，所以很快就写出来了，但是中间出了很多小问题，面试官一直在提示我看看那里你再看看这里。。很尴尬，不过最后还是改好了。第二题的话，没有让我写只是让我说了一下思路，然后让我根据思路模拟了一下测例看看能不能跑过。 代码阶段持续了30分钟左右，然后就开始聊项目，项目中间面试官也问了几个关于项目的问题，我
阿里电话面试
NeverSayNever
03-18 2217
TCP 协议如何保证可靠传输转自：一、综述1、确认和重传：接收方收到报文就会确认，发送方发送一段时间后没有收到确认就重传。2、数据校验3、数据合理分片和排序：　　UDP：IP数据报大于1500字节,大于MTU.这个时候发送方IP层就需要分片(fragmentation).把数据报分成若干片,使每一片都小于MTU.而接收方IP层则需要进行数据报的重组.这样就会多做许多事情,而更严重的是,由于UDP的...
阿里一面总结
leejeff的专栏
10-11 791
最近突然接到猎头的邮件，说成都蚂蚁金服在招测试开发工程师，想推荐我去面试。虽然在外企待着还不错，但是能有机会接触BAT还是挺高兴的，心想不管成不成，去体验一下中国最顶级IT公司的面试也不错。于是就同意推荐。         第二天正当我下班刚下电梯的时候，突然就接到了阿里的电话，实在令我感到意外！没想到阿里的效率这么高。电话一来就开始一面了！总的来说根据你的简历经验来提问。我大概描述了一个测试框
阿里电话面试总结（人生第一次面试！！）
热门推荐
小荷才露尖尖角
03-15 1万+
在图书馆看书的时候，突然接到一个电话，一眼看去就是推销房子的那种，可是地点显示是杭州就接了。对面说他是阿里菜鸟网络的，我就知道是面试电话了。我就说你等我三分钟，我得从图书馆出去才能大声说话。他很和蔼，说不用挂电话，就这样我就跑出去了。 接下来直奔主题！！ 1、你知道BIO和NIO吗？ 答：（心里想：一上来就问这么难的东西，在搞什么啊）但还是很温柔得说我只知道BIO是B...
阿里一面被刷经历
demon7639的专栏
05-05 3711
今天去参加了阿里的数据挖掘工程师面试，很遗憾，一面被刷了，在此总结一下得失。 首先，一面的面试官很nice，聊得挺好的。 面的数据挖掘岗位，没有问编程语言的问题，主要是问了我做的两个项目，一个hadoop和一个多标记的。 针对项目里的一些问题问了一下，并且深入的 基础知识，这部分达的不好； 最后让我写一个Sql查询，是查询一个商家店里购买记录表，查找复购人数量，具体应该是用到group b
阿里一面记录
qq_20899719的博客
07-25 405
一次简单的阿里一面
阿里一面
MONKEY_Quan的博客
09-05 386
是阿里一面，也是阿里最后一面（2019年，9月2日）时长43min 今晚约好了9点多的电话面试如约而至，给我打的是哪个部门的主管，还有阿里面试官很亲切，声音中带着疲惫，进入正题： 面试官打来电话，先让我自我介绍，随后让我说说自己平时在学校的项目经历、或者是活动比赛经历、还有就是简历中项目有什么特别之处，并介绍一下（不是自我介绍完就开始从基础问吗，直接就项目了？） 我：先介绍简单的介绍了我自己...
经典算法与面试总结：分治策略与SVM核方法详解
面试者可以参考一系列在线资源，如博客文章和技术总结，如《经典数据结构面试题》、《机器学习算法总结》以及博主v_july_v的文章系列，这些资源覆盖了从基础数据结构到高级算法，再到机器学习算法的深入讲解。...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值