博客集成Hitokoto·一言经典语句功能

转载 张戈博客  2017-10-12 15:29  阅读 272 次 评论 0 条 百度已收录

Hitokoto·一言是一个挺有意思的项目,官方的自我介绍如下:

温馨提示

一言网(Hitokoto.cn)创立于2016年,隶属于萌创Team,目前网站主要提供一句话服务。

动漫也好、小说也好、网络也好,不论在哪里,我们总会看到有那么一两个句子能穿透你的心。我们把这些句子汇聚起来,形成一言网络,以传递更多的感动。如果可以,我们希望我们没有停止服务的那一天。

简单来说,一言指的就是一句话,可以是动漫中的台词,也可以是网络上的各种小段子。
或是感动,或是开心,有或是单纯的回忆。来到这里,留下你所喜欢的那一句句话,与大家分享,这就是一言存在的目的。

自己用了好一段时间了,看到有不少朋友在问文章底部那个一句话是怎么实现的,所以这里来分享下。

一、他山之石

张戈博客之前是调用的自由天空的一言API接口,稳定性和速度还不错,不想折腾的朋友推荐参考他的教程快速部署一个即可。

Ps:喜欢使用官方接口也可以前往官方的API介绍地址参考部署:http://hitokoto.cn/api

如果是像我这种比较喜欢折腾的朋友,可以考虑自己部署一个,主要是方便DIY句子库内容。当然,自己部署的文章其实也已经有博友分享过了==>传送门 。

下面简单的介绍下张戈博客这边的DIY部署过程。

二、部署接口

首先按照我个人编码习惯,把小霖小朋友的代码略微改了下(代码强迫症):

 

  1. <?php
  2. // 获取句子文件的绝对路径
  3. // 如果你介意别人可能会拖走这个文本,可以把文件名自定义一下,或者通过Nginx禁止拉取也行。
  4. $path = dirname(__FILE__);
  5. $file = file($path."/hitokoto.txt");
  6. # 随机读取一行
  7. $arr  = mt_rand( 0, count$file ) - 1 );
  8. $content  = trim($file[$arr]);
  9. # 编码判断,用于输出相应的响应头部编码
  10. if (isset($_GET['charset']) && !emptyempty($_GET['charset'])) {
  11.     $charset = $_GET['charset'];
  12.     if (strcasecmp($charset,"gbk") == 0 ) {
  13.         $content = mb_convert_encoding($content,'gbk', 'utf-8');
  14.     }
  15. else {
  16.     $charset = 'utf-8';
  17. }
  18. header("Content-Type: text/html; charset=$charset");
  19. # 格式化判断,输出js或纯文本
  20. if ($_GET['format'] === 'js') {
  21.     echo "function hitokoto(){document.write('" . $content ."');}";
  22. else {
  23.     echo $content;
  24. }

以上代码保存为index.php,然后上传到网站根目录下的hitokoto文件夹(这个自己随机定义)最后,从小霖分享的文章下载hitokoto.txt文本文件

温馨提示

当然这里我也传了一份到微云网盘,方便大家下载:

 

把hitokoto.txt上传到和index.php同级目录,比如hitokoto文件夹内。

现在,浏览器访问 http://你的域名/hitokoto/ 就可以看到输出内容了。

三、博客集成

第一步我们已经完成了这个接口的自建部署,现在可以把这个功能搬到博客上了。

部署方法和其他博客基本一致,非常简单,将下面两行代码添加到博客你想显示一言的位置即可:

 

  1. <script type="text/javascript" src="https://你的域名/hitokoto/?format=js&charset=utf-8"></script>
  2. <div id="hitokoto"><script>hitokoto()</script></div>

不过,这样输出的样式可能会比较丑,如果你懂CSS的话可以自己再美化美化。

当然,Begin主题或者不会css的朋友可以先试下我这边写好的css代码(可以加到style.css):

 

  1. #hitokoto{
  2.     border-left5px solid #2f889a;
  3.     border-right5px solid #2f889a;
  4.     background-color#ebebeb;
  5.     padding10px;text-aligncenter;
  6.     color#095AD4;
  7.     margin5px 0 5px 0;
  8. }

部署完成之后,前台刷新应该就可以看到效果了,每次刷新都会随机展示一言经典句子。如果你有新的句子,也只要编辑hitokoto.txt文件加入即可。

好了,文章就介绍这么多,喜欢的朋友可以试下了。

如果文章对你有帮助,请赞赏支持闲木鱼发展!

本文地址:https://www.xianmuyu.com/516.html
温馨提示:文章内容系作者个人观点,不代表闲木鱼对观点赞同或支持。
版权声明:本文为转载文章,来源于 张戈博客 ,版权归原作者所有,欢迎分享本文,转载请保留出处!

发表评论


表情