2020-08-20 html的canvas的坑 + css的最喜爱特性 + JS的函数实现 + 软技能的https的数据传输安全

2020-08-20 题目来源:http://www.h-camel.com/index.html

[html] 使用canvas时你有遇到过哪些坑?是如何解决的?

坑之一:输入的文字和坐标都是标准的,但是文字就是不给你在标准展示,坐上偏上。

原因:canvas插入文字的坐标(x,y), 不是左上角相对于画布的坐标,是左下角相对于画布的坐标

(1)x:文字左边相对于画布的坐标

(2)y:文字下面相对于画布的坐标,但是,这个y有个baseline的限制,如果需要严格的上下居中时,需要设置一下它的 baseline.ctx.textBaseline

坑之二:canvas转化为base64图片时,画布上如果有不在统一域名的图片会报错

解决方法:

需要设置跨域的图片允许跨域

Image.setAttribute('crossOrigin', 'anonymous');

crossOrigin="anonymous"在img标签里设

但是也存在设置了属性后还报错的情况,这时候你要看看是不是同时请求了同一张图片,这种情况下,第一次请求图片他会带请求头,第二次请求这张图片时,他会直接取缓存中的数据,然后就挂了。

有篇文章介绍的特别好,但是我找不到了,就记着,这玩意还有一种情况跟cdn有关,也是会拿缓存,解决方法是请求的src地址上加时间戳

转载自 https://www.cnblogs.com/superil/p/8462042.html

[css] 你最喜欢的是哪个css特性?为什么?

animation 可以实现各种动画效果

[js] ]实现一个函数sum, 满足以下需求:

需求:

sum() == 0
sum(1)(2)(3)() == 6
sum(3)(4)() == 7
sum(v1)(v2)...(vn)() == v1+v2+...+v

实现:

 function sum(...arg){
    if(arg.length==0){
        return 0 
    }
    let arr = []
    arr = arr.concat(arg)
    return function fn(...arg){
        if(arg.length==0){
            return arr.reduce((a,b)=>a+b)
        }
        arr = arr.concat(arg)
        return fn
    }
 }  

[软技能] https是如何保证数据传输的安全的?

http定义了如何数据如何包装,tcp负责传输。但https在于tcp的中间层,增加了tls/ssl用来加密。

数据首先传输到TLS/SSL进行数据加密,然后给到TCP来进行传输。

可以参考文章 https://blog.csdn.net/jasonjwl/article/details/50985271

猜你喜欢

转载自blog.csdn.net/vampire10086/article/details/108507063