Live Note

Remain optimistic

validity 对象

通过 validity 对象,通过下面的 valid 可以查看验证是否通过,如果八种验证都通过返回 true,有一种失败则返回 false

  • oText.addEventListener(‘invalid’, fn, false);
  • ev.preventDefault()
  • valueMissing: 输入值为空时
  • typeMismatch: 控件值与预期类型不匹配
  • patterMismatch: 输入值不满足 pattern 正则
  • tooLong: 超过 maxLength 最大限制
  • rangeUnderflow: 验证的 range 最小值
  • rangeOverflow: 验证的 range 最大值
  • setMismatch: 验证 range 的当前值是否符合 min、max、step 的规则
  • customError: 不符合自定义验证–setCustomValidity()设置自定义验证
Read more »

1
Set-cookie: value[; expires=date][; domain=domain][; path=path][; secure]

每个选项都是用分号和空格来分开,每个选项都制定了 cookie 在什么情况下会发送给服务器

过期时间选项

  • expires: 指定了 cookie 最长存储时间,过期后会被浏览器删除。值是一个 date ,格式为 WDY, DD-mm-YYYY HH:MM:SS GMT
  • 没有设置 expires 选项时,默认为当前会话,所设置的 cookie 在关闭浏览器时会被删除。
1
Set-cookie: name=Jack; expires=Tue, 28 May 2019 22:33:22 GMT

domain 选项

  • domain: 指定了 cookie 将要被发给哪个域中。
  • 默认情况下会被设置为当前域。
  • 值必须是消息头主机的一部分,不合法的 domain 会直接被忽略。
1
Set-cookie: name=Jack; domain=baidu.com

path 选项

  • path: 指定了请求资源的 URL 中存在指定路径时,才会发送 cookie。
  • 只有对 domain 匹配成功后才会开始匹配 path 部分。
1
Set-cookie: name=Jack; domain=baidu.com; path=/

secure 选项

  • secure: 只是一个标记,当请求通过 SSL 或者 HTTPS 创建时,包含 secure 的 cookie 才会被发送至服务器。
  • 默认情况下, HTTPS 上传输的 cookie 都会被自动加上 secure 选项。
1
Set-cookie: name=Jack; secure

HTTPOnly 选项

  • HttpOnly: 禁止浏览器通过 JavaScript 来获取 cookie ,防止 XSS 攻击。
  • 这个属性也不能通过 JavaScript 来设置。
1
Set-cookie: name=Jack; HttpOnly
  1. 会话结束。
  2. 超过过期时间。
  3. cookie 数量达到限制,删除部分 cookie 以便为新创建的 cookie 腾出空间。

可以使用document.cookie来读取 cookie 的值。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
import System.Environment
import System.Directory
import System.IO
import Data.List

main = do
(command:args) <- getArgs -- get the command
let (Just action) = lookup command dispatch -- find the command
action args -- do something

add :: [String] -> IO ()
add [fileName, todoItem] = appendFile fileName (todoItem ++ "\n") -- add the todoItem

view :: [String] -> IO ()
view [fileName] = do -- match the filename
contents <- readFile fileName -- read the file
let todoTasks = lines contents -- get the contents
numberedTasks = zipWith (\n line -> show n ++ ": " ++ line) [0..] todoTasks
putStrLn $ unlines numberedTasks -- show the items

remove :: [String] -> IO ()
remove [fileName, numberString] = do -- get the filename and the line number
handle <- openFile fileName ReadMode
(tempName, tempHandle) <- openTempFile "." "temp" -- create a temp file
contents <- hGetContents handle -- get contents from the handle
let number = read numberString -- read the String to Number
todoTasks = lines contents
newTodoTasks = delete (todoTasks !! number) todoTasks -- remove the line of the number
hPutStr tempHandle $ unlines newTodoTasks -- putStr into the tempfile
hClose handle -- close handles
hClose tempHandle
removeFile fileName
renameFile tempName fileName

dispatch :: [(String, [String] -> IO ())]
dispatch = [
("add", add),
("view", view),
("remove", remove)
]

-- runhaskell arags-test.hs view newData.txt
-- runhaskell args-test.hs add newData.txt "Say Hello"
-- runhaskell args-test.hs remove newData.txt 4

