[随笔]关于 JS 和 ajax 提交评论等等 ,

This is a sitelog of Easun.org.

因为 本地评论 JS 化,又重写了一遍 MTajax 提交过程。梳理了一下流程。

主要是删除了 MT 提交过程的 2次服务器认证,把第一次服务器认证(登录信息预提交验证) mtCommentSessionVerify 有限度地交给 JS + cookie

简单的说,就是设置全局变量 usernull,然后重新在 cookie 中读取 user 来判断登录信息是否正常? 然后其他的认证在 提交表格 时完成就好。 简单 JS 片段如下:

 var refresh_user = function(u) {
      if (u) mtSetUser(u); 
      if (!u) { user = null;  mtFireEvent('usersignin');  u = mtGetUser(); }           
      if ( u && u.is_authenticated ) { /* do nothing*/ } 
      else { $f.find(':input[name="sid"]').attr("value","") ;  ShowCommentsOpenData();  }               
  };

然后发现 JQ $.ajax 的小问题:

我的 $.ajax 如下:

$.ajax({
     type: 'POST',
     cache:false,
     url: url,
     context: el, 
     xhrFields: { withCredentials: true  },
     data: $f.serialize(),
     success: successfuc,
     beforeSend:beforefun,
     error: errorfun,
     complete:completefuc
});

本来是吧 refresh_user 写到 beforeSend 中的,但是执行的时候发现 refresh_user 中对 $f 的改变,并没有在 data: $f.serialize() 中 体现出来。 所以只好显式在 $.ajax 前调用此函数了。

笔记下来,为自己提醒。

另外,本来对 JS 全面进行 JQ 改写来着,但是实际对 form 元素操作中发现,同样对

<form name="comments_form" id="comments-form">
<input type="hidden" name="preview" value="" />
...
</form>

中 的 name="preview"value 操作。 原来的代码是

var f = document['comments_form'];
if (f.preview.value == '') f.preview.value = '1';

JQ 呢? 貌似。。。。。

var $f = $("#comments-form"); 
var $preview= $f.find(':input[name="preview"]');
if ($preview.attr("value") == '') $preview.attr("value","1");

f$f 是为了方便操作预先定义好的。 貌似还是不用 JQ 操作的快一点。或者就现在这样混合用吧。。。。

另外,给 ajax 提交完成后刷新新评论搞了一段简单的 JQ 特效: 代码如下:

 var animate_item = function(id) { 
     var $el =$("#comments-content .comment#comment-"+id);
     var _top = $el.offset().top - ( $(window).height() - $el.height() )/2;
     $("html,body").animate({scrollTop:_top},1000); 
     $el.addClass("notice")
         .animate({left:'30px',opacity:'0.2'},"slow")
         .animate({left:'0px',right:'30px',opacity:'0.8'},"slow")
         .animate({left:'0px',right:'0px',top:'30px',opacity:'0.2'},"slow")
         .animate({left:'0px',right:'0px',top:'0px',bottom:'30px',opacity:'0.8'},"slow")
         .animate({left:'0px',right:'0px',top:'0px',bottom:'0px',opacity:'1'},"slow");
        var total= parseInt( $("#comments").attr("data-total"));
        function c() {  $el.removeClass("notice").addClass( (total%2) ? "odd":"even" ); }
        $el.one('click',c).one('mouseover',c);
 };

没有抓 gif ,简单完成效果如下:

jq_submit_png.png

--EOF--

[MT Plugin]QQ互联插件-用QQ账号登陆您的MT ,

QQ互联插件-用QQ账号登陆您的MT

( QQ Connect Commenters Plugin for Movable Type )

Authors: 路杨 (EasunLee) Copyright 2015 Easun.org. License: Artistic, licensed under the same terms as Perl itself

qq_login.png

概述

MT QQ互联插件 (QQ Connect Commenters plugin for Movable Type) 允许用户用 QQ 号码登陆你的 Movable Type 博客。
本插件严格使用 QQ互联 的 Open API 编写。安全可靠。 它可以给您的博客带来良好的用户体验。 一旦使用这个插件,评论者可以自动获取QQ昵称、头像等资源。

请注意: QQ互联 (QQ Connect)官方使用的机制是审核制度,并不是使用这个插件就直接可以使用QQ登陆。 您需要去 QQ互联 (QQ Connect) 官方注册您使用本插件的网站并获取属于自己的 APPID 并提交审核。审核过程可能需要1周或者更长时间。

关于 QQ互联 (QQ Connect) 的注册,请 百度 之。或者读取官方资料: http://wiki.connect.qq.com/

运行环境

  • Movable Type 4.2 或者更高版本
  • JSON::XS 2.0 或者更高版本
  • jQuery (非必需,建议)

