Skip to content

关雎

原文

关关雎鸠,在河之洲。窈窕淑女,君子好逑。
参差荇菜,左右流之。窈窕淑女,寤寐求之。
求之不得,寤寐思服。悠哉悠哉,辗转反侧。
参差荇菜,左右采之。窈窕淑女,琴瑟友之。
参差荇菜,左右芼之。窈窕淑女,钟鼓乐之。

背景

注释

关关雎鸠,在河之洲。窈窕淑女,君子好逑。
参差荇菜,左右流之。窈窕淑女,寤寐求之。
求之不得,寤寐思服。悠哉悠哉,辗转反侧。
参差荇菜,左右采之。窈窕淑女,琴瑟友之。
参差荇菜,左右芼之。窈窕淑女,钟鼓乐之。

分词

关关 象声词
雎鸠 名词 动物 鸟 水鸟

河 名词

洲 名词
窈窕
淑女
君子 名词


逑 名词

参差荇菜 名词
左右流之 代词

窈窕淑女寤寐求之 代词
求之 代词
不得寤寐思服
悠哉悠哉辗转反侧
参差荇菜 名词
左右采之 代词
窈窕淑女琴瑟 名词
友之 代词
参差荇菜 名词
左右毛之 代词
窈窕淑女钟鼓 名词
乐之 代词

微信内置浏览器H5如何清除缓存以及 cookie 和 localStorage 何时清除

背景

我们在开发微信 H5页面的时候经常会遇到资源文件(图片、css、js 等)不更新的问题,其实解决方案很简单,只要在请求地址之后加一个随机数参数即可:

<img src="./img/image-url-test.jpg?v20180318214000">

本文想探究的是除了主动在资源文件上加参数以外,通过微信 App 自身,有哪些用户可操作的动作会清空缓存,以及微信内置浏览器的 cookie 和 localStorage 会在何时清除。

本实验将在 iOS 和安卓的微信6.6.5版本上展开。

试验

我们整理了一下微信的相关操作:

1 刷新
右上角菜单-刷新
  • iOS 如果连续操作两次点开右上角菜单刷新,会更新资源文件
  • 安卓如何刷新都不会更新资源文件
2 清除缓存
1. iOS:设置-通用-存储空间-清理微信缓存
2. 安卓:设置-通用-微信存储空间(点击进入时自动清除缓存)
  • iOS 清除缓存不会清理 webview的浏览器缓存
  • 安卓点击“微信存储空间”之后,会清除缓存==以及清空 cookie 和 localStorage==
3 删除聊天记录
1. iOS:设置-通用-清空聊天记录
2. 安卓:设置-聊天-清空聊天记录
  • 不管是安卓还是 iOS,清空聊天记录并不能清除缓存、cookie、和 localStorage
4 注销登录
  • 不管是安卓还是 iOS,注销之后重登陆,都会清除缓存、cookie、和 localStorage
5 删除重装(没有试过)
  • 没有尝试。

总结

清除缓存

  • iOS 点击右上角菜单刷新,连续操作两次
  • 安卓 设置-通用-微信存储空间,点击去即可

清空 cookie 和 localStorage

  • iOS 重新登录
  • 安卓 设置-通用-微信存储空间,点击去即可

一个典型的闭包方案,取for循环中i的值

有个网友问了个问题,如下的html,为什么每次输出都是5,而不是点击每个p,就alert出对应的1,2,3,4,5。

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>闭包演示</title>
    <script type="text/javascript">
    function init() {
        var pAry = document.getElementsByTagName("p");
        for( var i=0; i<pAry.length; i++ ) {
             pAry[i].onclick = function() {
             alert(i);
        }
      }
    }
    </script>
</head>
<body onload="init();">
    <p>产品一</p>
    <p>产品二</p>
    <p>产品三</p>
    <p>产品四</p>
    <p>产品五</p>
</body>
</html>

解决方式

1 将变量 i 保存给在每个段落对象(p)上

function init() {
  var pAry = document.getElementsByTagName("p");
  for( var i=0; i<pAry.length; i++ ) {
     pAry[i].i = i;
     pAry[i].onclick = function() {
        alert(this.i);
     }
  }
}

2 将变量 i 保存在匿名函数自身

function init2() {
  var pAry = document.getElementsByTagName("p");
  for( var i=0; i<pAry.length; i++ ) {
   (pAry[i].onclick = function() {
        alert(arguments.callee.i);
    }).i = i;
  }
}

3 加一层闭包,i以函数参数形式传递给内层函数

