تحميل Gravatar باستخدام jquery

Question

مجرد محاولة إنشاء نموذج تعليق بسيط على مدونة.أريد تحميل Gravatar الخاص بالمستخدم (باستخدام jQuery) عندما يكتب هذا في صندوق البريد الإلكتروني.

كيف أقوم بذلك؟

Answer 1

يبدو عنوان URL الخاص بـ Gravatar كما يلي:

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

فيما يلي بقية الخيارات لعنوان URL.

لذا، كل ما عليك فعله هو تضمين وظيفة تسمى md5 والتي تقوم بإرجاع تجزئة md5 للبريد الإلكتروني الخاص بالمستخدم.هناك الكثير على الإنترنت يقومون بذلك، لكني أعتقد ذلك https://github.com/blueimp/JavaScript-MD5/blob/master/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-stackoverflow في القائمة، فمن الأفضل أن تقوم بتشفير البريد الإلكتروني على الخادم بحيث لا تكون رسائل البريد الإلكتروني الخاصة بالمستخدم مرئية بشكل عام إذا نظرت إلى المصدر.

Answer 2

الدفع كمان بلدي توفير الوظيفة

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

يعد توفير البريد الإلكتروني فقط أمرًا إلزاميًا - بينما يستخدم الباقي القيم الافتراضية.

تأكد أيضًا من تضمين المعيار الواقعي ملف JS لمولد MD5 من جوزيف مايرز مع

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

Answer 3

ونجاح باهر بفضل لهذا المنصب. ولكن إذا كان في حال كان لديك صورة فارغة الخاصة بك وتريد استخدامها بدلا من غرفتر.

<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

والجزء صعبة يولد في URL باستخدام تطبيق تجزئة MD5، وهي منفصلة عن مسج. لقد وجدت أن blueimp-MD5 مكتبة لديه معظم النجوم من مختلف حزم MD5 على جيثب، و انها الى حد كبير (حوالي 6KB مصغر) ومكتفية ذاتيا. إذا كنت تستخدم عقدة و / أو 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;
}

وبعد ذلك يمكنك تعيين سمة صورة src باستخدام مسج مثل هذا:

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