js+php+java动态中文web字体生成压缩解决方案
网站观察
中文字库非常庞大，webfont技术的使用对于中文来说很吃力，下载个字体都需要好长时间，不过5g可能会好些，但是流量也是钱啊，有没有办法解决中文web字体大小的问题呢
有，首先我们来看看iconfont的实现方式
http://iconfont.cn/webfont#!/webfont/index
通过抓包我们发现在输入了文字后，点击生成，后端程序根据我们的文字首先检测这个字体对应的文字有没有本地缓存，如果有的话直接返回缓存的字体url，如果没有的话就根据源字体和客户端传过来的文字抽取字体生成一个压缩版的新字体存放在服务器的缓存目录中，然后返回url
ok，原理说完了
现在说说怎么实现吧
一、首先js端很好实现
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>BFW NEW PAGE</title>
<script id="bfwone" data="dep=jquery.17&err=0" type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
<script type="text/javascript">
bready(function() {
$('#genfontbtn').click(function() {
$.get("genfont.php", {
fontid: $("#fontid").val(), word: $("#word").val()
},
function(res) {
if (res.err) {
alert(res.data);
} else {
$("#font-style").html("<style>@font-face {font-family: 'bfwfont';src: url('"+res.data+"');font-weight: normal;font-style: normal;}#preview {font-family: 'bfwfont';}</style>");
$("#preview").html($("#word").val());
}
});
});
});
</script>
</head>
<body>
...点击查看剩余70%
{{collectdata}}
网友评论0