Skip to content

Commit

Permalink
Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule” (SSW…
Browse files Browse the repository at this point in the history
…Consulting#8589)

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”

* Update Rule “do-you-use-gravatar-for-your-profile-pictures/rule”
  • Loading branch information
babakamyljanovssw authored May 24, 2024
1 parent cd9836a commit 0e18772
Showing 1 changed file with 95 additions and 12 deletions.
107 changes: 95 additions & 12 deletions rules/do-you-use-gravatar-for-your-profile-pictures/rule.md
Original file line number Diff line number Diff line change
@@ -1,29 +1,31 @@
---
type: rule
archivedreason:
title: Do you use Gravatar for your profile pictures?
guid: b790dbfc-fe37-4a4a-992e-c9294620a06b
title: Do you use Gravatar (or Cravatar for China) for your profile pictures?
uri: do-you-use-gravatar-for-your-profile-pictures
created: 2015-03-16T10:17:40.0000000Z
authors:
- title: Adam Cogan
url: https://ssw.com.au/people/adam-cogan
authors:
- title: Adam Cogan
url: https://ssw.com.au/people/adam-cogan
related: []
redirects: []

created: 2015-03-16T10:17:40.000Z
archivedreason: null
guid: b790dbfc-fe37-4a4a-992e-c9294620a06b
---

To keep profile management simple and make it easier for users to have a consistent experience across applications, you should use [Gravatar](https://en.gravatar.com/) for showing profile images in your application.

Your Gravatar is an image that follows you from site to site appearing beside your name when you do things like comment or post on a blog.
::: china
Gravatar is blocked by Great Firewall of China (GFW), and clients from China can't access their profile photos successfully without a VPN. There is an alternative option for Chinese users which is [Cravatar](https://cravatar.cn/).
:::

Your Gravatar or Cravatar is an image that follows you from site to site appearing beside your name when you do things like comment or post on a blog.

<!--endintro-->

### Setting up Gravatar in your application

It is simple to set up and if you are developing an MVC application, there are even several Nuget packages to make your life easier. The [GravatarHelper](https://www.nuget.org/packages/GravatarHelper) is recommended.

``` aspnet
```aspnet
@Html.GravatarImage("[email protected]", 80, new { Title = "My Gravatar", Alt = "Gravatar" })
```

Expand All @@ -32,5 +34,86 @@ Also, check out the [Gravatar API documentation](https://en.gravatar.com/site/im
The below short video shows how to get up and running with Gravatar in your ASP.NET MVC application.

`youtube: https://www.youtube.com/embed/rjFjVD9jPIk`


### Setting up Cravatar in your application

Unlike Gravatar, Cravatar doesn't provide any library to generate profile image. To solve this issue we can create custom helper class which creates profile URL for us.

```
public static class CravatarHelper
{
private const int MIN_IMAGE_SIZE = 1;
private const int MAX_IMAGE_SIZE = 2048;
private const string WEBSITE = "https://cravatar.cn/avatar/";
private static int ValidateImageSize(int imageSize)
{
imageSize = Math.Max(imageSize, MIN_IMAGE_SIZE);
imageSize = Math.Min(imageSize, MAX_IMAGE_SIZE);
return imageSize;
}
public static string GetCravatarImageUrl(string email, int imageSize, string defaultImageUrl)
{
if (string.IsNullOrEmpty(email))
{
return string.Empty;
}
UriBuilder uriBuilder = new UriBuilder(WEBSITE);
email = email.Trim().ToLower();
uriBuilder.Path += $"{email.ToMD5Hash()}";
string queryString = "";
if (imageSize != 0)
{
imageSize = ValidateImageSize(imageSize);
queryString += $"s={imageSize}";
}
if (!string.IsNullOrWhiteSpace(defaultImageUrl))
{
queryString += $"&d={defaultImageUrl}";
}
if (!string.IsNullOrEmpty(queryString))
{
uriBuilder.Query += queryString;
}
return uriBuilder.Uri.ToString();
}
}
public static class StringExtensionMethods
{
public static string ToMD5Hash(this string str)
{
byte[] hashBytes = MD5.HashData(Encoding.UTF8.GetBytes(str));
StringBuilder strBuilder = new();
if (hashBytes != null)
{
for (int i = 0; i < hashBytes.Length; i++)
{
strBuilder.Append(hashBytes[i].ToString("x2"));
}
}
return strBuilder.ToString();
}
}
```

Now we can call custom helper function to create a profile URL and use it in the application.

```
@{
ViewData["Title"] = "Home Page";
string profileURL = CravatarHelper.GetCravatarImageUrl("[email protected]", 80, "mm");
}
<img src=@profileURL alt="avatar"/>
```

For more information, check out the [Cravatar API documentation](https://cravatar.com/developer/api).

0 comments on commit 0e18772

Please sign in to comment.