sinatraを使ってtumblr API を叩いて画像を投稿してみる
こんにちは、エンジニアの kouno です。 大本営から春イベントは総力戦になるとの発表があったので、戦々恐々しながら戦力の増強と備蓄を本格的に始めたところです。
今回は、sinatraを使ったwebアプリからtumblrのAPIを使って画像を投稿してみようと思います。
前提
- tumblrのアカウントを持っている事
環境
インストール
$ gem install sinatra $ gem install tumblr_client $ gem install thin
tumblrの準備
- tumblrにログイン
- https://www.tumblr.com/oauth/apps にてアプリを追加し、consumer_keyとconsumer_secretを取得
- https://api.tumblr.com/console/calls/user/info に上記で取得した、consumer_keyとconsumer_secretを使って、oauth_tokenとoauth_token_secretを取得
実装
[config.ru] require 'sinatra' require 'tumblr_client' require 'mime/types' load 'myapp.rb' configure do set (:client) { Tumblr::Client.new({ :consumer_key => '#{your_consumer_key}', :consumer_secret => '#{your_consumer_secret}', :oauth_token => '#{your_oauth_token}', :oauth_token_secret => '#{your_oauth_token_secret}' }) } end run Sinatra::Application
[myapp.rb] get '/' do erb :index, :layout => :application end post '/tumblr_post' do if settings.client? client = settings.client post_option = {} %w(data caption tags link state).each do |column| post_option[column.to_sym] = params[column] end if File.directory?(params[:data]) path = params[:data] Dir.open(path).each do |file| next if MIME::Types.type_for(file) == [] or File.directory?(file) post_option[:data] = "#{path}#{file}" post_option.delete("data") post_option.delete(:type) client.photo("#{client.info["user"]["name"]}.tumblr.com",post_option) end else client.photo("#{client.info["user"]["name"]}.tumblr.com",post_option) end # puts response erb :tumblr_post, :layout => :application end end
[views/index.erb] <form action='./tumblr_post' method='post'> 画像パス<input type="text" name="data" size=" 100" />※ローカルファイルのフルパスを設定<br /> タイトル<input type="text" name="caption" size="100" /><br /> url<input type="text" name="link" size="100" /><br /> tags<input type="text" name="tags" size="100" /><br /> ステータス<select name="state"> <option value="draft">draft</option> <option value="queued">queued</option> <option value="published">published</option> </select> <input type="submit" name="submit" value="送信" /> </form>
[views/application.erb] <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> </head> <body> <%= yield %> </body> </html>
[views/application.erb] <p>送信完了しました。</p>
使い方
$ thin start
して起動してください。- localhost:3000 にブラウザでアクセス
画像パス
にtumblrに投稿したい画像か画像のあるディレクトリをフルパスで指定タイトル
に画像のキャプションをurl
にリンクを、tags
にカンマ区切りで投稿に付けるタグを、それぞれ設定ステータス
にdraft(下書き)
,queued(自動投稿)
,published(即時投稿)
のいずれかを設定送信
をクリック- 画像が投稿されます
注意事項的な何か
- thinの設定次第では送信後に画面がタイムアウトします。thinの設定をさがしてみてください。
参考URL
名前 | url |
---|---|
tumblr API開発者向けドキュメント | https://www.tumblr.com/docs/en/api/v2 |
tumblr本家git | https://github.com/tumblr/tumblr_client |
sinatra日本語ドキュメント | http://www.sinatrarb.com/intro-ja.html |