PlayFramework(Java)でFacebook認証

こんにちは!!
前回に引き続きPlayFrameworkに関して。
今回はPlayFrameworkのライブラリを使って、FacebookをOAuth認証させたいと思います。

開発環境

  • PlayFramework2.4
  • Java8
  • 認証ライブラリ:pac4j v1.9
  • FacebookAPI v2.8
今回利用するpac4jというライブラリは認証を簡単にできるライブラリで
ここに書いてある通りに書けば、
問題なく動作はします!!

が、今回は1点問題があり、動作がしなくなったので、
その解決策を書いていきます。

問題点

FacebookAPIのバージョンが新しすぎて、ユーザーのプロフィール情報を取得する為のプロパティが変わってしまった。
facebook for developersにこのように書かれています。 現在、pac4jではbioを取得してきているので、そこをaboutに変更しないとダメということだそうです。
このbioの取得が任意ならよかったのですが、認証時に必ず取得して来てしまうプロパティなのです。

認証ライブラリを書き換える

今回書き換えるクラスは2つ!!
  • FacebookAttributesDefinition.java
  • FacebookClient.java
です。
2つのクラスの変更する箇所はこちら!!

FacebookAttributesDefinition.java

41行目くらいにBIOプロパティを宣言しているので、そこをaboutに書き換えてしまいましょう!!

FacebookClient.java

55行目くらいにフィールドを宣言している中にbioという文字があるので、そこをaboutに変更!! これらに加えて、FacebookProfile.javaというクラスをライブラリから独立させて
自分のプロジェクトに加えると
今までbioを取得していたものがaboutを取得するようになります!!

今回の反省

FacebookAPIを利用するときは開発をする時にバージョンと仕様を確認して、利用するライブラリを決めないといけないです。
外部APIに依存しすぎるのはよくないですが、Facebook認証は強力なので、
変更に臨機応変に対応するしか無いですね。。。

PlayFramework(Java)で開発環境と本番環境の違いで苦労した

こんにちは。
前回、dafさんがplayframworkでメールを送信してみた!
というタイトルで
PlayFrameworkの記事を書いていたので、
その流れに乗ってPlayFrameworkについて書きたいと思います。
タイトル通り開発環境と本番環境の違いから苦労した点を書きます。

今回の苦労した点は

conf/内のファイルが読め込めない!!

というもの。

やりたいこととしては、
conf/内に何かしらのファイルを置いておいて、
application.confに記述したパスを参照して、Javaで読み込むというもの。
(PlayでJava?という気持ちは内にしまっておいてください。。。)

開発環境で動作させるrunやstartですと問題ないのですが、
本番環境で運用する為のstageやdistをして実行すると読め込めないという状況が起きました。

まずは、

開発環境で動作したコード

このコードで実行すると、
ファイルが見つかりません。

ConfigFactory.load()を利用すると、
デフォルトでapplication.confを読みにいくのですが、
runやstartと違って
stageやdistしたパッケージ内には
conf/が存在していないのでパスが違ってエラーになります!!

ではどうしたものか・・・
色々調べてみると、
便利なものが存在しました!!
play.Application.getFile(String relativePath)

このメソッドはアプリケーションのルートパスからの相対ファイルを取得するというもの。
アプリケーションのルートパスの参照ならconf/も存在するので、
ファイルも取得出来る!!

それでは、

本番環境でも動作したコード

これでファイルを取得出来ました!!
因に、application.confに記述するパスは
conf/path
となります。

これ以外にも開発環境と本番環境では異なってくる箇所があるので、
徐々に書いていきたいと思います。

AngularJS 1.xで簡単なSPAを 〜導入編〜

先月にAngularJS2.0の正式リリースがあり、 やってみようかなと思いましたが、 まだ情報も少ないということでまずは1.x系から触ってみて 2.0との比較をしていこうかなと思います。

開発環境

・MacOSX 10.9 ・AngularJS 1.5.8 ・Atom 1.10.2 さっそく導入してみます!! だいたい、開発環境構築の時に 詰まって何時間も時間を取られてしまうのですが、 AngularJSは簡単に導入ができました。 まずはCDN経由で導入しておきます。
  1. 要素配下(一般的)に と記述する。
  2. ディレクティブを設定する
たったこれだけ。 あとは 要素内でAngular式を用いてviewを構成していくだけ。 今回はAtomを利用して書こうと思うので、 Atomの方もパッケージを導入して開発しやすくします。 angularjsを利用すると自動補完してくれます。

やってみての所感

