Spring-Security メモ
いつも SpringSecurityの Filter に何が適用されているか忘れるので備忘録
(Semantic-UI) GoogleMap挿入の仕方
GoogleMap定義
ここはいつも通り
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> <script> $(document).ready(function() { var latlng = new google.maps.LatLng(35.68121300000001, 139.767294); var myOptions = { zoom: 17, center: latlng }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); marker = new google.maps.Marker({ position: latlng, map: map }); }); </script>
Semantic-UI ui embed を使う
<div class="ui vertical stripe segment" id="access"> <div class="ui middle aligned stackable container"> <div class="ui text container"> <h3 class="ui header centered"> <p>ACCESS</p> </h3> </div> <div class="ui embed" id="map_canvas"> </div> </div> </div>
たぶん使い方違うんだろうけどなぁ。。。 semantic-ui.com
ページ内リンクのスクロール方法
Javascript
<script>
$(document).ready(function() {
// #で始まるアンカーをクリックした場合に処理
$('a[href^="#"]').click(function() {
// スクロールの速度
var speed = 1000; // ミリ秒
// アンカーの値取得
var href= $(this).attr("href");
// 移動先を取得
var target = $(href == "#" || href == "" ? 'html' : href);
// 移動先を数値で取得
var position = target.offset().top;
// スムーススクロール
$('body,html').animate({scrollTop:position}, speed, 'swing');
return false;
});
});
</script>
href=“#” は除外したい場合は、下記に置き換える
$('a[href*="#"]:not([href="#"]')
(Semantic-UI) 背景画像を固定にする
CSS
.masthead {
background-image: url("./img/bg.jpg") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
background-attachment: fixed !important;
}
大事なのは、「!important」をつけてスタイルを優先させること
TERASOLUNA による初期構築
概要
TERASOLUNA 使って開発しようとしたときにいつも忘れるので備忘録
TERASOLUNAって？
NTT DATAさんがつくってる spring fw のライブラリ群
ガイドラインもしっかり作ってるので参考にしてます。
terasolunaorg.github.io
mybatis の genrator-plugin とがないのでその辺はいつもの自前のものを流用
初期構築
こんな感じの bat ファイルでさくっと作成
cd %~dp0
mvn archetype:generate -DinteractiveMode=false ^
-DgroupId=sample.group ^
-DartifactId=sample ^
-Dversion=1.0.0-SNAPSHOT ^
-Dpackage=sample.package ^
-DarchetypeGroupId=org.terasoluna.gfw.blank ^
-DarchetypeArtifactId=terasoluna-gfw-multi-web-blank-mybatis3-archetype ^
-DarchetypeVersion=5.0.1.RELEASE
追加項目
pom.xml
pom.xml に spring-session追加して、kvs とかでセッション管理。
kvsが使えないときは自前で拡張したDBセッションとかで管理
<dependency> <groupId>org.springframework.session</groupId> <artifactId>spring-session</artifactId> <version>1.0.2.RELEASE</version> </dependency>
web.xml
session とか、listenerとかよしなに追加
<listener> <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class> <listener-class>org.terasoluna.gfw.web.logging.HttpSessionEventLoggingListener</listener-class> <listener-class>org.springframework.web.context.request.RequestContextListener</listener-class> </listener> <context-param> <param-name>contextConfigLocation</param-name> <!-- Root ApplicationContext --> <param-value> classpath*:META-INF/spring/applicationContext.xml classpath*:META-INF/spring/spring-security.xml classpath*:META-INF/spring/spring-session.xml </param-value> </context-param> <filter> <filter-name>requestContextFilter</filter-name> <filter-class>org.springframework.web.filter.RequestContextFilter</filter-class> </filter> <filter-mapping> <filter-name>requestContextFilter</filter-name> <url-pattern>/*</url-pattern> </filter-mapping> <filter> <filter-name>springSessionRepositoryFilter</filter-name> <filter-class>org.springframework.web.filter.DelegatingFilterProxy</filter-class> </filter> <filter-mapping> <filter-name>springSessionRepositoryFilter</filter-name> <url-pattern>/*</url-pattern> </filter-mapping> <filter> <filter-name>springSecurityFilterChain</filter-name> <filter-class>org.springframework.web.filter.DelegatingFilterProxy</filter-class> </filter> <filter-mapping> <filter-name>springSecurityFilterChain</filter-name> <url-pattern>/*</url-pattern> </filter-mapping>
あとは、特に考えなくても動いてくれる。
spring websocket による画像データ送信
概要
spring websocket でチャット中で画像送信しようとして、バイナリ送信はあきらめていろいろがんばったこと
client side
var file = document.querySelector('input[type="file"]').files[0]; var reader = new FileReader(); reader.onload = function(event){ var loadedImageUri = event.target.result; stompClient.send("/app/room/" + varroomId, {}, JSON.stringify({'imgData': loadedImageUri})); }; reader.readAsDataURL(file);
server side
下記でデータをbyteに変換して画像として保存する
String[] strs = message.getImgData().split(","); byte[] binaryData = Base64.getDecoder().decode(strs[1]);
spring settings
websocket で connection を確立させた後なのでメッセージサイズなどは apache, tomcat をいじっても反映されないので
websocket:transport でサイズを指定する必要がある。
※要検討箇所
<websocket:message-broker application-destination-prefix="/app" > <websocket:transport message-size="2097152" send-buffer-size="2097152"></websocket:transport> <websocket:stomp-endpoint path="/endpoint" > </websocket:stomp-endpoint> <websocket:simple-broker prefix="/topic,/room" /> </websocket:message-broker>
これでなんとか、データの送信はできた。
後は、クライアントに返す際に保存したパスを返却するかサイズが小さな画像のやりとしかないのなら
data:image/png;base64 など、Base64かけたもので返却するとよいかな
