加载的gravatar使用jQuery

Question

只是想箱子博客上的简单评论表单。我想读取用户的的gravatar（使用jQuery）时，他/她的邮箱写这个。

我怎么能这样做？

Answer 1

在的gravatar URL看起来像这样：

http://www.gravatar.com/avatar/<md5hashofemail>

下面是该URL的其余选项。

因此，所有你将不得不做的是包括函数调用MD5返回用户的电子邮件的MD5哈希值。网上有很多是这样做的，但我相信 https：//开头github上。 COM / blueimp / JavaScript的MD5 / BLOB /主/ README.md 的效果很好。在此之后，只是做：

// get the email
var email = $('#email').val();
// -- maybe validate the email? 

// create a new image with the src pointing to the user's gravatar
var gravatar = $('<img>').attr({src: 'http://www.gravatar.com/avatar/' + md5(email)});
// append this new image to some div, or whatever
$('#my_whatever').append(gravatar);

// OR, simply modify the source of an image already on the page
$('#image').attr('src', 'http://www.gravatar.com/avatar/' + md5(email));

我认为这是明显的，但我会添加它为后人的缘故：

如果用户的电子邮件是私人的，而且您是在上市这个ALA-计算器，你可能关闭服务器，使用户的电子邮件不是，如果你看一下源公开可见编码的电子邮件更好。

Answer 2

签出我的小提琴提供功能

get_gravatar_image_url (email, size, default_image, allowed_rating, force_default)

仅提供所述电子邮件是强制性的。 - 其余部分使用默认值。

同时务必包括事实上的标准 MD5发电机JS文件从约瑟夫迈尔斯与

<script src="http://www.myersdaily.org/joseph/javascript/md5.js"></script>

Answer 3

哇感谢此信息。但是，如果万一你有自己的空白图像，你想用它代替的的gravatar的。

<script src="md5.js"></script>

<img id="image" src="images/mydefault.png" />

<script>

    var src = 'http://www.gravatar.com/avatar/' + 
                  md5('yourmail@gmail.com') + '?default=' + encodeURIComponent(GetRootDomain() + '/Content/images/nopic-small.png');

    $('#image').attr('src', src);

</script>

Answer 4

棘手的部分是产生使用MD5哈希实现，这是从jQuery的单独的URL。我发现， blueimp-MD5 图书馆在GitHub上的各种MD5包的大多数恒星，和这几乎是自包含的（约6KB minified的）。如果您使用的节点和/或Browserify，这种解决方案可能会为你工作得很好：

var md5 = require("blueimp-md5");
function gravatar(email){
  var base = "http://www.gravatar.com/avatar/";
  var hash = md5(email.trim().toLowerCase());
  return base + hash;
}

然后，可以使用jQuery这样设置图像src属性：

var email = "someone@example.com";
$("#image").attr("src", gravatar(email));