簡単に導入出来て、MVCモデルであることでモジュール単位の開発ができるので、 乱雑になることはないのではないかなと思う。 まださわりなのでライブラリやタスクランナーを使いながら慣れていこうと思う。

Vim8.0をインストールしてみた

Vim8.0 インストール

今回は1週間前にメジャーアップデートされたVimについて 今までVimは使わずに何でもIDEを使っていましたが、 そろそろVimで効率よく進めていきたいなということで最新版にアップデートしちゃいたいと思います!! (どんなバグがでるか恐ろしい・・・)

7.4 アンインストール

まずは今まで入っていた7.4をMacのHomebrewでさくっとアンインストールしちゃいます!! ※Homebrewが入っていない方はこちらからインストールしてください

8.0 インストール

続いて8.0をインストールします!! でインストールしてもいいんですが、 とすることで、luaオプションがついてneocompleteが利用できるようになります。 入力補完機能が付くので効率を考えるなら入れた方がいいですね。 待つこと5分・・・ インストール完了しました。 ちゃんと入っているか確認してみましょう。 確かに8.0がインストールできました!!

vimrc 設定

実際に利用するバージョンはどうなっているのか。 とやってみると、 エラーが・・・ 色々調べるとvimrcの設定がおかしいようです。 neocomplcacheを入れたことでvimrcの設定をしないとダメみたいですね。 今回は細かく設定するのはやめて、 neocomplcacheのSetting examplesをそのまま利用しようと思います。 これで無事にエラーを解消できました!! 1時間くらいかかったな・・・

PATH 設定

と改めてやってみると、バージョンは7.4のままです。 まだ今回インストールしたvimにpathを通していないので、 pathを通し直す必要があります。 pathが確認出来ました。 では、ここにpathを通しましょう!! そして、バージョンを改めて確認すると、 8.0になってました!! 今回はこの辺にして、 次回は、Vim8.0の新機能に触れていきたいと思います!!

参考

http://qiita.com/one-a/items/5039dd266b90e18a4242 http://d.hatena.ne.jp/pospome/20150603/1433303040 http://rcmdnk.github.io/blog/2016/09/12/computer-vim/ https://github.com/Shougo/neocomplcache.vim
スクリーンショット 2016-01-21 2.44.47

インバウンドマーケティングに挑戦!! ーユーザーの行動を知るー

インバウンドマーケティングとは

昨今のWeb業界では広告を出したり、ダイレクトメールを送ったりするアウトバウンドマーケティングではなくブログを書いたり、ソーシャルメディアを利用したり、SEO対策したりしてユーザー自らWebコンテンツを見つけてもらえるような施策をうつインバウンドマーケティングが主流になってます。 そこで、自分たちもインバウンドマーケティングをおこないユーザーの獲得をできるようにしていきたいと思います!!

ユーザーの思考を分析してみる

今回は、インバウンドマーケティングの記事の一回目ということで、 「ユーザーの思考」について分析していきます!! その後、ユーザーはその思考を元にどういった行動を取り、どんなサイトに訪れるのかということを分析・考察していきたいと思います。

転職希望者について考える

ターゲットとするユーザーは『転職を希望しているユーザー』という比較的大きな括りで定義していきます。 転職を希望している転職希望者はどういった思考で
  1. 転職準備
  2. 応募・面接
  3. 退職・入社準備
という流れの中で転職をおこなうのか。 その際に、どいうったサイトやアプリを利用するのかを考えていきます。 では、一番最初の段階である転職準備でのユーザーの思考について分析していきます。 転職は一般的に4ヶ月〜6ヶ月程の時間でおこなうと言われております。 その中で転職準備に使う期間は3分の1〜4分の1くらいです。 もちろん、転職する人の状況によって大きく変わってきますが、 それくらいの期間を使うのが理想となります。 その転職準備の期間には何を行うのか。。。 大きく分けると以下の4つになります。
  • 転職の計画を立てる
  • 自分のキャリアの棚卸し
  • 求人情報の収集
  • 履歴書・職務経歴書の準備
と、ここまで転職する人の行動について書いていきましたが、 本題は転職する人がどういった考えをもって行動するのかということです。 なので、必要なのは「転職する理由」であると思います!!

転職理由ランキングトップ10

