Gravatarというサービスでプロフィールを作り、APIで取得できるようなので試してみました。

Gravatar

Gravatarのことはmicro.blogで知りました。詳しいことはwikipediaに書いてます。ようするにWordPress.comのアカウントで作成したプロフィールをWebAPIで取得するサービス。

準備

まずは以下を完了させておきます。

  1. WordPress.comでアカウントを作る
  2. WordPress.comでプロフィールを作成する
  3. GravatarにWordPress.comアカウントでログインする
  4. Gravatars を管理画面で1. 修正するメールを選択の中からレーティングを表示をクリックする
  5. メールアドレスのハッシュにあるハッシュ値を取得する

こんな感じ

以下のようなURLでAPIを実行します。ブラウザのURL欄で叩くのが早いかと。

https://www.gravatar.com/ここにハッシュ値をセットする.json

すると以下のようなJSONを取得できました。

{
  "entry": [
    {
      "id": "000000000",
      "hash": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      "requestHash": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      "profileUrl": "http://gravatar.com/ytyaru",
      "preferredUsername": "ytyaru",
      "thumbnailUrl": "https://secure.gravatar.com/avatar/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      "photos": [
        {
          "value": "https://secure.gravatar.com/avatar/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
          "type": "thumbnail"
        }
      ],
      "name": [],
      "displayName": "ytyaru",
      "aboutMe": "趣味プログラマ。ラズパイ好き。モナコインやってます。",
      "urls": [
        {
          "value": "https://ytyaru.github.io/",
          "title": "私の専用サイトです。"
        },
        {
          "value": "https://twitter.com/ytyaru1",
          "title": "ブログ投稿など成果を報告する。"
        },
        {
          "value": "https://github.com/ytyaru",
          "title": "コードを書く。"
        },
        {
          "value": "https://ytyaru.hatenablog.com/",
          "title": "はてなブログ。作業ログ。"
        },
        {
          "value": "https://mstdn.jp/@ytyaru",
          "title": "つぶやく。"
        },
        {
          "value": "https://pawoo.net/@ytyaru_pawoo",
          "title": "落書きをつぶやく。"
        },
        {
          "value": "https://www.pixiv.net/users/53831310",
          "title": "絵とか描いたときに使うかも。"
        },
        {
          "value": "https://monaledge.com/user/MEHCqJbgiNERCH3bRAtNSSD9uxPViEX1nu",
          "title": "モナコイン連携ブログサイト。"
        },
        {
          "value": "https://web3.askmona.org/user/1590",
          "title": "モナコイン連携質問サイト。"
        }
      ]
    }
  ]
}
  • idhashはメアドを逆算されかねないらしいので一応隠しておきました
  • 生JSON値は日本語がUnicodeエスケープされていました。以下で表示できます
const json = {"entry": ...} // 上記JSON 
console.log(json)
console.log(JSON.stringify(json))

取得できるプロフィール情報

取得できる内容は、WordPress.comでセットした内容です。私は苗字と名前を入力していないため空ですが、それも取得できるでしょう。

  • 氏名
  • ユーザ名
  • アバター画像URL
  • 自己紹介文
  • URLセット
    • URL
    • 説明文

展望

あとはJSONをいじり倒してHTMLを生成すればOK。JavaScriptのDOM APIでできます。かっこいいプロフィールを作ってニヤニヤできるかもしれません。

惜しむらくはURLのアイコン画像を取得・指定できないことでしょうか。

危なそうなのは、ハッシュ値からメールアドレスを逆算される可能性があるらしいことです。

このJSONファイルをGitHubにアップすれば同じことができそう。