Gravatar

다른 웹 사이트를 브라우징하면서, 많은 사용자들이 이름 옆에 그림을 사용하고 있는 것을 목격하였을 것이다. 이그림을 "아바타(avatars)"라고 한다. 워드프레스에서는 “그라바타“라고 하는 특정 형태의 아바타를 사용한다– “Globally Recognized Avatar”의 줄임말이다. 표준 아바타와 달리, 그라바타는 웹에 따라다니면서, 워드프레스 사이트에 댓글을 달면 자동으로 표시된다.

Example

JavaScript

const md5 = require( 'md5' );

function getGravatarURL( email, size = 80 ) {
  // Trim leading and trailing whitespace from
  // an email address and force all characters
  // to lower case
  const address = String( email ).trim().toLowerCase();

  // Create an MD5 hash of the final string
  const hash = md5( address );

  // Grab the actual image URL
  return `https://www.gravatar.com/avatar/${ hash }?s=${ size }`;
}

bash

#!/bin/bash

# This script downloads a gravatar image associated with EMAIL and saves it at 
# AVATAR_OUTPUT_PATH then creates a favicon icon and saves it at
# FAVICON_OUTPUT_PATH.

EMAIL="[email protected]"
AVATAR_OUTPUT_PATH="static/img/avatar.png"
FAVICON_OUTPUT_PATH="static/favicon.ico"

# https://en.gravatar.com/site/implement/hash/
function email_to_hash {
    echo -n $1 | tr '[A-Z]' '[a-z]' | md5
}

# Stop on error.
set -e

email_hash=$(email_to_hash $EMAIL)

# https://en.gravatar.com/site/implement/images/
wget http://www.gravatar.com/avatar/$email_hash?size=512 -O $AVATAR_OUTPUT_PATH

# http://www.imagemagick.org/Usage/thumbnails/#favicon
convert $AVATAR_OUTPUT_PATH -bordercolor white -border 0 \
    \( -clone 0 -resize 16x16 \) \
    \( -clone 0 -resize 32x32 \) \
    \( -clone 0 -resize 48x48 \) \
    \( -clone 0 -resize 64x64 \) \
    -delete 0 -alpha off -colors 256 $FAVICON_OUTPUT_PATH

Favorite site

Gravatar website