ですので、数十の情報を元に転職理由ランキングをまとめてみました。
順位転職理由割合
1他にやりたい仕事がある21.2%
2給与が不満14.3%
3会社や業界の将来性に不満13.8%
3残業が多い・勤務時間に不満13.8%
5専門的な知識を身につけたい10.4%
6上司と合わない6.1%
7人間関係が合わない5.9%
8幅広い経験を積みたい5.7%
9社風が合わない5.0%
10キャリアアップ3.7%
1位が「他にやりたい仕事がある」と、前向な回答となり、 2〜4位は今の会社に対しての不満からの回答になりました。 これらの回答からそれぞれの理由の場合はどういった行動を取るのかという部分を深堀りしていき、 ユーザーに合った対策を施していくことに成ります。 まだまだ、インバウンドマーケティングの「イ」の字もわからないですが、 分析と勉強を繰り返していきます。 それでは、後日に続きを書いていきます!!
8386

Webサービスの管理画面について考えてみる

今回は「サイトの管理画面について考えてみる」ということで、 先日管理画面についてのセミナーに参加してきたので、 そこで聞いた内容を自分の考えをふまえてまとめていきます。

管理画面を作る目的を考える

どんなサービスでもそうだと思いますが、 サービスや機能において何かしらの課題があります。 その課題を解決するための手段の一つとして管理画面があります。
  • サービス運営者がデータの管理をしやすくする
  • サービス利用者が多種多様な情報から自分が知りたい情報だけを見れるようにする
といった何かしらの目的があって管理画面が作られ、改良されます。

管理画面の利用者によってデザインや仕様を変える

管理画面は利用する人の業種や職種によっても変わってきますが、 自社の社員だけの利用か、自社の社員以外が利用するのかによってもデザインや機能は異なってきます。 例えば、セミナーの発表にあった、飲食店の予約管理システムでは、 ITリテラシーがそこまで高くない方でもお客さんの予約状況を管理しやすいようにします。 そのためには、簡単でわかりやすいことを重視します。 現場の人の声に耳を傾け 並びかたや検索の仕方を変更していく必要があります。 また、社内のみで管理画面を利用する場合には、
  • 運用工数を減らすこと
  • 開発の工数がかからないで作ること
といったようにデザインよりも機能の部分で比重を置くケースが多いです。

管理画面の共通する考え方

共通する考え方では下記のようなことが挙げられます。
  • データの間違いがおこらないようにすること
  • 万が一、データの間違いが起こったら迅速に対応出来る体制を作ること
  • 管理画面を利用出来る人の権限を管理すること
  • 将来を考えた設計にすること
色々と書きましたが、まだ実装には至っていないので、 どういった考え方で設計していけばいいのかという部分をまとめていきました。 実装段階に入ったら、細かく仕様やデザインにも触れていければと思います。 今回参加したセミナーはこちらになります。
8143

AndroidでRealmを使ってみた〜お気に入り機能の実装(其の五)〜

今回はRealmから抽出したデータを並び替えする処理をしてみたいと思います。 前々回で抽出したデータを並び替えたいと思います。 完成した後の画面がこちらです。 こちらはGoogleMapsを利用して、電源の使えるカフェを地図上に表示させるアプリで、 並び替えは「現在地から近い順」にしています。 なお、Realmに並び替えの処理が存在するのですが、 今回紹介させていただく方法は別の方法ですのでご了承ください。。。 並び替えに必要なデータは
  • 現在地の緯度・経度
  • 各データの緯度・経度
になります。 ※現在地の緯度・経度の取得は本内容とは直接関係ないので、割愛致します。

「現在地から近い順」に並び替える手順

  1. 現在地から緯度・経度を取得
  2. Realmに登録されているデータから緯度・経度を取得
  3. 上記の1と2のデータから距離を算出
  4. 距離を含む各データをArrayListに格納
  5. ArrayListのデータを距離が近い方から並び替える
  6. 並び替えたArrayListをListViewで表示
といった流れで処理させていきます。

1.現在地から緯度・経度を取得

現在地の緯度・経度は取得できているものとします。

2.Realmに登録されているデータから緯度・経度を取得
3.距離を算出
4.距離を含む各データをArrayListに格納

それぞれの電源の使えるカフェのデータには緯度・経度があり、それらはRealmに登録されているので取得していきます。 距離の求め方は中学生?の時にやった三角関数を用いれば算出できますね!! a:緯度 b:経度 c:距離 となります。

5.ArrayListのデータを距離が近い方から並び替える

Collectionsクラスのsortメソッドを利用して並び替えをおこないます。

6.並び替えたArrayListをListViewで表示

最後にListViewに設定すれば、「現在地から近い順」で表示されます!! もっといい方法があったら教えていただけるとうれしいです。。。汗 今回の記事で「AndroidでRealmを使ってみた」を終わりたいと思います!! 今回のRealmを利用したアプリがこちらになるので、よければダウンロードしてみてください!!
identity_logo

