发表更新Tech / FrontEnd2 分钟读完 (大约234个字)

神奇的 @media (prefers-color-scheme: dark)

夜间模式已经实现很久了，当初有人跟我讲，可以增加一个按时间切换的功能。

直到我在无意间查看 Reabble 阅读器的 CSS 样式时，发现了 @media (prefers-color-scheme: dark) 选择器。

来自：prefers-color-scheme - CSS（层叠样式表） | MDN
prefers-color-scheme CSS 媒体特性用于检测用户是否有将系统的主题色设置为亮色或者暗色。

简而言之，就是可以实现随系统（或浏览器）的深、浅色模式设置，改变网页配色。

我觉得这是比按时间切换更好的一个实现，跟随系统设置比跟随时间更加人性化一些，毕竟还有我这种，白天开深色，晚上开浅色的异类（逃）

阅读更多
发表Tech / FrontEnd6 分钟读完 (大约831个字)

VuePress 密码加密文章

前言

事情的起因是，我需要一个存放未分类整理知识点，以及收藏转载文章的私人知识库，和 iMaeGoo’s Blog 区别开来。

我尝试过简书、语雀、Evernote、OneNote、有道云笔记，对它们的 markdown 支持、导出能力、搜索能力、容量、安全性都有体会。

频繁的整顿让我对其安全性产生担忧

最后我决定建一个私人 Git 仓库，用 markdown 来记笔记。然后通过 CI/CD 自动构建到一个叫 iMaeGoo’s Diary 的 VuePress 网站。写笔记 Notepad + Git 就能搞定，还能自由选择多种多样的 markdown 编辑器，手机端也可以通过在线 IDE 更新内容，VuePress 的搜索非常好用，安全性也完全在自己的掌控范围之内。

反正是知识库嘛，我配置了完全公开，方便自己随时随地查看，但由于是未经整理的知识库，也不建议访客去看啦。

问题就来了，有些笔记包含了敏感信息，怎么在公开的知识库中保护这类信息？

在寻找 VuePress 加密时，我发现了 vuepress-plugin-encrypt 这个好用的插件，使用了 aes-128-ctr 来加密内容，你可以直接查看它的英文官方文档。

阅读更多
发表Tech / FrontEnd3 分钟读完 (大约458个字)

PC 浏览器平滑惯性滚动（smooth scroll）一套简单实现

前言

主要是 Bing 找了许多 libraries。效果在 Chrome for Windows 上都不理想，要么滚动很生硬，要么就是太复杂，就自己实现了。

本来是 PC only 的，写好后测试了一下移动端，是兼容的，效果也还不错……

不过反正移动端都自带惯性滑动了

效果

无惯性滚动

有惯性滚动

阅读更多
发表Tech / FrontEnd2 分钟读完 (大约290个字)

解决 Edge 浏览器 SCRIPT5022: Exception thrown and not caught

JS 代码在 Safari, Chrome, Firefox 都是好的，就只有 Edge 莫名其妙地报错。

1
SCRIPT5022: Exception thrown and not caught

未捕获的异常？EXM？你倒是说是什么异常啊？行号还是错的？点过去无法定位错误位置？hash-navigation.js？我的项目里根本都没有这个 js 啊喂！

阅读更多
发表Tech / FrontEnd3 分钟读完 (大约401个字)

纯 CSS 实现椭圆轨迹旋转小球

话不多说看效果

阅读更多
发表Tech / BackEnd7 分钟读完 (大约1065个字)

JDBC 连接 Azure Database for MySQL 报错 SSL peer shut down incorrectly 的解决

这个问题找了一天的原因，如果你也遇到了这个问题，希望能帮到你。

完整错误信息：

点击展开 >folded
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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
03-Jun-2020 07:52:22.772 SEVERE [main] org.apache.tomcat.jdbc.pool.ConnectionPool.init Unable to create initial connections of pool.
	com.mysql.jdbc.exceptions.jdbc4.CommunicationsException: Communications link failure