function init3() {
  var pAry = document.getElementsByTagName("p");
  for( var i=0; i<pAry.length; i++ ) {
   (function(arg){
       pAry[i].onclick = function() {
          alert(arg);
       };
   })(i);//调用时参数
  }
}

4 加一层闭包,i以局部变量形式传递给内存函数

function init4() {
  var pAry = document.getElementsByTagName("p");
  for( var i=0; i<pAry.length; i++ ) {
    (function () {
      var temp = i;//调用时局部变量
      pAry[i].onclick = function() {
        alert(temp);
      }
    })();
  }
}

5 加一层闭包,返回一个函数作为响应事件(注意与3的细微区别)

function init5() {
  var pAry = document.getElementsByTagName("p");
  for( var i=0; i<pAry.length; i++ ) {
   pAry[i].onclick = function(arg) {
       return function() {//返回一个函数
       alert(arg);
     }
   }(i);
  }
}

6 用Function实现,实际上每产生一个函数实例就会产生一个闭包

function init6() {
    var pAry = document.getElementsByTagName("p");
    for( var i=0; i<pAry.length; i++ ) {
      pAry[i].onclick = new Function("alert(" + i + ");");//new一次就产生一个函数实例
    }
}

7 用Function实现,注意与6的区别

function init7() {
    var pAry = document.getElementsByTagName("p");
    for( var i=0; i<pAry.length; i++ ) {
         pAry[i].onclick = Function('alert('+i+')')
    }
}

转自:https://www.cnblogs.com/syf/archive/2012/10/04/2711828.html

字符编码

字符编码讲解文章:


前端历史课:那些来自洪荒时代的编码知识
JavaScript 有个 Unicode 的天坑


ASCII