AndroidでRealmを使ってみた〜お気に入り機能の実装(其の四)〜

前回の続きです。 前回はRealmに登録されているデータを全て抽出しました。 今回は、条件を絞り込んで表示してみたいと思います。 といっても、とても簡単で、 データを全て抽出していた下記のコードを少し書き換えるだけです。

登録データ

仮に下記の表にあるようなデータが入っているとした時に条件を絞り込んで表示してみます。
id(int)name(String)
10佐藤
20高橋
30坂本
40藤原

条件1)idが15以上のデータを表示

条件2)nameが高橋か藤原のデータを表示

とても簡単に条件を絞り込めましたね。 他にも色々な条件を指定できるので、こちらで確認してみてください!! では、次回はデータを並び替えをおこないます。
identity_logo

AndroidでRealmを使ってみた〜お気に入り機能の実装(其の三)〜

前回の投稿から少し間があいてしまいましたが、 本日は、AndroidでRealmを使ってお気に入りに登録したデータをListViewで表示してみたいと思います。 (ListViewの使い方はListView の基本的な使い方 – Android 開発入門を参考にしてください) お気に入りはソートの機能も実装してみたいのですが、 ソート機能はまたの機会にして、 今回は全件表示するだけにとどめようと思います。

お気に入り表示までの流れ

  1. Realmを利用する準備をする
  2. Realmからデータを全件抽出をする
  3. ListViewの1つ1つの項目にデータを設定していく
  4. データが設定された1つ1つの項目をListViewとして表示をする
となります。

1.Realmを利用する準備をする

※FavoriteModelはAndroidでRealmを使ってみた〜お気に入り機能の実装(其の一)〜を参考に別途クラスを準備してください!! これで準備は完了です。

2.Realmからデータを全件抽出をする

全件抽出はとても簡単で、抽出する条件は色々と変更出来るので、 その辺りは次回以降に記載します。

3.ListViewの1つ1つの項目にデータを設定していく

抽出したデータのサイズだけfor文で回してArrayListに格納していきます。

4.データが設定された1つ1つの項目をListViewとして表示をする

ArrayListをListViewに設定すればRealmの全件のデータがListView形式で表示されます。 次回は、全件を表示するのではなく抽出するデータを絞り込みたいと思います。

MySQLにCSVファイルを用いてデータを登録してみよう!!

あけましておめでとうございます。 今年はより更新頻度を上げて、閲覧してくださる方の為になるようなことを簡潔に書いていければと思います!! 今回は、データをデータベースに登録する上で、より効率化を図るべく csvファイルを用いて登録していこうと思ったので、 データの登録までをつまづいた部分を含めて書いていきます。 最初はローカルのMySQLに登録をしてみて、 その後にAWSのEC2内にあるMySQLに登録してみる といった流れでテストしてみました。

MySQLのテーブル構成

まずはテーブル構成を簡単に記載します。
カラム名データ型オプション
idint(11)primary key , auto_incremet
namevarchar(255)
addressvarchar(255)
entry_timetimestampdefault current_timestamp

CSVファイル

上記のデータベースに登録するためには次のようなCSVファイルを作成します。 最初の「,」の前と、最後の「,」の後にはそれぞれ idとentry_timeが自動的にデータベースに登録されるように空白にしております。

SQL文を用いてCSVデータをMySQLに登録

それではSQL文でCSVファイルのデータを登録してみます。 ローカルでCSVファイルを登録しようとすると といったエラーが出てしまいました。 (このエラーはidだけではなく、entry_timeにも該当します。) 原因は、 空白の文字はint型とtimestamp型には登録できないようです。 また、NULLも入りません。。。 しょうがないので、対応策としてSQL文の一番後ろに登録するカラムを記載して、CSVファイルの記載の仕方も変えました。 カラム数が多くなると大変になるという欠点はありますが、データの登録はできたのでサーバーでもテストしてみます。 すると、まずは といったエラー ローカルとサーバーではSQL文が異なるらしい。。。 これでなんとかうまく行きました!! 一応、CSVファイルに「,」を付けた状態でデータ登録してみると できた!! MySQLのバージョンの違いなのでしょうか?? ローカル:5.6.27 サーバー:5.5.40 うーん、サーバーの方がバージョン古い。 (すみません。詳しい原因はわかりませんでした。)

まとめ

結果として、下記でサーバーのMySQLに登録出来ました。