ソースコードと解説

<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="FriendFeed OAuth" description="This Gadgets is example using OAuth Proxy that post to FriendFeed at gooHome.">
<Require feature="minimessage"/>
<Require feature="oauthpopup"/>

oauthpopup のポップアップウィンドウを使って OAuth の認可を要求します。

<OAuth>
<Service name="friendfeed">
<Request url="https://friendfeed.com/account/oauth/request_token" param_location="uri-query"/>
<Authorization url="https://friendfeed.com/account/oauth/authorize"/>
<Access url="https://friendfeed.com/account/oauth/access_token" param_location="uri-query"/>
</Service>
</OAuth>

サービス名とそのリクエストトークン、アクセストークン、認証のエンドポイントを指定します。

</ModulePrefs>
<Content type="html" view="canvas"><![CDATA[
<style>
</style>
<script type="text/javascript" src="http:// ... /opensocial-jquery.min.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script>
jQuery(function($) {

現在地の緯度経度を取得するため Google AJAX API loader もロードしています。

  function post(url, data) {
    $.post(url+ ' friendfeed', data).next(function() {
      document.form.body.value = '';
    }).error(function(e) {
      if (e == 'oauth')

jQuery.oauth を使って OAuth 認証のポップアップウィンドウを表示します。ウィンドウが閉じるとコールバックしますので、そのタイミングで OAuth リクエストをリトライしています。

        $('<a href="#signin"/>')
          .text('Sign in with FriendFeed')
          .click(function() {
            $(this).parents('table').remove(); // remove minimessage
            $.oauth('friendfeed', function() {
              $(document.form).submit();
            });
            return false;
          })
          .minimessage();      
      else
        $('<span/>')
          .text('Oops, there was a problem: '+e)
          .minimessage();  
    });
  };

jQuery.post の URL に続けてサービス名を指定すると OAuth リクエストになります。OAuth 認証を要求するときはエラーとなり、そのステータスが "oauth" を表します。

  $(document.form).submit(function() {
    var data = { body: this.body.value };
    if (google.loader.ClientLocation)
      data.geo = [
        google.loader.ClientLocation.latitude, 
        google.loader.ClientLocation.longitude
      ].join(',');
    post('http://friendfeed-api.com/v2/entry', data);
    return false;
  });

});
</script>
<form name="form">
<textarea name="body">What are you doing?</textarea><br />
<input type="submit" value="Post">
</form>
]]></Content>
</Module>

フォームのテキストと現在の緯度経度を FriendFeed に投稿します。

ソースコードと解説

関連リンク