Movable Type 的 extlib 中已经包含了必需的 JSON:XS 版本。

安装

  1. 下载并解压本插件。

  2. 复制(上传) QQCommenters/mt-static 下的内容到 /path/to/mt/mt-static/

  3. 复制(上传) QQCommenters/plugins 下的内容到 /path/to/mt/plugins/

  4. 登陆您的 Movable Type 后台 -> Plugin Settings 去设置您的 QQ APP IDAPP KEY

  5. 在 后台->Registration Settings -> Authentication Methods 中选启用 QQ 。
  6. 在前台选择登陆,您会看见 QQ 登陆 的选项已经有了。 如果您的网站通过审核,可以之直接使用了。

关于 QQ互联 功能的申请

关于 QQ互联 功能的申请,简单减少一下流程:

  1. 用您的QQ账号登陆 http://connect.qq.com/intro/login 并申请网站接入。
  2. 详细描述您要接入的网站信息。请注意 回调地址 一定要填写为您的Movable Type 后台 CommentScript 的完整地址,并且带上 http:// 或者 https:// 的前缀。比如 (http://your_domain/cgi-bin/mt/mt-comments.cgi)。
    可以设置多个回调地址,用 分号 分开即可。 QQ互联 (QQ Connect) 的官方APP帮助文档 写的像浆糊一样,而且处处错误。这个地方官方文档写就是有问题。
  3. 腾讯 的QQ 登陆审核一个要求,就是登陆页面要设置 醒目的QQ登录入口。而我们的前端如果不做修改的话,会很简洁,这个就需要自己在前台放端代码。 简单的分享一下我的一些前端 JS 代码:

win10下MarkdownPad2预览无法显示的解决

一直以来都是使用 MarkdownPad 2 来写Blog。
在win7系统下,这个是写 Markdown 格式文档的利器,因为其的实时预览模式,实在是太强悍了。
但是最近升级到了win10,打开 MarkdownPad 2 后,实时预览功能居然失效了,提示如图。 md_pd.png

难道要逼我换软件吗? 在 http://markdownpad.com/faq.html#livepreview-directx 这里发现了一些信息:

LivePreview is not working - it displays an error message stating This view has crashed!

This issue has been specifically observed in Windows 8. You may see an error message as shown here, and no HTML will be rendered when you type in the Markdown Editor pane.

To fix this issue, please try installing the Awesomium 1.6.6 SDK.

If you continue to experience issues, please install Microsoft's DirectX End-User Runtimes (June 2010).

OK, 那就先试试 Awesomium 1.6.6 SDK.

下载,My God,居然 110 M。。。。

下载安装,再次打开,一切正常:)

md_pd_ok.png

--EOF--

[SiteLog]近日网站折腾小记 ,

8月快过去了。时间真的是。。。。
顺便记下这几天对网站的一些小小的折腾吧。

1. 多说评论显示逻辑调整:

还是要从多说说起: 路杨已经基本上实现了把所有的多说评论同步到了本地。 默认同步到多说评论处于未发布状态,防止和多说JS载入的评论形成重复评论。 定时把本地数据库的多说评论转成发布状态,以防止多说服务器抽风导致评论不显示。

但是问题来了: 怎么让同步并本地发布的同一条评论只显示一次呢? 原来的实现办法是在 多说JS 中识别这条评论是否已经本地发布,如果发布则 hook 多说JStemplates.post 函数,让它不生成这条评论
核心代码如下:

var DSinMTids = [];
function check_ds_in_mts() {
   DSinMTids = [];
   $("#comments-content div.ds-post-self").each(function()
   { 
     if ( ( $(this).attr("data-source") == 'duoshuo' ))
      { 
       DSinMTids.push($(this).attr("data-post-id"));
      }
  });
}

check_ds_in_mts(); 
var _D_post=DUOSHUO.templates.post; 
DUOSHUO.templates.post=function (e,t){
  var rs=_D_post(e,t);            
  if ( $.inArray(e.post.post_id, DSinMTids) != -1 return '';
  /* sth others*/
  return rs;
}

[随笔]Movable Type 的数据库瓶颈与多说评论反向同步 ,

随笔 而已,能力所限,只是个人看法。

就向大家看见的这样,由于多说服务器的原因,路杨正在逐步把 多说的评论写回本地 Movable Type 的数据库。

过程不算难。通过 API 获得 JSON 数据,分析后写入MT评论数据库罢了。 为了区分和拓展,给 MT 数据库的评论表增加了3行,分别记录 远程服务器名(remote_service),远程服务器ID (remote_id) 和 UA ( agent)。

mt_db_table_comment.png

开始直接 Perl 脚本。核心代码为

第1页/共51页,加载更多