12月11日

デバッグのヒント

画面レイアウトの調整

画面レイアウトにはあまり凝らないこと!
サイトがきちんと動作させることを優先して作業する。

基本的な画面表示がうまくいかない場合、ブラウザの開発者ツールを使うと原因を調査しやすい。
Internet Explorer の場合、画面右上の歯車アイコンをクリックし「F12 開発者ツール」を選択すると、開発者ツールの画面が表示される。
開発者ツールの左端のメニューから「DOM Explorer」を選択すると、DOMの構造と要素に対するスタイルやCSSがどのように割り当てられているかが確認できる。

dev-tool

Chromeの場合は、画面上で右クリックして[要素を検証]を選択すれば、デベロッパーツールの画面が開く。

12月4日

今後の予定

残りの授業は今週と来週だけなので、遅くても今週で全般的に動作するようにし、来週は細かい調整やデバッグのために時間を確保すること。

1月8日と1月9日の1現目は最終的な動作確認とPowerPointによる発表資料の作成にあてる。
1月9日の2現目は発表とデモを行う。

制限時間:20分
 発表: 10分
 デモ: 5分
 質疑: 5分

詳細は「最終日の発表・デモについて」を参照すること。

ログイン後に決まったページに遷移する方法

Spring Security のデフォルトでは、認証が必要なページAにアクセスしたときに未ログインであればログイン画面を表示し、ログイン後はページAに遷移する。
ログイン画面を表示した後、決まったページに遷移したい場合は、spring-security.xml の form-login タグの設定で always-use-default-target=”true” を指定する。

    <sec:form-login login-page="/login"
        default-target-url="/home"
        login-processing-url="/login"
        always-use-default-target="true"
        authentication-failure-url="/login?error=true" />

このように設定すると、ページAにアクセスしようとしてログイン画面を表示したときも、ログイン後は home に遷移する。

Webアプリケーション内でのファイルアクセス

Webアプリケーションがファイルにアクセスする場合は、Webアプリケーションが動作している物理パスを取得して、その配下のファイルにアクセスしなければならない。

Webアプリケーションが動作している物理パスはServletContextクラスのgetRealPath()メソッドで取得する。
ServletContext は、@Authwired で宣言すればよい。

HogeController.java

@Controller
public class HogeController {
    @Autowired
    private ServletContext context;

    // snip

    /**
     * 例えば画像ファイルを取得する場合
     *
     * @param name 画像ファイル名
     * @return 画像ファイルに対応する File のインスタンス
     */
    private File getImageFile(String name) {
        String dir = context.getRealPath("/images");
        File f = new File(dir, name);
        return f;
    }
}

11月20日

Spring Securityでのログイン画面のカスタマイズ

Spring Security では、デフォルトでは Spring Security 標準のログイン画面が表示される。

login

これを、独自のログイン画面にカスタマイズする。

まず、独自のログイン画面を用意する。
src/main/webapp の直下に login.jsp を作成する。
formタグのactionは、Spring Security で標準のログイン処理に使われるURLを指定し、ユーザー名とパスワードも標準のログインで使用されるパラメータ名 j_username と j_password を使用する。

login.jsp

<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<html>
<head>
<title>ログイン</title>
</head>

<body>

<h3>ユーザー名とパスワードを入力してください</h3>
<form name='f' action='/<%=request.getContextPath() %>/j_spring_security_check' method='POST'>
 <table>
    <tr><td>ユーザー名:</td><td><input type='text' name='j_username' value=''></td></tr>
    <tr><td>パスワード:</td><td><input type='password' name='j_password'/></td></tr>
    <tr><td colspan='2'><input name="submit" type="submit" value="Login"/></td></tr>
  </table>
</form>

</body>

</html>

spring-security.xml に24行目の設定を追加して、権限なしでこのファイルにアクセスできるようにする。

spring-security.xml

	<sec:http pattern="/" security="none"/>
	<sec:http pattern="/index.jsp" security="none"/>
	<sec:http pattern="/login.jsp" security="none"/>
	<sec:http pattern="/css/**" security="none"/>

ここで、login.jsp にアクセスできることを確認する。

login-1

次に、権限が必要なページにアクセスしたときは、ログイン画面に遷移するように spring-security.xml に設定を追加する。
追加したのは、28行目の1行のみ。

spring-security.xml

	<sec:http pattern="/" security="none"/>
	<sec:http pattern="/index.jsp" security="none"/>
	<sec:http pattern="/login.jsp" security="none"/>
	<sec:http pattern="/css/**" security="none"/>
	<sec:http auto-config="true">
		<intercept-url pattern="/**" access="ROLE_USER" />
		<sec:form-login login-page="/login.jsp" />
		<sec:logout
			logout-url="/logout"
			logout-success-url="/"
			invalidate-session="true"
			delete-cookies="JSESSIONID" />
	</sec:http>

これで、権限が必要なURLにアクセスしたとき、独自のログイン画面 login.jsp が表示されるようになる。
認証をパスできるユーザー名とパスワードを入力すれば、目的のページに遷移する。

ログインしたユーザー情報の取得

ログインしたユーザーを取得するには、コントローラの引数に Principal を追加する。
ここでは、追加した Princical から getName()メソッドでユーザー名を取得し、addAttribute() で name に値を設定している。

HomeController.java

	@RequestMapping(value = "/home", method = RequestMethod.GET)
	public String home(Model model, Principal p) {
		model.addAttribute("name", p.getName());
		model.addAttribute("title", "成績の検索");
		return "home";
	}

home.jsp では、EL式で名前を表示する。

home.jsp

<h1>${title}</h1>