使用 HOC 进行代码复用

假设存在下面两个组件:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
import React from "react"

class ButtonCounter extends React.Component {
constructor(props) {
super(props)

this.state = {
count: 0,
}
}

increase = () => {
let { step } = this.props

this.setState((pre) => {
return {
count: pre.count + step,
}
})
}

render() {
let { count } = this.state

return <button onClick={this.increase}>click {count} times</button>
}
}

export default ButtonCounter
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
import React from "react"

class ButtonCounter extends React.Component {
constructor(props) {
super(props)

this.state = {
count: 0,
}
}

increase = () => {
let { step } = this.props

this.setState((pre) => {
return {
count: pre.count + step,
}
})
}

render() {
let { count } = this.state

return <div onMouseLeave={this.increase}>click {count} times</div>
}
}

export default ButtonCounter

使用 HOC 进行改造

HOC 通过传入的组件,返回一个新的组件。

1
2
3
4
5
6
7
8
9
10
11
12
13
import React from "react"

const withCounter = (OriginalComponent) => {
class newComponent extends React.Component {
render() {
return <OriginalComponent />
}
}

return newComponent
}

export default withCounter
Read more »

在使用 Android dev 开发 flutter 应用时,控制台会输出 GPU debug 日志:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
[+1001 ms] D/EGL_emulation( 9434): app_time_stats: avg=1001.31ms min=1001.31ms max=1001.31ms count=1
[+1989 ms] D/EGL_emulation( 9434): app_time_stats: avg=994.95ms min=992.16ms max=997.75ms count=2
[+1996 ms] D/EGL_emulation( 9434): app_time_stats: avg=998.40ms min=994.74ms max=1002.06ms count=2
[+2005 ms] D/EGL_emulation( 9434): app_time_stats: avg=1002.85ms min=990.68ms max=1015.03ms count=2
[+1983 ms] D/EGL_emulation( 9434): app_time_stats: avg=991.95ms min=987.00ms max=996.89ms count=2
[+1016 ms] D/EGL_emulation( 9434): app_time_stats: avg=1015.37ms min=1015.37ms max=1015.37ms count=1
[+1002 ms] D/EGL_emulation( 9434): app_time_stats: avg=1002.23ms min=1002.23ms max=1002.23ms count=1
[+1002 ms] D/EGL_emulation( 9434): app_time_stats: avg=1003.33ms min=1003.33ms max=1003.33ms count=1
[+1008 ms] D/EGL_emulation( 9434): app_time_stats: avg=1005.76ms min=1005.76ms max=1005.76ms count=1
[+1997 ms] D/EGL_emulation( 9434): app_time_stats: avg=999.30ms min=994.23ms max=1004.37ms count=2
[+1998 ms] D/EGL_emulation( 9434): app_time_stats: avg=998.66ms min=998.60ms max=998.71ms count=2
[+2000 ms] D/EGL_emulation( 9434): app_time_stats: avg=1000.03ms min=998.15ms max=1001.91ms count=2
[+1998 ms] D/EGL_emulation( 9434): app_time_stats: avg=999.53ms min=999.27ms max=999.79ms count=2
[+1990 ms] D/EGL_emulation( 9434): app_time_stats: avg=995.32ms min=993.38ms max=997.25ms count=2
[+1001 ms] D/EGL_emulation( 9434): app_time_stats: avg=1001.47ms min=1001.47ms max=1001.47ms count=1
[+1001 ms] D/EGL_emulation( 9434): app_time_stats: avg=1001.27ms min=1001.27ms max=1001.27ms count=1
[+1004 ms] D/EGL_emulation( 9434): app_time_stats: avg=1004.90ms min=1004.90ms max=1004.90ms count=1
[+1005 ms] D/EGL_emulation( 9434): app_time_stats: avg=1005.88ms min=1005.88ms max=1005.88ms count=1
[+1979 ms] D/EGL_emulation( 9434): app_time_stats: avg=989.67ms min=979.52ms max=999.82ms count=2

这些日志并不影响应用的运行,但是会占用控制台的空间,可以通过以下方式忽略掉:

1
flutter run --dart-define=ENV=dev --verbose | grep -v "EGL_emulation"