编码 缩写 说明 编码 字符 编码 字符 编码 字符
0 NUL(null) 空字符 33 ! 65 A 97 a
1 SOH(start of headline) 标题开始 34 66 B 98 b
2 STX (start of text) 正文开始 35 # 67 C 99 c
3 ETX (end of text) 正文结束 36 $ 68 D 100 d
4 EOT (end of transmission) 传输结束 37 % 69 E 101 e
5 ENQ (enquiry) 请求 38 & 70 F 102 f
6 ACK (acknowledge) 收到通知 39 71 G 103 g
7 BEL (bell) 响铃 40 ( 72 H 104 h
8 BS (backspace) 退格 41 ) 73 I 105 i
9 HT (horizontal tab) 水平制表符 42 * 74 J 106 j
10 LF (NL line feed, new line) 换行键 43 + 75 K 107 k
11 VT (vertical tab) 垂直制表符 44 , 76 L 108 l
12 FF (NP form feed, new page) 换页键 45 77 M 109 m
13 CR (carriage return) 回车键 46 . 78 N 110 n
14 SO (shift out) 不用切换 47 / 79 O 111 o
15 SI (shift in) 启用切换 48 0 80 P 112 p
16 DLE (data link escape) 数据链路转义 49 1 81 Q 113 q
17 DC1 (device control 1) 设备控制1 50 2 82 R 114 r
18 DC2 (device control 2) 设备控制2 51 3 83 S 115 s
19 DC3 (device control 3) 设备控制3 52 4 84 T 116 t
20 DC4 (device control 4) 设备控制4 53 5 85 U 117 u
21 NAK (negative acknowledge) 拒绝接收 54 6 86 V 118 v
22 SYN (synchronous idle) 同步空闲 55 7 87 W 119 w
23 ETB (end of trans. block) 结束传输块 56 8 88 X 120 x
24 CAN (cancel) 取消 57 9 89 Y 121 y
25 EM (end of medium) 媒介结束 58 : 90 Z 122 z
26 SUB (substitute) 代替 59 ; 91 [ 123 {
27 ESC (escape) 换码(溢出) 60 < 92 \ 124 |
28 FS (file separator) 文件分隔符 61 = 93 ] 125 }
29 GS (group separator) 分组符 62 > 94 ^ 126 ~
30 RS (record separator) 记录分隔符 63 ? 95 _
31 US (unit separator) 单元分隔符 64 @ 96 `
32 (space) 空格

GB2312

高位字节范围 0xA1-0xF7 161-247 87
低位字节范围 0xA1-0xFE 161-254 94
8178

GBK

高位字节扩展到了 0×81-0xFE 129-254
低位字节扩展到了 0x40-0xFE(不包含0x7F) 64-254
23940

GB18030

  • 字节的值范围: 0 到 0x7F,与 ASCII 兼容。
  • 字节的值范围: 高位 0x81 到 0xFE。 低位 0x40 到 0xFE 与 GBK 标准兼容。
  • 字节的值范围: 一字节 0x81 到 0xFE,二字节 0x30 到 0x39,三字节 0x81 到 0xFE,四字节从 0x30 到 0x39

emoji

\uE000 – \uEFFF

《小森林》,影片中提到的29种食材(多图)。

(桥本爱 × 村妹纸 × 天然呆 × 心独白 × 野食谱 × 闲生活 × 农家乐 + 万变云 + 清爽风 + 绿油油 + 湿淋淋 + 小动物)/ 无剧情 = 抗抑郁特效治愈片《小森林》

一部秉着理想主义拍摄的日本版“舌尖中国”,列述了主人公市子在一年四季根据不同食材的27个菜单。这其中有我们熟悉的土豆、西红柿,也有我们不常听说的雨久花、通草果。

1 米水饴

很多人搞不清楚做面包时用的这个“米水饴”是何物,其实就是糖浆啦!水饴是从淀粉中提取的糖浆。在中国这个东西叫麦芽糖~,只不过他们叫“水饴,可能是从大米的淀粉里面提取的。电影中的“米水飴”是由日本 MITOKU MACROBIOTIC 公司生产的,日本各大超市、网店都有售卖,标价626日元,用料显示是日本大米和加拿大进口麦芽。

2 胡颓子

国内多称为“羊奶子”,在南方部分省份有分布,比较少见。如果与常见果实攀亲戚的话,它和石榴同属于桃金娘目,但是属于不同科,所以相去甚远。电影中胡颓子用来做果酱,还可以酿酒、入药。

 

3 伍斯特酱油

伍斯特酱油并不是传统意义上的“酱油”,而是一种调味汁,起源于英国的伍斯特郡,英文名为 Worcestershire sauce,日本的伍斯特酱油(ウスターソース)虽然名字一样,但是和英国伍斯特郡酱是有区别的,小编猜测可能是日本的一种本地化演化。

 

4 榛子

榛子是制作榛子酱的原料,其中还会放可可粉。Nutella是一个意大利品牌,前不久这款产品还因为涉嫌致癌被下架,所以大家就不要跟风了。

 

5 雨久花

这个中国北方大部分地区也都有,不过好像很少拿来吃,多数都喂牛了(白眼),顾名思义,这是一种很小清新的花卉……你怎么可以吃它!

 

6 大米

这个就不说了,我只是觉得图片不错就保存了一下。

 

7 红点鲑

鲑鱼的一种,其实红点鲑也有很多种,这种日本红点鲑应该是生活于溪水的淡水鱼类,和三文鱼其实很像。

 

8 番茄

 

9 通草果

国内也比较少见,其实在日本也不见得就多见,只是电影中提了而已。国内叫野香蕉或者八月瓜,在南方少数省份有,可以生吃内瓤。

 

10 板栗

为什么说《小森林》拍得很理想主义呢,电影中女主想吃栗子了就上山捡几个,从带刺的壳里抠出来。而事实上,板栗一般的收获方式是连带刺的蓬壳一起收集起来集中存储,这样不易腐烂,然后统一去壳。

电影里用板栗做糖煮板栗,看起来很甜。

 

11 红薯

很多人喜欢吃烤地瓜,这是公认的地瓜的最佳食用方式。但是我不晓得大家有没有吃过红薯干,我妈妈做的很好吃,是零食极品。我在市场上也见过不少,可惜都很难吃。这个做起来很简单,我建议大家可以尝试下。

买红薯蒸熟,一定要买甜心的,放凉了之后切片,热的时候会粘刀,最后自然晾干,不要晾的太硬。

 

12 番鸭

其实就是鸭子啦,至于是哪一种鸭子,反正是养殖的好吃的鸭子……不懂日语,不知道为什么要翻译成“番鸭”。确实是有番鸭这种鸭子,但是是不是电影里那种就不得而知了。

 

13 青菜

青菜就是青菜啦。中国地域太广阔了,很多菜的名字叫法不一样,尤其是豆角和青菜。有的地方豇豆叫豆角,有的豆角叫芸豆,有的芸豆叫梅豆,有的梅豆叫豆角……所有绿叶子的都可以叫青菜,很多地方青菜就是小白菜,江西人把油菜叫做小白菜。

别管那么多了……会吃就行了。

 

14 纳豆

这个真是日本人喜闻乐见的食物,很多日料店都有,其实是中国人发明的,后来大概中国人觉得太难吃了就不吃了。好多人以为这个东西是黄豆做的,其实——就是黄豆做的。

 

15 冻萝卜

其实就是萝卜干啦,在我们农村,这个是喂猪的……

 

16 柿子

我们吃柿子多数是等着柿子熟透了嘬着吃,其实柿子在刚刚成熟、即将变软的时候也很好吃。

 

17 红豆

两岸人家微雨后,收红豆,树底纤纤抬素手。

 

18 印度考薄饼

顾名思义,阿三味十足。

 

19 蕨菜

国内好像不常吃,但是有广泛的分布,一般当青菜炒的比较多。

 

20 红叶草

日本有道名菜叫做“天妇罗(天ぷら)”,其实就是各种东西炸了吃,凑一盘,大概是下面这个样子:

电影中提到了红叶伞、延龄草、猪牙花、鹅掌草、白根葵,还有没有上镜(因为女主没找到)的金漆叶和荚果蕨。

金漆叶(コシアブラ),这个翻译可能也不对,其实应该翻译成“五加树”,英文名是 Acanthopanax sciadophylloides,翻译成中文就是短轴五加。短轴五加只有2个品种,一个在中国叫中华五加树,另一种在日本,大概就是这个,非常少见。

荚果蕨(コゴミ),正式日文名クサソテツ(草蘇鉄),是一种普通的蕨类植物,在中国很多地方都有,但是没有人吃。

红叶伞(シドケ)的正式名称是モミジガサ,这不重要,翻译过来反正都是红叶伞或者红叶笠,英文名是 Parasenecio delphiniifolius。叫它红叶伞大概是因为叶子像枫叶,枫叶又叫红叶嘛。这个称呼只是日本的称呼,对应的中文学名应该是翠雀叶蟹甲草,比较少见。

 

21 延龄草

延龄草(エンレイソウ)是一种常见的野生植物。电影中的延龄草根据形态判断跟“吉林延龄草”很像是同一个品种,在我国东北地区广泛分布。延龄草的发音和汉语很像,说明这个名字是从中国传入或者古代就已经存在了。

22 猪牙花

电影中翻译好像是“猪芽花”,其实是“猪牙(カタクリ)”,日语カタール の 花翻译过来就是像猪牙一样的花,因为花开的时候很像是猪的獠牙。不太常见,属于寒带植物,在吉林南部有分布。

 

23 鹅掌草

鹅掌草(ニリンソウ),很明显,是因为叶子像鹅掌,但是“鹅掌”是中国人的叫法,日语直译过来应该是“二輪草”,英文名 Anemone flaccida。在国内很多地方也都有,但是没有人吃……又是野草,所以很少有人注意到。

 

24 白根葵

白根葵(シラネアオイ,英文名 Glaucidium palmatum Siebold et Zucc.),“白根”不是白色的根,而是日本一个地名,是日本固有植物,其他地方没有,反正就算在中国有,也没有人会吃的。下图中左边的是白根葵。

 

25 淴芽

这个估计是译者笔误,没有“淴(hū)芽”这种东西,而应该是“楤(sǒng)木”的嫩芽,影片中叫做“タランボ”,正式日文名叫“タラノキ”。楤木也有很多品种,和国内的辽东楤木属于同一类树木。楤木芽在日本非常流行,类似于我们吃香椿芽。

 

26 冬花

冬花的正式名称是款冬(フキ),又叫蜂斗菜,英文名Petasites japonicus,俗称ふきのとう,在电影中叫做ばつけ,都是同一种东西 。款冬是菊花的一种,在中国被当作药材。电影中提到的款冬和我们平时入药的款冬应该不是同一品种。在日本,款冬是一种传统蔬菜,可以长的很高大,经常被用作调味料。电影里女主用它的出芽时的苞蕾做味噌。味噌其实就是日本的豆瓣酱,みそ(miso)音译过来了的。

 

27 节节草

节节草有不同品种,在国内分布广泛,也是被当作中药材的。(日本人真是饿疯了,什么都拿来吃,中国人则是什么都是药材……)

 

28 野蒜

野蒜在国内其实很常见,说起来应该不算是蒜,而是葱。我小时候在河边的树林子里经常能挖到,很多年没有见过了,真的很好吃,比蒜苗什么的香了不止一个档次。

 

29 圆白菜的花

圆白菜很常见,又叫卷心菜、大头菜、甘蓝……但是我们很少见它的花……

前端图片懒加载

https://mp.weixin.qq.com/s/JYglEGYN9tnGpDg7ARPx7w
http://gitlab.66xue.com/xdf-fe/LoadOnDemand

免费二维码API

http://qr.liantu.com/api.php?text=https://feizhaojun.com&logo=&w=200

http://pan.baidu.com/share/qrcode?w=150&h=150&url=https://feizhaojun.com

http://b.bshare.cn/barCode?site=weixin&url=https://feizhaojun.com

http://s.jiathis.com/qrcode.php?https://feizhaojun.com

http://www.kuaizhan.com/common/encode-png?large=true&data=https://feizhaojun.com

http://comet.blog.sina.com.cn/qr?http://sina.com 只支持sina域且不支持https

Tomcat本地调试开启https

两步即可:

  1. 下载证书 214306549150548.pfx(密码:ymu2),将证书放到 Tomcat 安装目录下。(比如我放在 Tomcat 安装目录下的 cert 文件夹中,路径随意,直接放安装目录根目录也可以。PS. 其实这个证书是滥竽充数的,我们只是需要一个加密的.pfx文件)

  2. 配置 Server.xml。在 Tomcat 安装目录的 conf 文件夹中找到 Server.xml,打开之后,找到端口为 8443 的 Connnector,在这个标签中增加以下属性:

keystoreFile="cert/214306549150548.pfx" keystoreType="PKCS12" keystorePass="214306549150548"
  • keystoreFile 就是证书放的位置,刚才我说了我放在 Tomcat 安装目录的 cert 文件夹中。keystoreType 必须为 PKCS12,keystorePass 必须是 214306549150548,是与我提供下载的 .pfx 文件相对应的。

特别注意

如果使用了 Eclipse 集成的 Tomcat,你可能有多个 Server 配置文件,这些配置文件一般在 \项目工作目录.metadata.plugins\org.eclipse.wst.server.core\tmp*\conf 当中,同样,也要注意 证书文件存放的目录要对应上。

因为https证书是和域名相关联的,所以本地调试应该是会提示不安全。解决这个问题:
hosts绑定mock.link到本地IP,因为我是用这个域名申请的证书。
别的办法我就不知道了

前端坑汇总(浏览器Bug)

1 Safari里面如果声明一个没有赋值的全局变量,浏览器会自动在DOM中找id为这个变量名的元素赋值给变量。

<div id="test"></div>

<script>
  var test;
  console.log(test); // [object HTMLDivElement]
</script>

IIS7支持JSP(IIS7将80端口转发到Tomcat)

如果是IIS6看这里:IIS支持JSP(Windows2003下IIS6.0配置Tomcat8.0支持JSP)

如果需要 Windows 支持 JSP,我们并不需要通过 IIS,只需要安装 Tomcat 即可。
但是,因为 IIS 已经占用了 80 端口,那么我们在访问 Tomcat 的时候每次都要带上:8080或者其他端口号。
下面我们将实现如何让 Tomcat 和 IIS 共享 80 端口。

1 为了支持Java,下载JDK并安装,我选了1.8.0版本:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

2 为了支持JSP,下载Tomcat并安装,我选了8.0版本:http://tomcat.apache.org/download-80.cgi

3 为了连接IIS和Tomcat,下载isapi_redirect并安装,我选了1.2.14版本:http://archive.apache.org/dist/tomcat/tomcat-connectors/jk/binaries/win32/jk-1.2.14/

4 安装isapi_redirect之后,打开 IIS 网站列表,选中默认站点(Default Web Site),该网站下面会出现一个虚拟目录 jakarta。同时,右侧选择“ISAPI 筛选器”,会出现一个jakarta,指向 isapi_redirect 安装目录的 dll 文件。我们不管这个,因为通常我们要新建一个站点。

5 添加网站,物理路径随意。然后,右键该站点,为该站点添加应用程序,名称必须是 jakarta,物理路径指向“isapi_redirect安装目录\bin\”。在选中该 IIS 站点,右侧打开“ISAPI筛选器”,添加,名称必须是 jakarta,可执行文件选择“isapi_redirect安装目录\bin\isapi_redirect.dll”。

6 在IIS中左侧选中计算机名,右侧找到“ISAPI和CGI限制”,添加,路径选择“isapi_redirect安装目录\bin\isapi_redirect.dll”,描述须为 jakarta,并勾选允许执行。

7 点击该站点的应用程序 jakarta,右侧选择“处理程序映射”,右侧“编辑功能权限”,勾选执行。

8 选择该IIS站点,右侧“处理程序映射”,添加脚本映射,路径写 *.jsp,可执行文件“isapi_redirect安装目录\bin\isapi_redirect.dll”,名称随意,比如JSP。

9 isapi_redirect 有两个重要的配置文件,在安装目录的 conf 文件夹,workers.properties.minimal 使用默认配置。修改 uriworkermap.properties 文件,在末尾添加一行 /*=wlb。

10 重启 IIS 和 Tomcat,完工。

如有疑问可以联系我


TOP