The last packet successfully received from the server was 384 milliseconds ago.  The last packet sent successfully to the server was 376 milliseconds ago.
		at java.base/jdk.internal.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method)
		at java.base/jdk.internal.reflect.NativeConstructorAccessorImpl.newInstance(NativeConstructorAccessorImpl.java:62)
		at java.base/jdk.internal.reflect.DelegatingConstructorAccessorImpl.newInstance(DelegatingConstructorAccessorImpl.java:45)
		at java.base/java.lang.reflect.Constructor.newInstance(Constructor.java:490)
		at com.mysql.jdbc.Util.handleNewInstance(Util.java:411)
		at com.mysql.jdbc.SQLError.createCommunicationsException(SQLError.java:1117)
		at com.mysql.jdbc.ExportControlled.transformSocketToSSLSocket(ExportControlled.java:105)
		at com.mysql.jdbc.MysqlIO.negotiateSSLConnection(MysqlIO.java:5126)
		at com.mysql.jdbc.MysqlIO.proceedHandshakeWithPluggableAuthentication(MysqlIO.java:1666)
		at com.mysql.jdbc.MysqlIO.doHandshake(MysqlIO.java:1244)
		at com.mysql.jdbc.ConnectionImpl.coreConnect(ConnectionImpl.java:2397)
		at com.mysql.jdbc.ConnectionImpl.connectOneTryOnly(ConnectionImpl.java:2430)
		at com.mysql.jdbc.ConnectionImpl.createNewIO(ConnectionImpl.java:2215)
		at com.mysql.jdbc.ConnectionImpl.<init>(ConnectionImpl.java:813)
		at com.mysql.jdbc.JDBC4Connection.<init>(JDBC4Connection.java:47)
		at java.base/jdk.internal.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method)
		at java.base/jdk.internal.reflect.NativeConstructorAccessorImpl.newInstance(NativeConstructorAccessorImpl.java:62)
		at java.base/jdk.internal.reflect.DelegatingConstructorAccessorImpl.newInstance(DelegatingConstructorAccessorImpl.java:45)
		at java.base/java.lang.reflect.Constructor.newInstance(Constructor.java:490)
		at com.mysql.jdbc.Util.handleNewInstance(Util.java:411)
		at com.mysql.jdbc.ConnectionImpl.getInstance(ConnectionImpl.java:399)
		at com.mysql.jdbc.NonRegisteringDriver.connect(NonRegisteringDriver.java:334)
		at org.apache.tomcat.jdbc.pool.PooledConnection.connectUsingDriver(PooledConnection.java:319)
		at org.apache.tomcat.jdbc.pool.PooledConnection.connect(PooledConnection.java:212)
		at org.apache.tomcat.jdbc.pool.ConnectionPool.createConnection(ConnectionPool.java:744)
		at org.apache.tomcat.jdbc.pool.ConnectionPool.borrowConnection(ConnectionPool.java:676)
		at org.apache.tomcat.jdbc.pool.ConnectionPool.init(ConnectionPool.java:483)
		at org.apache.tomcat.jdbc.pool.ConnectionPool.<init>(ConnectionPool.java:154)
		at org.apache.tomcat.jdbc.pool.DataSourceProxy.pCreatePool(DataSourceProxy.java:118)
		at org.apache.tomcat.jdbc.pool.DataSourceProxy.createPool(DataSourceProxy.java:107)
		at org.apache.tomcat.jdbc.pool.DataSourceFactory.createDataSource(DataSourceFactory.java:560)
		at org.apache.tomcat.jdbc.pool.DataSourceFactory.getObjectInstance(DataSourceFactory.java:244)
		at org.apache.naming.factory.FactoryBase.getObjectInstance(FactoryBase.java:96)
		at java.naming/javax.naming.spi.NamingManager.getObjectInstance(NamingManager.java:325)
		at org.apache.naming.NamingContext.lookup(NamingContext.java:857)
		at org.apache.naming.NamingContext.lookup(NamingContext.java:160)
		at org.apache.naming.NamingContext.lookup(NamingContext.java:843)
		at org.apache.naming.NamingContext.lookup(NamingContext.java:174)
		at org.apache.catalina.core.NamingContextListener.addResource(NamingContextListener.java:1017)
		at org.apache.catalina.core.NamingContextListener.createNamingContext(NamingContextListener.java:557)
		at org.apache.catalina.core.NamingContextListener.lifecycleEvent(NamingContextListener.java:253)
		at org.apache.catalina.util.LifecycleBase.fireLifecycleEvent(LifecycleBase.java:123)
		at org.apache.catalina.core.StandardServer.startInternal(StandardServer.java:924)
		at org.apache.catalina.util.LifecycleBase.start(LifecycleBase.java:183)
		at org.apache.catalina.startup.Catalina.start(Catalina.java:633)
		at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
		at java.base/jdk.internal.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
		at java.base/jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
		at java.base/java.lang.reflect.Method.invoke(Method.java:566)
		at org.apache.catalina.startup.Bootstrap.start(Bootstrap.java:344)
		at org.apache.catalina.startup.Bootstrap.main(Bootstrap.java:475)
	Caused by: javax.net.ssl.SSLHandshakeException: Remote host terminated the handshake
		at java.base/sun.security.ssl.SSLSocketImpl.handleEOF(SSLSocketImpl.java:1322)
		at java.base/sun.security.ssl.SSLSocketImpl.decode(SSLSocketImpl.java:1160)
		at java.base/sun.security.ssl.SSLSocketImpl.readHandshakeRecord(SSLSocketImpl.java:1063)
		at java.base/sun.security.ssl.SSLSocketImpl.startHandshake(SSLSocketImpl.java:402)
		at com.mysql.jdbc.ExportControlled.transformSocketToSSLSocket(ExportControlled.java:90)
		... 44 more
		Suppressed: java.net.SocketException: Broken pipe (Write failed)
			at java.base/java.net.SocketOutputStream.socketWrite0(Native Method)
			at java.base/java.net.SocketOutputStream.socketWrite(SocketOutputStream.java:110)
			at java.base/java.net.SocketOutputStream.write(SocketOutputStream.java:150)
			at java.base/sun.security.ssl.SSLSocketOutputRecord.encodeAlert(SSLSocketOutputRecord.java:81)
			at java.base/sun.security.ssl.TransportContext.fatal(TransportContext.java:351)
			at java.base/sun.security.ssl.TransportContext.fatal(TransportContext.java:263)
			at java.base/sun.security.ssl.SSLSocketImpl.startHandshake(SSLSocketImpl.java:405)
			... 45 more
	Caused by: java.io.EOFException: SSL peer shut down incorrectly
		at java.base/sun.security.ssl.SSLSocketInputRecord.decode(SSLSocketInputRecord.java:167)
		at java.base/sun.security.ssl.SSLTransport.decode(SSLTransport.java:108)
		at java.base/sun.security.ssl.SSLSocketImpl.decode(SSLSocketImpl.java:1152)
		... 47 more

提取关键信息：

1
2
Caused by: javax.net.ssl.SSLHandshakeException: Remote host terminated the handshake
Caused by: java.io.EOFException: SSL peer shut down incorrectly

得知 SSL 握手失败，于是我找了 Azure 的示例代码（https://docs.azure.cn/zh-cn/mysql/connect-java）来测，也是同样的问题。

阅读更多
网页中文字体压缩（woff2）、拆分、去繁体字库，提高加载速度
发表Tech / FrontEnd6 分钟读完 (大约907个字)

网页中文字体压缩（woff2）、拆分、去繁体字库，提高加载速度

从客户得到的网页字体足足有 10MB 大小，会严重拖慢网页加载，如何处理？

阅读下面的解决方法前，建议先阅读网页字体优化，了解一些基本知识以及这么做的原因。

字体去繁体

GBK 结尾的字体偏大的原因是包含庞大的繁体字库，大多数网页并不需要，可以使用 fontTools 得到字体的简体中文子集。

阅读更多
GitHub
微信二维码

归档

最新文章

最新评论

×