阿里前端——电话面试题整理

一.元素居中

我们需要让元素居中显示：

1. 一段文本的水平居中 

text-align: center;

2. 一张图片的水平居中

父级：text-align: center;

3. 一个块级元素的水平居中

块级元素水平居中，使用 margin-right: auto; margin-left: auto; 

4. 单行文本的竖直居中

单行文本的垂直居中，让 line-height 和 height 相等。

5. 不确定高度的一段文本竖直居中

不确定高度的一段文本竖直居中，这里不适用高度，使用 padding-top: ...; padding-bottom: ...; padding-top 和 padding-bottom 值相同.

6. 确定高度的块级元素竖直居中等等

确定高度的块级元素竖直居中，使用 position: absolute; top: 50%; margin-top: ...;(margin-top的值为自身高度的值的一半的负值); 

7. 绝对定位实现水平垂直居中，使用 position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; 

 8.css3伸缩布局实现元素水平垂直居中，通过使用 display:flex;  align-items: center;  justify-content: center;

justify-content: center; /* 让子元素水平居中 */
 align-items: center; /* 让子元素垂直居中 */

https://www.cnblogs.com/xinjie-just/p/5916001.html

二.vue双向绑定

vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的。vue是通过Object.defineProperty()来实现数据劫持的。

https://www.cnblogs.com/libin-1/p/6893712.html

三.web攻击怎么预防

• 【XSS】

xss攻击是跨站脚本攻击，例如在表单中提交含有可执行的javascript的内容文本，如果服务器端没有过滤或转义这些脚本，而这些脚本由通过内容的形式发布到了页面上，这个时候如果有其他用户访问这个网页，那么浏览器就会执行这些脚本，从而被攻击，从而获取用户的cookie等信息

跨站脚本攻击可以分为两种：

1). 反射型XSS

它是通过诱使用户打开一个恶意链接，服务端将链接中参数的恶意代码渲染到页面中，再传递给用户由浏览器执行，从而达到攻击的目的。

2). 持久型XSS

持久型XSS将恶意代码提交给服务器，并且存储在服务器端，当用户访问相关内容时再渲染到页面中，以达到攻击的目的，它的危害更大。

比如，攻击者写了一篇带恶意JS代码的博客，文章发表后，所有访问该博客文章的用户都会执行这段恶意JS。

【防御】

　　1、对于敏感的cookie信息，使用HttpOnly，使document对象中找不到cookie。

　　2、对于用户输入的信息要进行转义。

• 【CSRF】

CSRF（Cross Site Request Forgery），中文是跨站点请求伪造。CSRF攻击者在用户已经登录目标网站之后，诱使用户访问一个攻击页面，利用目标网站对用户的信任，以用户身份在攻击页面对目标网站发起伪造用户操作的请求，达到攻击目的。

【防御】

1、敏感请求使用验证码。

2、验证HTTP Referer字段。Referer字段记录了HTTP请求的来源地址，从银行A网站发出来的请求会带有A网站的地址，从携带CSRF地址发出的请求会携带B网站的地址，我们只需在每个敏感请求验证Referer值，如果是来自A网站的通过，否则不通过。但是这种方法把安全寄托于浏览器，并不完全安全，在某些浏览器上，还是可以通过篡改 Referer 从而进行CSRF攻击。而且，在某些用户禁用Referer的情况下，服务器会一直拒绝客户的请求。

3、Anti CSRF Token：在请求地址中添加token 并验证。更多的是生成一个随机的token，在用户提交数据的同时提交这个token，服务器端比对后如果不正确，则拒绝执行操作。在用户登录之后，产生token 并放入session中，在每次请求时把token从session中拿出来，以参数的形式加入请求，在服务器端建立拦截器验证该token，token则通过，否则拒绝。但是这种方法也是有安全问题的，在某些网站支持用户发表链接的，那么黑客在该网站发布自己的个人网站地址，系统也会为这个地址后加上token，则黑客可以在自己的网站上得到这个token参数，从而发动CSRF攻击。

4、在HTTP头中自定义属性token 并验证。把token作为自定义属性放在HTTP的头中，通过封装XMLHttpRequest可以一次性给所有请求加上token 属性。这样子token就不会暴露在浏览器地址中。

【SQL注入】

SQL注入攻击，攻击者在提交表单的时候，在表单上面填写相关的sql语句，而系统把这些字段当成普通的变量发送给服务器端进行sql查询，则，由攻击者填写的sql会拼接在系统的sql语句上，从而进行数据库的某些操作。

【防御】

　　1、表单过滤，验证表单提交的合法性，对一些特殊字符进行转义处理

　　2、数据库权限最小化

　　3、查询语句使用数据库提供的参数化查询接口，不要直接拼接SQL

       4、防止SQL注入最好的方法是使用预编译语句

【身份认证和会话】

【攻击】

　　黑客在浏览器中停用JS，防止客户端校验，从而进行某些操作。

　　【防御】

　　1、隐藏敏感信息。

　　2、对敏感信息进行加密。

　　3、session 定期失效

https://www.cnblogs.com/lovesong/p/5233195.html

四、js原生获取元素

https://www.jb51.net/article/116460.htm

JS获取DOM元素的方法（8种）

1. 通过ID获取（getElementById）
2. 通过name属性（getElementsByName）
3. 通过标签名（getElementsByTagName）
4. 通过类名（getElementsByClassName）
5. 获取html的方法（document.documentElement）
6. 获取body的方法（document.body）
7. 通过选择器获取一个元素（querySelector）
8. 通过选择器获取一组元素（querySelectorAll）