tag:blogger.com,1999:blog-34632191379326602812024-03-14T17:34:57.229+09:00渋谷で働くエンジニアの開発メモSwift/Objective-C/Java/Ajax/JavaScript/CSSなどの情報、開発中にはまったことなどをメモしていきます。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.comBlogger45125tag:blogger.com,1999:blog-3463219137932660281.post-28844108256754431982014-12-15T17:18:00.000+09:002014-12-15T17:18:18.416+09:00【iOS】Google material-design-iconsをフォント化(ttf)して使いやすくしたよ<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; word-wrap: break-word;">
フォントをiOSアプリに組み込めることはご存知かと思います。</div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
もちろん画像を使ってもいいのですが、<br style="box-sizing: border-box;" />フォントを使うと以下の良いことがあります。</div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
<span style="box-sizing: border-box; font-weight: 900;">・プロジェクトにimportが楽(1ファイルに纏まっているので)</span><br style="box-sizing: border-box;" /><span style="box-sizing: border-box; font-weight: 900;">・色変更が簡単</span><br style="box-sizing: border-box;" /><span style="box-sizing: border-box; font-weight: 900;">・サイズ変更に強い</span><br style="box-sizing: border-box;" /><span style="box-sizing: border-box; font-weight: 900;">・管理が楽</span><br style="box-sizing: border-box;" /><span style="box-sizing: border-box; font-weight: 900;">・AttributedStringの一部として文章中に出せる</span></div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
<br style="box-sizing: border-box;" /></div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
先日、Googleがmaterial-design-icons <a href="https://github.com/google/material-design-icons" style="background: transparent; box-sizing: border-box; color: #428bca; text-decoration: none; word-break: break-all; word-wrap: break-word;">https://github.com/google/material-design-icons</a>を公開しましたが、<br style="box-sizing: border-box;" />iOS用の画像も用意されています(さすがGoogleさん)。</div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
残念ながらフォントは用意されてなかったので作ることにしました。<br style="box-sizing: border-box;" />svgファイルをフォント化(ttf)してiOSから使いやすくしたので公開します。<br style="box-sizing: border-box;" /><span style="box-sizing: border-box; font-weight: 900;">全部で1661個のアイコンが使用できます。</span><br style="box-sizing: border-box;" /><br style="box-sizing: border-box;" /><br style="box-sizing: border-box;" />※Swiftで実装しています。</div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
<br class="Apple-interchange-newline" /><img alt="GoogleMaterialDesignIcons2.gif" src="https://qiita-image-store.s3.amazonaws.com/0/48971/092c6afa-81e9-26e7-3f75-c47dc1c93198.gif" style="border: 0px; box-sizing: border-box; margin: 0px; max-width: 100%; vertical-align: middle;" /></div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
<br style="box-sizing: border-box;" /><br style="box-sizing: border-box;" /><span style="box-sizing: border-box; font-weight: 900;">Source Code</span><br style="box-sizing: border-box;" /><a href="https://github.com/dekatotoro/GoogleMaterialDesignIcons" style="background: transparent; box-sizing: border-box; color: #428bca; text-decoration: none; word-break: break-all; word-wrap: break-word;">dekatotoro/GoogleMaterialDesignIcons · GitHub</a><br style="box-sizing: border-box;" /><br style="box-sizing: border-box;" /></div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
使い方<br style="box-sizing: border-box;" />GoogleIcon.swiftファイルとgoogleicon.ttfファイルをプロジェクトに追加。<br style="box-sizing: border-box;" />info.plistにFonts provided by application keyを追加して、googleicon.ttfを指定。</div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
<br style="box-sizing: border-box;" /></div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
GoogleIconクラスに定数でフォント文字を全て定義してあるので、<br style="box-sizing: border-box;" />アイコン一覧から使いたいアイコン文字を見て使用してください。<br style="box-sizing: border-box;" />※アイコン一覧はicon/googleicon.htmlで見れます。</div>
<div class="code-frame" data-lang="swift" style="background-color: #f7f7f7; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 0; margin: 1em 0px;">
<div class="highlight" style="background: rgb(255, 255, 255); box-sizing: border-box;">
<pre style="background-color: #f7f7f7; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 0px; box-sizing: border-box; color: #333333; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 13px; line-height: 18px; overflow: auto; padding: 8px 15px; white-space: pre-wrap; word-break: break-all; word-wrap: break-word;"><span class="n" style="box-sizing: border-box;">GoogleIcon</span><span class="p" style="box-sizing: border-box;">.</span><span class="n" style="box-sizing: border-box;">e600</span>
<span class="n" style="box-sizing: border-box;">GoogleIcon</span><span class="p" style="box-sizing: border-box;">.</span><span class="n" style="box-sizing: border-box;">e601</span>
<span class="n" style="box-sizing: border-box;">GoogleIcon</span><span class="p" style="box-sizing: border-box;">.</span><span class="n" style="box-sizing: border-box;">e602</span>
<span class="n" style="box-sizing: border-box;">GoogleIcon</span><span class="p" style="box-sizing: border-box;">.</span><span class="n" style="box-sizing: border-box;">e603</span>
<span class="p" style="box-sizing: border-box;">..</span>
<span class="n" style="box-sizing: border-box;">hogeLabel</span><span class="p" style="box-sizing: border-box;">.</span><span class="n" style="box-sizing: border-box;">font</span> <span class="o" style="box-sizing: border-box; font-weight: bold;">=</span> <span class="bp" style="box-sizing: border-box; color: #999999;">UIFont</span><span class="p" style="box-sizing: border-box;">(</span><span class="nl" style="box-sizing: border-box;">name</span><span class="p" style="box-sizing: border-box;">:</span> <span class="n" style="box-sizing: border-box;">GoogleIconName</span><span class="p" style="box-sizing: border-box;">,</span> <span class="nl" style="box-sizing: border-box;">size</span><span class="p" style="box-sizing: border-box;">:</span> <span class="mf" style="box-sizing: border-box; color: #009999;">30.0</span><span class="p" style="box-sizing: border-box;">)</span>
<span class="n" style="box-sizing: border-box;">hogeLabel</span><span class="p" style="box-sizing: border-box;">.</span><span class="n" style="box-sizing: border-box;">textColor</span> <span class="o" style="box-sizing: border-box; font-weight: bold;">=</span> <span class="bp" style="box-sizing: border-box; color: #999999;">UIColor</span><span class="p" style="box-sizing: border-box;">.</span><span class="n" style="box-sizing: border-box;">greenColor</span><span class="p" style="box-sizing: border-box;">()</span>
<span class="n" style="box-sizing: border-box;">hogeLabel</span><span class="p" style="box-sizing: border-box;">.</span><span class="n" style="box-sizing: border-box;">text</span> <span class="o" style="box-sizing: border-box; font-weight: bold;">=</span> <span class="n" style="box-sizing: border-box;">GoogleIcon</span><span class="p" style="box-sizing: border-box;">.</span><span class="n" style="box-sizing: border-box;">e600</span>
</pre>
</div>
</div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
<br style="box-sizing: border-box;" /><br style="box-sizing: border-box;" />storyboardからフォントを指定する場合<br style="box-sizing: border-box;" /><img alt="ScreenShotLabelFont.png" src="https://qiita-image-store.s3.amazonaws.com/0/48971/6d6638af-2f8a-94f7-e8f8-5809878ab0a4.png" style="border: 0px; box-sizing: border-box; margin: 0px; max-width: 100%; vertical-align: middle;" /><br style="box-sizing: border-box;" /></div>
<div style="background-color: white; box-sizing: border-box; color: #4a4a4a; font-family: 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif; font-size: 15px; line-height: 1.7; margin-bottom: 1em; margin-top: 1em; word-wrap: break-word;">
デザイナーがいない方や、個人で開発している方などにお役に立てたら嬉しいです。<br style="box-sizing: border-box;" />ぜひFeedBackお願いしますm(- -)m<br style="box-sizing: border-box;" /><br style="box-sizing: border-box;" /><br style="box-sizing: border-box;" />ライセンスはGoogleのmaterial-design-iconsを使用したものなので、<a href="https://creativecommons.org/licenses/by/4.0/deed.ja" style="background: transparent; box-sizing: border-box; color: #428bca; text-decoration: none; word-break: break-all; word-wrap: break-word;">Creative Commons CC BY 4.0</a>です。</div>
hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-25105937971946328672014-12-05T20:53:00.001+09:002014-12-05T21:20:37.794+09:00【iOS】SwiftでiQON / Google+/ GoogleMap/ Feedly 風のスライドメニュー<br />
Swiftで<b>iQON / Google+/ GoogleMap/ Feedly</b> 風のスライドメニューライブラリを作りました。<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjyUmyH56LiCB67ELjv7z2suZ01gO6ZKir5HVvGe_yJ_x1DR8eVtW2MjbFXXvQg-e9DqUcMPX8g48IQf0P2k_PoBmbSU7ucypd3wGFthBAPiBTFkM_xxHaYBAaAgcAzJDXZPgM_aak01mj/s1600/SlideMenuControllerSwift.gif" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjyUmyH56LiCB67ELjv7z2suZ01gO6ZKir5HVvGe_yJ_x1DR8eVtW2MjbFXXvQg-e9DqUcMPX8g48IQf0P2k_PoBmbSU7ucypd3wGFthBAPiBTFkM_xxHaYBAaAgcAzJDXZPgM_aak01mj/s1600/SlideMenuControllerSwift.gif" height="320" width="175" /></a></div>
<br />
サイドから被さるように表示するメニューです。<br />
下に隠れているメニューが主流ですが、最近は上に被さるUIもちょくちょく見かけるようになってきました。<br />
<br />
<br />
個人的にはこの被さるメニューのUIの方が好きなので、<br />
こっちのライブラリをつくりました。<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<a href="https://github.com/dekatotoro/SlideMenuControllerSwift"><b><span style="color: black;">Download Source</span></b></a><br />
<a href="https://github.com/dekatotoro/SlideMenuControllerSwift">https://github.com/dekatotoro/SlideMenuControllerSwift</a><br />
<br />
まだとりあえず動くようにしたレベルなので<br />
ぜひFeedBackお願いしますm(- -)m<br />
<div>
<br /></div>
hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com2tag:blogger.com,1999:blog-3463219137932660281.post-42912463033998727692014-10-27T23:58:00.001+09:002014-12-05T21:21:06.457+09:00【iOS】Swiftコーティング規約について<div>
お久しぶりです。<br />
<br />
ブログ久しく書いてなかったのですが、<br />
ぼちぼち書いていこうかと思います。<br />
<br />
サーバサイド、フロント、Androidアプリ開発も一通りやって<br />
最近iOSアプリの開発やってます。<br />
<br />
<br />
そろそろ本格的にSwiftで開発はじめます。<br />
<br />
<br />
<br />
SwiftはLLなみに自由に書けるので<br />
チーム開発はコーディング規約が必須でしょう。<br />
<br />
とりあえず文法も軽く押さえたので参考になりそうなものを<br />
あさってみました。<br />
<br />
<br />
チュートリアルサイトで有名な<a href="http://www.raywenderlich.com/">http://www.raywenderlich.com/</a><br />
の公式コーディング規約がけっこう良さげです。<br />
<br />
<a href="https://github.com/raywenderlich/swift-style-guide">https://github.com/raywenderlich/swift-style-guide</a></div>
<div>
<span style="font-family: 'Helvetica Neue Light', HelveticaNeue-Light, helvetica, arial, sans-serif;"><br /></span>
<span style="font-family: 'Helvetica Neue Light', HelveticaNeue-Light, helvetica, arial, sans-serif;"><br /></span></div>
<div>
<span style="font-family: 'Helvetica Neue Light', HelveticaNeue-Light, helvetica, arial, sans-serif;">上記swift-style-guideを適当に和訳しましたので<span id="goog_1237183425"></span><span id="goog_1237183426"></span><a href="https://www.blogger.com/"></a></span>参考にどうぞ。<br />
<br /></div>
<div>
<a href="https://github.com/dekatotoro/swift-style-guide/blob/master/ja_style_guide.md">https://github.com/dekatotoro/swift-style-guide/blob/master/ja_style_guide.md</a></div>
<div>
<br />
<br />
<br />
Wantedlyのコーディング規約も良くまとまって参考になります。</div>
<div>
<a href="https://itunes.apple.com/jp/app/wired-vicenadono-hao-qi-xinwo/id913849903?mt=8">Siori</a>を100%Swiftで作ってる実績もあるので信頼できますね。<br />
<a href="http://qiita.com/susieyy/items/f71435cc962e70d81b37">Swiftコーディング規約@Wantedly</a><br />
<br />
<br />
コーディング規約はこの辺を参考にしつつ<br />
少しずつ作っていこうかと思います。<br />
<br />
<br />
<br />
ではまた。<br />
<br /></div>
hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-66205250804989468022011-10-21T19:12:00.002+09:002011-10-21T19:12:29.959+09:00Java jadでjarをGrepするバッチ(bat)jar内のclassをjadコマンドで逆コンパイルして<br />
文字列検索する簡単なバッチスクリプトを作りました。<br />
<br />
jargrep.bat<br />
<pre class="prettyprint">@echo off
if "%1"=="" (
goto error
)
for %%i in (*.*) do (
jar xf %%i
)
jad -r -o **/*.class 2>nul
for /R .. %%i in (*.jad) do (
echo "%%i"
type "%%i" | find "%1"
)
goto end
:error
echo エラー:引数が指定されていません
:end
</pre><br />
<br />
検索したいjarを一箇所に集めて、同じディレクトリに<br />
batファイルを持ってきて下記のように実行。<br />
<pre class="prettyprint">jargrep.bat xxxx > grepresult.txt
</pre><br />
jarを解凍したファイルも消してないし、全然汎用的には作ってませんが、<br />
時間がないのでとりあえずいいか。<br />
<br />
findstrの方が正規表現とかもできるけど、<br />
1行が長いとエラーになるっぽいので、とりあえずfindにしてます(めちゃ重い)。<br />
ここは自分でGrepクラスでも作った方がよいかも。。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-20731599944520730482011-07-29T17:19:00.001+09:002011-07-29T17:20:38.854+09:00Java class依存関係 jar依存関係 解析ツールclass依存関係やjar依存関係を調べるのによいツールはないかと<br />
思って調べたのですが、いくつかあった中でこのツールが非常に<br />
便利だったので紹介します。<br />
<b>tattletale</b><br />
<a href="http://www.jboss.org/tattletale" target="_blank">http://www.jboss.org/tattletale</a><br />
2011/07/29現在 最新は1.1.2<br />
<br />
▼使い方<br />
<pre class="prettyprint">java -jar tattletale.jar [ターゲットディレクトリ] [レポート出力ディレクトリ]
</pre>▼ex)<br />
<pre class="prettyprint">java -Xmx512m -jar tattletale.jar C:/dir ./report
</pre><br />
[ターゲットディレクトリ]はEclipseのworkspaceを指定してOK<br />
<br />
<br />
レポート結果はHTMLで出力され、<br />
classの依存関係、jarの依存関係など様々の情報を出力してくれてかなり便利です!hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-63174356389762981752011-06-24T19:25:00.000+09:002011-06-24T19:25:25.194+09:00javaで円マークとバックスラッシュはまったのでメモ<br />
<br />
・<a href="http://goungoun.dip.jp/app/fswiki/wiki.cgi/devnotebook?page=%CA%B8%BB%FA%A5%B3%A1%BC%A5%C9" target="_blank">円マークのwiki</a><br />
・<a href="http://www.unicode.org/charts/unihan.html" target="_blank">Unihan Database</a><br />
<br />
<pre class="prettyprint">円マークとバックスラッシュ
Shift_JIS
0x5c 円マーク
0xa5 なし
UTF-8
0x5c バックスラッシュ
0xc2a5 円マーク
UTF-16
0x005c バックスラッシュ
0x00a5 円マーク
ISO-8859-1
0x5c バックスラッシュ
0xa5 円マーク
</pre><br />
<br />
Unicodeエスケープで確認<br />
<pre class="prettyprint">●画面出力
日本語フォント MS ゴシック
"\\" → 円マーク
"\u005c\u005c" → 円マーク
"\u00a5" → 円マーク
英語フォント Arial
"\\" → バックスラッシュ
"\u005c\u005c" → バックスラッシュ
"\u00a5" → 円マーク
●JasperReportでPDF出力
"\\" → バックスラッシュ
"\u005c\u005c" → バックスラッシュ
"\u00a5" → 円マーク
</pre><br />
ブラウザからの入力時に、円マークとバックスラッシュを入力・区別できるのかというと、<br />
とりあえずファイルで作成したものをコピペで両方入力可能でした。<br />
円マークもバックスラッシュも両方画面上は円マークとして表示される(日本語フォント)が、<br />
サーバ側で取得すると判別可能なためString.replaceAll等で置換可能ですね。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-53211743399253407802011-06-16T13:05:00.000+09:002011-06-16T13:05:12.796+09:00eclipseでリモートデバッグeclipseでリモートデバッグ方法メモ<br />
<br />
▼リモートのJVM起動オプションに下記を追加<br />
<pre class="prettyprint">-Xdebug -Xrunjdwp:transport=dt_socket,server=y,suspend=n,address
=12345
</pre><br />
<br />
▼eclipse<br />
「eclipseメニューの実行」→「構成及びデバッグ」→「リモートjava<br />
アプリケーション」→右クリックして新規→<br />
・「プロジェクト」 デバッグするプロジェクトを指定<br />
・「接続タイプ」 標準(ソケット接続)<br />
・「ホスト」 ホストを指定<br />
・「ポート」 JVMオプションで指定したportを指定(上記の例だと12345)<br />
→「適用」→「デバッグ」hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-55807376281540396892011-06-16T13:03:00.005+09:002011-06-16T13:08:19.080+09:00JVMのリモートメモリ監視(jconsole)JDK5.0以降、監視ツールなど有用なものがけっこう含まれています。<br />
※JDK6.0で試しています<br />
<br />
メモリはjconsoleが一番見やすいと思います。<br />
<br />
JVM起動オブションに下記を追加<br />
<pre class="prettyprint">-Dcom.sun.management.jmxremote.port=ポート番号
-Dcom.sun.management.jmxremote.ssl=false
-Dcom.sun.management.jmxremote.authenticate=false
</pre><br />
portはwellknownポートでなければなんでもOK。<br />
デフォルトでSSLとパスワード認証が有効になっているので無効にする。<br />
jconsoleを起動して、リモートプロセスタブに[ホスト名:port]を入力して「接続」<br />
でリモートJVMの監視ができます。<br />
<br />
ここに色々のっていますね。<br />
<a target="_blank" href="http://java.sun.com/j2se/1.5.0/ja/docs/ja/guide/management/agent.html#auth_disabled">http://java.sun.com/j2se/1.5.0/ja/docs/ja/guide/management/agent.html#auth_disabled</a>hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-69730211887544261592011-05-18T14:30:00.000+09:002011-05-18T14:30:25.080+09:00JSF(Teeda) フェーズリスナでセッション存在チェックJSFを用いたWEBアプリケーションの作成において、<br />
セッションの存在チェックをどのタイミングで行うのが<br />
正解なのか。<br />
<br />
まず、Actionにインターセプターを設定してセッション存在チェックを<br />
行おうと考えたが、rendererやConverter、Validatorを<br />
拡張実装してスコープやセッションから値を取得している場合に、<br />
チェックより前なので、ヌルポ等の予期せぬエラーが発生する可能性がある。<br />
<br />
次に、filterでセッションチェックを行おうと考えていたが、<br />
filterはTeeda管理外なので、エラー発生の場合Teedaで設定した<br />
エラー画面とならず、HTTPステータスエラー画面になってしまう<br />
(web.xmlのerror-pageで設定していれば別)。<br />
<br />
今回はrendererのdecode処理でもセッションを使用する拡張等を<br />
行っていたので、リクエスト適応フェーズ前にチェックを<br />
行う必要があるため、フェーズリスナーでセッション存在チェックを<br />
実装しようと思います。<br />
<br />
JSFではフェーズごとにリスナーで処理をいれることができ、<br />
フェーズリスナーの下記タイミングでチェックを行うことで<br />
renderer、Converter、Validatorより前にチェックできる。<br />
<p>POST<br />
1.RESTORE_VIEW(Page状態復元 スコープ管理機能中間モデルの復元)<br />
→→→ ここでセッションチェック ←←←<br />
2.APPLY_REQUEST_VALUES(中間モデルにリクエスト値の適応)※renderer(decode)<br />
3.PROCESS_VALIDATIONS(バリデーション) ※Converter、Validator実行<br />
4.UPDATE_MODEL_VALUES(Pageクラスのプロパティ更新)<br />
5.INVOKE_APPLICATIONS(アクション実行)<br />
GET<br />
6.RENDER_RESPONSE(レンダリング)※renderer(encode)→initialize(初回)→prerender<br />
</p><br />
<br />
<pre class="prettyprint"> <lifecycle>
<phase-listener>
test.listener.SessionCheckListener
</phase-listener>
</lifecycle>
</pre><br />
<br />
<pre class="prettyprint">package test.listener;
import javax.faces.event.PhaseEvent;
import javax.faces.event.PhaseId;
import javax.faces.event.PhaseListener;
import javax.servlet.http.HttpSession;
・・・
public class SessionCheckListener implements PhaseListener {
public void beforePhase(PhaseEvent event) {
//リクエスト適応フェーズ前にセッションチェック処理
・・・
}
//リクエスト適応フェーズ後は何もしない
public void afterPhase(PhaseEvent event) {}
public PhaseId getPhaseId() {
//リクエスト適応フェーズ
return PhaseId.APPLY_REQUEST_VALUES;
}
}
</pre><br />
<br />
あと、リクエストが違うので念のため<br />
「6.RENDER_RESPONSE(レンダリング)」前<br />
にもセッション存在チェックを入れました。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-32037704501105173182011-05-18T12:12:00.002+09:002011-05-18T12:12:24.511+09:00JPA(Kuina-Dao) リレーション関係を持ったテーブルの更新、追加時の注意点例) <br />
親テーブル(1)と関係する子テーブル(N)を関係性を持たせ新規登録<br />
<br />
<pre class="prettyprint">// 親テーブル用Dao
private ParentDao parentDao;
// 子テーブル用Dao
private ChildDao childDao;
protected void doLogic() {
// 親テーブルを登録
Parent parent = new Parent();
parent.setParentid("999");
parentDao.persist(parent);
// 子テーブルを登録 数分繰り返し処理
for (int i = 0; i < 10; i++) {
Child child = new Child();
child.setChildid("ABC" + i);
// 親テーブルPkeyを直に設定しない
// child.seParent_pkey(11111);
// 親entitiyをセット
child.setParentt(parent);
childDao.persist(child);
}
}
</pre>
子entity(N側)の親entityPkeyは、個別に設定しないようにする。
個別に設定しないように制約を付けるには、Columnアノテーションで
insertable、updatableにfalseを設定することによって、
リレーションentitiyによる追加、更新以外を防ぐことが可能。
<pre class="prettyprint">@javax.persistence.Entity
@javax.persistence.Table(name = "child")
public class Child {
・・・
@javax.persistence.ManyToOne(targetEntity = Parent.class ,fetch = FetchType.LAZY)
private Parent parent;
@javax.persistence.Column(name = "parent_pkey", insertable = false, updatable = false)
private Integer parent_pkey;
・・・
}
</pre>hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-74961550358852406752011-02-16T18:44:00.005+09:002011-02-16T18:56:15.961+09:00Kuina-Daoで行ロック、テーブルロックKuina-DaoはS2ファミリーでJavaEE5のO/Rマッピング標準です。<br />
JPA上で利用可能なDAOフレームワークで、インタフェースを定義する<br />
だけで動的な問い合わせを生成してくれます。<br />
SQLファイルを利用した問い合わせもできます。<br />
<a href="http://kuina.seasar.org/ja/">http://kuina.seasar.org/ja/</a><br />
<br />
<br />
今回はKuina-Daoで行ロック、テーブルロックはどのようにやるかのメモです。<br />
<br />
<br />
<b>行ロック</b><br />
■javax.persistence.EntitiyManagerを使用する場合<br />
<pre class="prettyprint">TestEntitiy entity = testDao.find(pkey);
EntityManager em = SingletonS2Container.getComponent(EntityManager.class);
em.lock(entity, LockModeType.WRITE); //またはem.lock(entity, LockModeType.READ);
em.flush();
</pre><br />
■org.seasar.kuina.dao.GenericDaoを継承したDaoを使用する場合<br />
<pre class="prettyprint">TestEntity entity = testDao.find(1);
testDao.writeLock(entity); //またはtestDao.readLock(entity);
</pre><br />
LockModeType.READはreadLock、LockModeType.WRITEはwriteLockに対応しています。<br />
LockModeTypeとしてLockModeType.WRITEを指定すると、エンティティの状態変更がない場合でもバージョン列は強制的に更新されます。<br />
バージョン列の更新はflushまたはコミットのタイミング。<br />
<br />
<br />
<b>テーブルロック</b><br />
テーブルロックはざっと見たところ、Entityを使用してはできなさそうなので、<br />
SQLファイルを利用した方法しかなさそうです。<br />
<br />
■Daoインターフェース<br />
<pre class="prettyprint">public interface LockTableDao {
void deleteLockTable();
}
</pre><br />
■SQL(LockTableDao_deleteLockTable.sql)<br />
<pre class="prettyprint">LOCK TABLE appparam IN EXCLUSIVE MODE;
</pre><br />
■実行<br />
<pre class="prettyprint">lockTableDao.deleteLockTable();
</pre><br />
<br />
Kuina-Daoはメソッドの名前や引数・戻り値から実行すべき操作を判断するので、<br />
戻り値をvoidにする場合は(insert|update|delete|remove)が先頭に付けないと駄目ですね。<br />
<a href="http://kuina.seasar.org/ja/user_guide/dao.html#メソッド">http://kuina.seasar.org/ja/user_guide/dao.html#メソッド</a><br />
<br />
<br />
<br />
Kuina-Daoはあまり人気ないようですが、使いやすくていいですね。<br />
でも複雑な問い合わせはSQLにならざるをえない。。<br />
<br />
S2Dao後継のDomaそろそろさわってみようかな。<br />
AnnotationProcessingTool(apt)を利用したJava6(JDBC4.0)対応のO/Rマッパーとその開発支援ツール。<br />
<a href="http://doma.seasar.org/">http://doma.seasar.org/</a><br />
Seasar2への依存なしってのがいいですね!hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-65619225769111996242011-02-03T15:03:00.000+09:002011-02-03T15:03:32.028+09:00java synchronized 排他の相互関係まとめsynchronizedの排他関係について気になったので整理しました。<br />
<br />
<b>staticメソッドのsynchronized</b><br />
Classオブジェクトのロックを取得します。<br />
<br />
<pre class="prettyprint">class HogeClass {
synchronized static public void hogeMethod() {
// 処理
}
}
</pre><br />
上記は以下のsynchronizedブロックと同様になります。<br />
<br />
<pre class="prettyprint">static public void hogeMethod() {
synchronized(Class.forName("HogeClass")) {
// 処理
}
}
</pre><br />
<br />
以下のようなsynchronizedがついてるメソッドとついていないメソッドが混在するクラスの場合。<br />
<br />
<pre class="prettyprint">class HogeClass {
synchronized static public void methodA() {
// 処理
}
synchronized static public void methodB() {
// 処理
}
static public void methodC() {
// 処理
}
}
</pre><br />
methodA自身、methodB自身、methodAとmethodBは互いに排他的に実行されますが、<br />
methodAとmethodC、methodBとmethodCは排他的に実行されません。<br />
staticなのでJVM上で排他制御されます。<br />
<br />
<br />
<br />
<b>インスタンスメソッドのsynchronized</b><br />
インスタンスオブジェクトのロックを取得します。<br />
<br />
<pre class="prettyprint">synchronized public void hogeMethod() {
// 処理
}
</pre><br />
上記は以下のsynchronizedブロックと同様になります。<br />
<br />
<pre class="prettyprint">public void hogeMethod() {
synchronized(this) {
// 処理
}
}
</pre><br />
<br />
以下のようなsynchronizedがついてるメソッドとついていないメソッドが<br />
混在する場合はどうなるでしょう。<br />
<br />
<pre class="prettyprint">class HogeClass {
synchronized public void methodA() {
// 処理
}
synchronized public void methodB() {
// 処理
}
public void methodC() {
// 処理
}
}
</pre><br />
methodA自身、methodB自身、methodAとmethodBは同じインスタンス内で互いに排他的に実行されますが、<br />
methodAとmethodC、methodBとmethodCは排他的に実行されません。<br />
この排他関係はstaticの場合と同様ですが、インスタンスメソッドなので<br />
いちインスタンスに対してで排他制御されますね。<br />
<br />
また、synchronizedメソッド内からsynchronizedメソッドを呼び出すことは可能です。<br />
オブジェクトのロックを取得しているので当然ですね。<br />
(もちろんstaticの場合も同様)<br />
<pre class="prettyprint">class HogeClass {
synchronized public void methodA() {
methodB();
}
synchronized public void methodB() {
// 処理
}
}
</pre><br />
<br />
<br />
あまりないとは思いますが、JVM上でスレッド間をまたいでインスタンスメソッドの<br />
排他制御を行いたい場合は、以下のような方法があります。<br />
<pre class="prettyprint">class HogeClass {
private static Object lock = new Object();
public void methodA() {
synchronized (lock) {
// 処理
}
}
public void methodB() {
synchronized (lock) {
// 処理
}
}
}
</pre><br />
<br />
排他制御は、相互作用を理解して誤動作やデッドロック等が起きないように<br />
必要最低限に限定して使用するのがよいですね。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com1tag:blogger.com,1999:blog-3463219137932660281.post-4990973087970480222011-01-13T10:31:00.002+09:002011-01-13T10:35:35.382+09:00WindowsでTomcatをコマンド起動VisualVMを使用してプロファイリングしようと思ったけど、WindowsサービスでTomcatをあげると認識してくれないのでコマンドでTomcatを起動。<br />
<br />
JVMオプションはそれぞれの環境によって違うと思います。<br />
※p6spy使ってるんで、spy.propertiesの環境変数を追加<br />
<br />
<pre class="prettyprint">
java
-Xms256m
-Xmx512m
-XX:PermSize=256m
-XX:MaxPermSize=512m
-Djava.util.logging.manager=org.apache.juli.ClassLoaderLogManager
-Djava.util.logging.config.file="C:\Program Files\Apache Software Foundation\Tomcat 6.0\conf\logging.properties"
-Dspy.properties="C:\Program Files\Apache Software Foundation\Tomcat 6.0\webapps\myapp\WEB-INF\classes\spy.properties"
-Dcatalina.home="C:\Program Files\Apache Software Foundation\Tomcat 6.0"
-Dcatalina.base="C:\Program Files\Apache Software Foundation\Tomcat 6.0"
-Djava.endorsed.dirs="C:\Program Files\Apache Software Foundation\Tomcat 6.0\endorsed"
-Djava.io.tmpdir="C:\Program Files\Apache Software Foundation\Tomcat 6.0\temp"
-classpath "C:\Program Files\Apache Software Foundation\Tomcat 6.0\bin\bootstrap.jar"
org.apache.catalina.startup.Bootstrap start
</pre><br />
Tomcatのバージョンは6.0.16です。<br />
わざわざコマンド起動しないでも、サービスを監視する方法ありそうだけどとりあえず。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-13899039953650882562010-11-02T15:22:00.004+09:002010-11-02T15:26:35.153+09:00ブラウザのリロード防止リロードの無効化が必要になったので実装しました。<br />
※IE6,7,8で確認<br />
<br />
[F5]、[Ctrl + R]によるリロード防止処理。<br />
<pre class="prettyprint">function preventReload(){
var KEY_F5 = 116;
var KEY_R = 82;
var e = window.event;
var ctrl = e.ctrlKey;
var preventFlg = false;
switch (event.keyCode ){
case KEY_F5:
preventFlg = true;
break;
case KEY_R:
if (ctrl) {
preventFlg = true;
break;
}
}
if (preventFlg) {
e.keyCode = 0;
e.returnValue = false;
return false;
}
}
</pre><br />
[F6]とか[Ctrl + Tab]でロケーションバーにフォーカス後<br />
(ロケーションバーを表示してなくても)、[F5]を押下されると<br />
効いてしまうんで、この辺も要件によっては無効化した方が<br />
いいかもしれないですな。<br />
<br />
まぁ、js無効化とかタイミング、お気に入り表示とかでも効いてしまったりするし、<br />
そもそもクライアント側で完全に防止するのは不可能という前提で、<br />
完全に防止したい場合は、サーバ側でワンタイムトークンとか<br />
実装しておくのは必須。<br />
<br />
ただ、普通の操作における誤操作防止にはある程度有効なので、<br />
入れておくにこしたことはなさそう。<br />
<br />
<br />
IEショートカットキー 一覧<br />
<a href="http://www.microsoft.com/japan/enable/products/keyboard/default.mspx">http://www.microsoft.com/japan/enable/products/keyboard/default.mspx</a><br />
<br />
その他[Alt + ←],[Alt + →]など防止したい場合は、<br />
以下のサイトの実装が参考になると思います。<br />
<ul><li><a href="http://sei.qee.jp/docs/program/hta/sample/nullKey.html">IEの特定のキー操作を無効化</a></li>
</ul>hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-14321096172434472802010-11-01T19:22:00.003+09:002010-11-02T11:56:01.593+09:00ブラウザの「閉じるボタン」のイベントを取得するちょっと必要になったので調べました。<br />
<br />
ブラウザの閉じるボタンを押された時のイベントで処理をしたい場合。<br />
<pre class="prettyprint">function window.onbeforeunload() {
if(((event.clientX > document.body.clientWidth) && (event.clientY<0)) || event.altKey ) {
xxxFunc();
}
}</pre><br />
<br />
IE7などのタブブラウザはこっち。<br />
<pre class="prettyprint">function window.onbeforeunload() {
if( event.clientY < 0 || event.altKey ) {
xxxFunc();
}
}</pre><br />
<br />
▼IEのonbeforeunloadイベントの仕様はこちら<br />
<a href="http://msdn.microsoft.com/en-us/library/ms536907.aspx">http://msdn.microsoft.com/en-us/library/ms536907.aspx</a><br />
<br />
<br />
onbeforeunloadイベントは閉じるボタン以外でも<br />
<ul><li>location.hrefに新しいlocation を設定した場合</li>
<li>location.reload() メソッド呼び出しの場合</li>
<li>window.close() をだした場合</li>
</ul><br />
などでも動作するので条件を入れるわけですが、<br />
タブブラウザに合わせた実装だとロケーションバーにフォーカスをあてて<br />
Enter押下でも動作してしまったり。。<br />
<br />
なんかいい方法ないかな。。<br />
<br />
参考URL<br />
<pre class="prettyprint"><a href="http://techbank.jp/Community/blogs/mymio/archive/2008/04/11/518.aspx">ブラウザの「閉じるボタン」とタブの「閉じるボタン」</a>
<a href="http://inside.ascade.co.jp/node/58">IEでのonBeforeUnload の挙動</a>
<a href="http://q.hatena.ne.jp/1168612418">javascript:ページ遷移時に確認を出して、キャンセルしたら、遷移しないということをしたいと考えています。</a>
<a href="http://sei.qee.jp/docs/program/hta/sample/nullKey.html">IEの特定のキー操作を無効化</a>
</pre>hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-9469150263902770182010-10-28T19:26:00.002+09:002010-10-28T19:28:05.560+09:00jQuery ThickBoxを使ってみた画像をクリックすると画像を拡大して表示するサイトをよく見かけ、<br />
かっこいいなぁと思っていたので自分もやってみました。<br />
<br />
調べたところjQueryとThickboxというものを使用すると簡単に実現出来そうです。<br />
<br />
<br />
<b>手順</b><br />
<a href="http://jquery.com/demo/thickbox/">配布ページ</a>より以下のファイルをダウンロード。<br />
<a href="http://jquery.com/demo/thickbox/">http://jquery.com/demo/thickbox/</a><br />
<ul><li>jquery.js</li>
<li>loadingAnimation.gif</li>
<li>thickbox.css</li>
<li>thickbox.js</li>
</ul><br />
※jquery.jsの名前はjquery-latest.jsだったりするかも<br />
<br />
<br />
thickbox.jsの8行目でloadingAnimation.gifのパスが設定されているので<br />
loadingAnimation.gifのパスを自分に環境に合わせます。<br />
<pre class="prettyprint">var tb_pathToImage = "images/loadingAnimation.gif";</pre><br />
<br />
ThickBoxを利用したいhtmlのhead要素などでファイルを読み込みます。<br />
<pre class="prettyprint"><link rel="stylesheet" href="thickbox.css" type="text/css" media="all">
<script type="text/javascript" src="jquery-latest.js" ></script>
<script type="text/javascript" src="thickbox.js"></script></pre><br />
<br />
<br />
あとは実際に使用するHTMLに設置するだけです。<br />
<br />
<b>▼画像拡大の場合</b><br />
サムネイル画像と拡大画像へのリンクを張ります。一番見かけますね。<br />
<pre class="prettyprint"><a href="拡大画像1.jpg" class="thickbox" title="サンプル" rel="test"><img src="サムネイル画像1.jpg" width="160" height="120" alt="サンプル" border="0" /></a>
<a href="拡大画像2.jpg" class="thickbox" title="サンプル" rel="test"><img src="サムネイル画像2.jpg" width="160" height="120" alt="サンプル" border="0" /></a></pre><br />
<br />
<br />
<b>▼HTML拡大表示</b><br />
HTMLを表示することもできます。<br />
<pre class="prettyprint"><a href="test.html?width=400&height=200" class="thickbox">testhtml</a></pre><br />
<br />
<b>▼iframe拡大表示</b><br />
iframeを表示することもできるんですね。<br />
<pre class="prettyprint"><a href="test.html?TB_iframe=true&width=400&height=300" class="thickbox">testhtmlInIframe</a></pre><br />
<br />
<b>▼ページ内HTML拡大表示</b><br />
ページ内のHTMLを拡大表示することもできます。ページ内のdiv要素をdisplay:noneにしておいて、リンククリックで表示みたいな。<br />
<pre class="prettyprint"><a href="#TB_inline?width=400&height=300&inlineId=thickboxdivtest" class="thickbox">ページ内HTMLテスト</a>
<div id="thickboxdivtest" style="display:none"><span style="font-weight:bold">テスト文字表示だよ<br/>テスト文字表示だよ<br/></span></div></pre><br />
<br />
<br />
<span style="color: red;"><b>注意点</b></span><br />
ちなみに、最初グループ化属性のrel属性をつけると画像が表示されませんでした。<br />
jqueryとthickboxのversionに相性があるようで、rel属性をつけると画像が表示されない<br />
場合は以下の修正をすると動作するようになります。<br />
<br />
thickbox.js(ver3.1、unCompressed)の79行目を以下のように修正<br />
<pre class="prettyprint">TB_TempArray = $(“a[@rel="+imageGroup+"]“).get();
↓
TB_TempArray = $(“a[rel="+imageGroup+"]“).get();</pre><br />
<br />
<br />
<br />
ThickBox、簡単に設置できるのでお勧めです。<br />
とりあえず使い方は押さえたので、thickbox.js、thickbox.cssをカスタマイズすればまた色々できそうですね。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-28541621018085083992010-10-22T12:26:00.003+09:002010-10-22T12:28:43.041+09:00seasar2のdicon設定 namespace指定はメモリを喰う?seasar2のdiconファイル定義では、components要素に<br />
namespace属性を指定できます。<br />
<a href="http://s2container.seasar.org/2.4/ja/reference/html/config-dicon.html#d0e1484" target="_blank">http://s2container.seasar.org/2.4/ja/reference/html/config-dicon.html#d0e1484</a><br />
<br />
名前空間を指定できるわけですが、これを指定すると<br />
メモリ使用量(heapsize)がけっこう増えます<br />
(もちろん登録コンポーネント数にもよりますが)。<br />
heapdumpして確認するとS2ContainerのHashMapの<br />
容量がだいぶ変わることがわかりました。<br />
<br />
S2Container内で管理しているコンポーネント名が<br />
長くなると思うので単純に増えそうではありますが。。<br />
<br />
今回はAutoRegisterで大量にコンポーネントを登録し、<br />
namespaceを全てのdiconにつけていました。<br />
必要のないnamespace指定を取り除いたところ、<br />
以下のような結果となりました。<br />
<pre class="prettyprint">namespaceをつける S2ContainerのHashMap 約1GB
namespaceをつけない(※1) S2ContainerのHashMap 約400MB </pre><br />
(※1)もともとseasar2のjarに含まれているdiconを拡張したものは<br />
namespaces指定そのまま。<br />
データソースの切替等でJDBC関連の必要な部分はnamespaceを指定。<br />
<br />
使用しているS2のversionはseasar2.4.25で、だいたい2.4系はSmartDeployを<br />
使用すると思うのであまり注意は必要ないかもしれませんが、<br />
とりあえずnamespaceを無駄に指定するのはよくなさそうですね。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-18642954970491123242010-10-19T16:57:00.004+09:002010-10-22T12:30:33.929+09:00webページの横幅は何pxにすべきかふとサイト製作におけるWEBページの横幅の妥当性を知りたくなったので調べてみた。軽くぐぐっただけで大量に情報がありますね。<br />
<br />
<pre class="prettyprint"><a href="http://zapanet.info/blog/item/1214" target="_blank">1000px弱時代のWebデザイン</a>
<a href="http://www.i-love-key.net/archives/2009/01/web_design.html" target="_blank">web屋が主張する「リキッドレイアウト」に騙されないために</a>
<a href="http://q.hatena.ne.jp/1150557262" target="_blank">webページ作成の際に、横幅を何ピクセルにすべきでしょうか。</a>
<a href="http://neta.ywcafe.net/000348.html" target="_blank">横幅を固定するな!後悔しないためのWebデザイン</a>
<a href="http://www.yasuhisa.com/could/entries/000367.php" target="_blank">固定か可変かそれが問題だ</a>
<a href="http://www.akiyan.com/blog/archives/2006/02/mixi800px.html" target="_blank">mixiのデザイン変更から学ぶ、ウェブサイトの最小横幅を800px以下にすべき理由</a>
<a href="http://blog.x-yz.co.jp/8mamo10/archives/110" target="_blank">気持ちのいいサイトとは(3)~リキッドデザイン~</a>
<a href="http://eclucifer.net/blog/web/2009011501.html" target="_blank">リキッドデザイン問題はmax-widthとIE6用expressionで解決</a></pre><br />
<br />
<br />
まずは対象となるターゲットユーザは誰か。<br />
一般ユーザなのか、イントラネット内の企業ユーザなのかで<br />
大きく分かれると思います。<br />
<br />
企業ユーザであれば、ブラウザの種類や端末の解像度もおおよそ見当が付くこと<br />
多いと思いますのでそれに合わせて作成するのがよいかと。<br />
<br />
一般ユーザの場合はブラウザや端末の種類が多岐に渡るのでなかなか難しいですが、<br />
横幅800~1000px弱で作成するのが無難なのではないでしょうか。<br />
<br />
<br />
リキッドデザインはよいとは思うのですが、「ブラウザを最大化すると逆に見にくい」という問題もあります。<br />
max-widthを利用して広がり過ぎを解決するという方法もあるようです。<br />
<a href="http://eclucifer.net/blog/web/2009011501.html" target="_blank">リキッドデザイン問題はmax-widthとIE6用expressionで解決</a><br />
<br />
で、自分なりの結論ですが、<a href="http://zapanet.info/blog/item/1214" target="_blank">1000px弱時代のWebデザイン</a>にあるように<br />
ほとんどのユーザーが横幅1024px以上表示できることと、デザインのし易さから固定幅横幅800~1000px弱でサイトをデザインすることがよいのではないかと思いました。<br />
もちろん、ケースバイケースではあるのですが。。<br />
<br />
<br />
<br />
あとIE6の場合は、印刷対策をしとかないと見切れたりするので注意が必要ですね。<br />
<pre class="prettyprint"><a href="http://force4u.cocolog-nifty.com/skywalker/2010/10/ppi-6ebf.html" target="_blank">ブラウザ印刷とスクリーン解像度の不思議な関係</a>
<a href="http://neta.ywcafe.net/000067.html" target="_blank">印刷できるページを作るには</a>
<a href="http://www.rasen-d.net/first-css/file30.html" target="_blank">印刷用CSS:webページの横幅について</a></pre>hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-44396985113616504972010-10-15T18:50:00.001+09:002010-10-15T18:51:02.574+09:00アップロードファイルのローカル最終更新日時を取得できるかWEBアプリにてアップロードファイルのローカル最終更新日時を<br />
取得できるか調べてみましたが、結論から言うとできません。<br />
言語はJavaですが多言語も同様です。<br />
<br />
[調査1]<br />
・リクエストをパケットモニタしましたが、<br />
飛んでいる情報は以下3つになります。<br />
フィールド名<br />
ファイルパス<br />
ファイル内容<br />
<br />
<br />
[調査2]<br />
・RFC 1867 ファイルアップロードについての規定にも<br />
タイムスタンプの記載はなし<br />
<a href="http://www.ietf.org/rfc/rfc1867.txt">RFC原文</a><br />
<a href="http://www.studyinghttp.net/cgi-bin/rfc.cgi?1867">studyinghttp日本語訳</a><br />
<br />
上記調査からタイムスタンプのようなファイル属性はhttp通信時に<br />
欠落する(リクエストに付加されない)ためサーバ側で取得<br />
することは不可能。<br />
<br />
<br />
最終更新日時の取得などはファイルの一意性を確認したい<br />
場合が多いと思うので、別の方法として<br />
java.security.DigestInputStream等を使用してファイル内容の<br />
ハッシュ値を保存しておく方法が考えられる<br />
(よくダウンロードファイルの改変チェックに使用されているもの)。<br />
<br />
ファイル名<br />
ファイルサイズ<br />
ハッシュ値<br />
の比較で全て同じであればファイルの一意性としても<br />
よいかな。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-81165652583485240572010-10-08T12:07:00.001+09:002010-10-08T12:08:55.612+09:00Teeda sendRedirectでIllegalStateExceptionTeedaでrendererの拡張を行っているのですが、sendRedirectでIllegalStateExceptionが発生。<br />
<pre class="prettyprint">java.lang.IllegalStateException
at org.apache.catalina.connector.ResponseFacade.sendRedirect(ResponseFacade.java:435)
at org.seasar.teeda.core.util.ServletExternalContextUtil.redirect(ServletExternalContextUtil.java:188)
at org.seasar.teeda.extension.context.TmsServletExternalContextImpl.redirect(TmsServletExternalContextImpl.java:298)
at org.seasar.teeda.core.util.NavigationHandlerUtil.redirect(NavigationHandlerUtil.java:55)
at org.seasar.teeda.extension.util.TeedaExtensionErrorPageManagerImpl.handleException(TeedaExtensionErrorPageManagerImpl.java:84)
at org.seasar.teeda.core.lifecycle.LifecycleImpl.handleException(LifecycleImpl.java:116)
at org.seasar.teeda.core.lifecycle.LifecycleImpl.render(LifecycleImpl.java:135)
at javax.faces.webapp.FacesServlet.service(FacesServlet.java:101)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at jp.co.isid.fine.io.file.UploadFilter.doFilter(UploadFilter.java:60)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at org.seasar.teeda.core.filter.RequestDumpFilter.doFilter(RequestDumpFilter.java:125)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at org.seasar.framework.container.hotdeploy.HotdeployFilter.doFilter(HotdeployFilter.java:70)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at org.seasar.framework.container.filter.S2ContainerFilter.doFilter(S2ContainerFilter.java:77)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at org.seasar.extension.filter.EncodingFilter.doFilter(EncodingFilter.java:69)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at jp.mufg.tms.base.web.filter.SessionInvalidateFilter.doFilter(SessionInvalidateFilter.java:47)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at jp.mufg.tms.base.web.filter.ThreadLocalFilter.doFilter(ThreadLocalFilter.java:72)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at jp.mufg.tms.base.web.filter.NocacheFilter.doFilter(NocacheFilter.java:53)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:175)
at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:128)
at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:286)
at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:844)
at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:583)
at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:447)
at java.lang.Thread.run(Thread.java:619)</pre><br />
<br />
スタックトレース見ればわかりますが、レンダリングでエラーが発生した場合は<br />
org.seasar.teeda.core.lifecycle.LifecycleImpl#handleExceptionにデバッグいれると<br />
エラーの内容がわかりますね。<br />
<br />
jspで開発していた時に、jsp:includeを使用してflush="ture"にしている場合に、<br />
カスタムタグ内でsendRedirectすると似たような例外が発生した記憶があったので、<br />
(レスポンスをコミットした状態[表示結果を一部でも返している状態]でリダイレクトしていたため)<br />
一瞬全然見当違いな調査をしてしまったのですが、Pageクラスのgetterの名前が正しくないだけでした。。(おつhatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-11902420343728673082010-10-07T15:13:00.001+09:002010-10-07T15:13:48.197+09:00javascript Window間オブジェクト操作の注意点window.openして子ウィンドウ側から親ウィンドウのselectboxの値を変更するコードを実行したところ<br />
「サーバによって例外が返されました」というわけわからないエラーが発生(サーバにアクセスしてないし)。。<br />
※テストブラウザはIE6<br />
<br />
<pre class="prettyprint">var option = new Option('xxxxx','xxxxx');
parentSelectObj.options[parentSelectObj.options.length] = option;
//↑ここで上記エラー</pre><br />
<br />
ふーむ、ネット調べたりオライリー本読み直してみたところ、<br />
・フレーム間、ウィンドウ間ではスコープチェーンが違う<br />
・関数が実行されるスコープは、関数を呼び出したフレームではなく関数が定義されたフレーム(ウィンドウもしかり)<br />
・コンストラクタも関数<br />
・コンストラクタとそのコンストラクタのプロトタイプオブジェクトは、ウィンドウごとに独立<br />
<br />
言われてみれば確かに。<br />
<br />
<br />
というわけで、コードを以下に修正したところ無事動作しました。<br />
<br />
<pre class="prettyprint">var option = window.opener.document.createElement('Option');
option.text = 'xxxxx';
option.value = 'xxxxx';
parentSelectObj.options[parentSelectObj.options.length] = option;</pre><br />
<br />
<br />
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-jp.amazon.co.jp/e/cm?lt1=_blank&bc1=FFFFFF&IS2=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=dekatotoro-22&o=9&p=8&l=as1&m=amazon&f=ifr&asins=4873113296" style="height: 240px; width: 120px;"></iframe>hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-85786745180013847692010-09-10T14:40:00.004+09:002010-09-12T23:14:39.328+09:00「Javaフレームワーク開発入門」を読んで 総評<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-jp.amazon.co.jp/e/cm?t=dekatotoro-22&o=9&p=8&l=as1&asins=4797353406&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=0000FF&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe><br />
<br />
読み終わりました。<br />
まず第一に、かなりの良本ですね。<br />
書籍の構成もちゃんとしているし、実装例もわかりやすい。<br />
<br />
読者対象としてはjavaの基本を一通り学んで、フレームワークを使った<br />
実践経験がある人ならかなり有用だと思います。<br />
フレームワークの中身ってどうなっているんだろうと興味をもった方が、<br />
OSSフレームワークのソースを読む前にも。<br />
<br />
WEBアプリケーション開発において非機能用件、横断的関心事というと、<br />
・エラー処理<br />
・メッセージ処理<br />
・ログ出力処理<br />
・DB処理(ORマップ、トランザクション、データソース管理、排他制御、自動採番)<br />
・ファイル管理処理<br />
・セキュリティ<br />
・帳票出力処理(PDF,CSV)<br />
・外部システム連携<br />
・バッチ制御処理<br />
・権限・ワークフロー(業務より)<br />
・メール<br />
・多言語対応<br />
・数値演算<br />
・日付時刻<br />
・文字コード<br />
・画面部品<br />
<br />
ぱっと思いつくだけで結構あるが、大規模アプリケーションなんかだと、<br />
フレームワークの上に共通基盤、その上に業務APをのせるといった<br />
構成の方が効率がよい。<br />
共通基盤を設計しようと思った場合に、インターフェース・拡張ポイント等<br />
迷うことが多々あると思うが、そういった共通基盤を作成する人なんかも<br />
良い指針になる本だと思います。<br />
<br />
また、リフレクションAPIを細かく解説していたり、<br />
デザインパターンをいくつか紹介しています。<br />
<br />
デザインパターンの説明は、Gofで紹介する23パターン全て<br />
ではなく、フレームワーク作りでよく使うパターンのみだが、<br />
どの本よりわかりやすく感じました。<br />
Adapterパターン、Proxyパターン、Decoratorパターンなんかは<br />
混同しやすいけど、その違いなんかも説明しています。<br />
<br />
説明しているデザインパターン<br />
・Template Methodパターン<br />
・Flyweightパターン<br />
・Factory Methodパターン<br />
・Decoratorパターン<br />
・Adapterパターン<br />
・Proxyパターン<br />
・Singletonパターン<br />
・Intercepting Filterパターン<br />
<br />
<br />
あとは、3人の登場人物が会話してプロジェクトを進めていくという、<br />
よく海外本にあるような遊び心ある構成が程よい息抜きによかったです。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-11569363698715846602010-09-09T18:31:00.003+09:002010-09-09T18:31:58.603+09:00「Javaフレームワーク開発入門」を読んで4<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-jp.amazon.co.jp/e/cm?t=dekatotoro-22&o=9&p=8&l=as1&asins=4797353406&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=0000FF&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe><br />
<br />
▼実装例で気になったイディオム<br />
<br />
例外をStringに変換するメソッド<br />
<pre class="prettyprint">public static String toString(Throwable t) {
StringWriter sw = new StringWriter();
t.printStackTrace(new PrintWriter(sw));
return sw.toString();
}</pre><br />
こんなインターフェースあるのね。いつもStackTraceElement[] traces = t.getStackTrace();してt.getCause()してループで回すなんて関数つくってた。hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-8077079950139420072010-09-07T17:44:00.006+09:002010-09-09T16:42:26.372+09:00「Javaフレームワーク開発入門」を読んで3<style type="text/css">
table {
border:solid 1px;
text-align:center;
padding:0px;
}
table tr {
margin:0px;
padding:0px;
}
table tr td {
margin:0px;
border:solid 1px;
text-align:center;
}
</style><br />
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-jp.amazon.co.jp/e/cm?t=dekatotoro-22&o=9&p=8&l=as1&asins=4797353406&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=0000FF&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe><br />
<br />
▼AOPのプロダクト比較<br />
<br />
・AOPのウィービング(インターセプタ組み込み)のタイミングはプロダクトによって違う<br />
<ul>
<li>AspectJ Compile-time weaving, load-time weaving</li>
<li>Seasar2 run-time weavng</li>
<li>SamuraiAOP load-time weaving</li>
</ul><br />
<br />
・ウィービングのタイミングによる考慮点<br />
<ul><li>Compile-time weaving</li>
・コンパイルするときにソースコードが必要なため、jarファイルのようなモジュールに対してはAOPの適用が難しい ・コードを変更するたびに特殊なコンパイルが必要
<li>run-time weaving</li>
・特定のAPIに依存する Seasar2の場合だとS2コンテナから取得したオブジェクトしかAOPがかからない S2Container、S2ContainerFactory等に依存 ・クラスが大量に生成される(permanent領域が足りなくなる可能性も)
<li>load-time weaving</li>
・VMオプションが必要→GAEのようなVMオプションを設定できない環境は厳しい </ul><br />
<br />
・言語の違い<br />
<ul>
<li>AspectJ Java, AspectJ言語</li>
<li>Seasar2 Java, XML</li>
<li>SamuraiAOP Java, XML</li>
</ul><br />
<br />
・ポイントカット指定の違い<br />
<ul>
<li>AspectJ アスペクトに定義</li>
<li>Seasar2 diconに定義</li>
<li>SamuraiAOP XMLに定義</li>
</ul><br />
<br />
・ジョインポイントの違い<br />
<table> <tbody>
<tr style="background-color: blue; color: white;"> <th>プロダクト</th> <th>インスタンスメソッド</th> <th>privateメソッド</th> <th>staticメソッド</th> <th>finalメソッド</th> <th>コンストラクタ</th> <th>フィールドアクセス</th> </tr>
<tr> <td>AspectJ</td> <td>○</td> <td>○</td> <td>○</td> <td>○</td> <td>○</td> <td>○</td> </tr>
<tr> <td>Seasar2</td> <td>○</td> <td>×</td> <td>×</td> <td>×</td> <td>×</td> <td>×</td> </tr>
<tr> <td>SamuraiAOP</td> <td>○</td> <td>○</td> <td>○</td> <td>○</td> <td>○</td> <td>×</td> </tr>
</tbody></table><br />
<br />
<br />
それぞれメリット・ディメリットがありますが、設定のしやすさ/学習コストは<br />
Seasar2→SamuraiAOP→AspectJ、機能面ではAspectJ→SamuraiAOP→Seasar2という印象。<br />
実際のプロジェクトではSeasar2のAOPしか使ったことないですが、<br />
privateにAOPをかけることはほとんどなかったので特に困らなかったです。<br />
DIコンテナを使用する場合は、それに付属するAOP機能を使用するのが無難な気がします。<br />
<br />
<br />
・AOPの標準化使仕様<br />
<br />
AOP Alliance(AOP共通アーキテクチャの作成/標準化団体)を利用しているプロダクト<br />
<br />
(org.aopalliance.interceptパッケージ)<br />
<br />
Seasar2, Spring, Guice, SamuraiAOP<br />
<br />
<br />
javaEEを利用しているプロダクト<br />
<br />
(javax.interceptorパッケージ)<br />
<br />
EJB3, Seam, SamuraiAOPhatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0tag:blogger.com,1999:blog-3463219137932660281.post-27252424374328895342010-09-07T17:29:00.004+09:002010-09-07T18:42:30.683+09:00「Javaフレームワーク開発入門」を読んで2<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-jp.amazon.co.jp/e/cm?t=dekatotoro-22&o=9&p=8&l=as1&asins=4797353406&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=0000FF&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe><br />
<br />
▼参照の種類<br />
java.util.WeakHashMapを利用すると、キーへの参照がなくなった場合、キャッシュしていたオブジェクトはGCによって改修される。<br />
<br />
参照の種類<br />
<pre class="prettyprint">・弱参照 java.lang.ref.WeakReference GCが起きるとほぼ必ず切れる参照
・ソフト参照 java.lang.ref.SoftReference ヒープ領域が足りなくなると切れる参照
・ファントム参照 java.lang.ref.PhantomReference あるオブジェクトがいつGCされたのかを知りたいときに使う参照
・強参照 通常の参照</pre><br />
<br />
<br />
ここが参考になりますね。「Javaのメモリ管理」<br />
<a href="http://blogs.wankuma.com/nagise/archive/2007/07/29/87593.aspx">http://blogs.wankuma.com/nagise/archive/2007/07/29/87593.aspx</a>hatohttp://www.blogger.com/profile/10193319281129674491noreply@blogger.com0