<p>ようこそ ${name} さん。</p>
<p>受験番号を入力してください</p>

より詳細のユーザー情報が必要な場合は、DAO を使用して名前で検索してオブジェクトを取得する。

pom.xmlの追加(書き忘れ)

Spring Security を利用するために、pom.xml の最後に以下の設定を追加する。

		<!-- Security -->
		<dependency>
			<groupId>org.springframework.security</groupId>
			<artifactId>spring-security-core</artifactId>
			<version>3.2.4.RELEASE</version>
		</dependency>
		<dependency>
			<groupId>org.springframework.security</groupId>
			<artifactId>spring-security-web</artifactId>
			<version>3.2.4.RELEASE</version>
		</dependency>
		<dependency>
			<groupId>org.springframework.security</groupId>
			<artifactId>spring-security-config</artifactId>
			<version>3.2.4.RELEASE</version>
		</dependency>

11月13日

後期成績について

後期の成績は以下の基準を適用する。

  1. 個人のPCでチーム開発したWebアプリケーションを動作させる。
    • 個人のPCにGitと連携した開発環境を作る。
    • 個人のPCのHSQLDBデータベースに必要なテーブルを作成する。
    • 担当者がエンティティを生成してコミットする。
    • 他のメンバーはGitからエンティティを取得する。
  2. Backlogを利用してチーム内の課題を管理する
    • 課題を作成すること。
    • 課題を担当すること。
    • 担当した課題を実装しGitにコミット&プッシュすること。
    • 課題を処理済にすること。
    • 実装した課題を他のメンバーに確認してもらい完了にすること。
  3. 最終日に発表・デモ

最終日の発表・デモについて

PowerPoint等で簡単なプレゼンテーションを作成する。
発表内容は以下のとおり。

  1. 概要
    • チーム名
    • メンバー
    • 開発したサービス名
  2. デモ
    • ユーザー登録/ログイン/トップ画面
    • サービス機能の利用
  3. サービスの利用
    • 全員で使ってみる
    • ユーザー登録
    • ログイン
    • サービスの利用
    • ログアウト
  4. 経験したこと
    • 解決が困難だったことできるだけたくさん(バッドノウハウの共有)
    • 開発ツールに感じた便利と不便
    • 工夫した実装方法の紹介(どやっ!)
    • 開発において学んだこと(全員)
    • Backlogで担当した課題ひとつを紹介(全員)
  5. まとめ

トラブルシューティング

問題
DatabaseManagerを起動してアクセスすると接続できるのに、Tomcatからデータベースに接続できない問題が発生。
Tomcat起動時にコンソールにエラー database alias not found が出力される。

解決
サーバービューからサーバーを削除して作り直しら動作するようになった。

11月7日

チーム開発について

作業の進め方

  1. 作業を進める課題を決める
  2. Backlogで課題を担当して処理中にする
  3. 作業のペアを決める(必要に応じて)
  4. コードを書く
  5. 動作確認する
  6. Gitにcommit/pushする
  7. Backlogの課題を「処理済」にする
  8. Gitからpull/fetchして最新コードを取得(他のメンバー)
  9. 動作確認する(他のメンバー)
  10. 他のメンバーが動作確認できたらBacklogの課題を「完了」にする

バッドノウハウ

  • HSQLDBプラグインの設定を変更したが、HSQLEB Serverを再起動してないためにDBに接続できない。
  • Gitにpushできていない。pushできているかどうかは、BacklogのGitタブのリポジトリを参照して確認する。

クラス名や変数名の命名について

Javaの命名規約
http://java.satoshis.com/index.php/java/tutorial/8-naming-convention.html

10月31日

小さな粒度の課題を実施する

今日の2現目はテストなので、作業できるのは70分程度。その短い時間で達成できそうな課題を考えて、その課題を完了させることを目標にすること。

Gitの活用

ソースコードを変更しているときに、変更方法が不適切だと気づいたときは、そのソースコードのファイルを右クリックし、[チーム]-[リセット]を選択するとよい。修正を加える前の状態に戻せる。

Gitの問題?

プッシュして、BacklogのGit上では更新されているのに、プルしても最新のファイルを取得できない問題あり?

10月3日

GITを使ってチーム内でソースコードを共有する

BacklogのプロジェクトでGitリポジトリを作成する

こちらを参考に、BacklogにGitリポジトリを作成する。

プロジェクトをローカルリポジトリにコミットする

プロジェクトをBacklogのリモートリポジトリにプッシュする

こちらを参考に、プロジェクトをリモートリポジトリにプッシュする。

リモートリポジトリをローカルにクローンする

代表者以外の人は、代表者がリモートリポジトリにプッシュしたプロジェクトを、ローカルにクローンする。

  1. Eclipseで[ファイル]-[インポート]を選択。
  2. ダイアログで[Git]-[Gitからプロジェクト]を選択して「次へ」をクリック。
  3. [Clone URI]を選択して「次へ」をクリック
  4. URI に、BacklogのプロジェクトのGitタブにあるURLを貼り付ける。
  5. backlog-1

  6. Backlogプロジェクトのユーザー名とパスワードを入力して「次へ」をクリック
  7. masterがチェックされた状態で「次へ」をクリック
  8. git-1

  9. ローカルの保管場所はそのままで「次へ」をクリック
  10. git-2

  11. プロジェクトのインポートもそのままの設定で「完了」をクリック
  12. git-4

  13. Eclipseにプロジェクトが追加された!
  14. git-5

ユーザー認証

ユーザー認証はSpring Securityを使用する。

こちらのサイトを参考に。

その他、「srping security hibernate ユーザー認証」などのキーワードで検索するとよい。