Javascript-Tomcat header size 제한 설정

Content_TopTitle-JavaScript

 

 

요즘 나름 대용량 데이터(binary, JSON)를 클라이언트에서 제어하는 일련의 프로젝트를 진행 중인데..

 

 

클라이언트에서도 이 큰 데이터로 인해 문제가 생겨 며칠 전 해결 했지만 …(이전 포스트 참고: javascript memory leak = http://devbada.tistory.com/317)

 

오늘은 클라이언트에서 서버로 전송할 때 큰 데이터가 전송이 되지 않는 문제를 발견하였습니다.

 

원인은 서버에 제한된 HTTP Header POST size!!!!!

 

 

Tomcat 에서는 server.xml 의 Connector 항목에 아래와 같이 maxPostSize 를 추가하시면 됩니다.

 

<Connector connectionTimeout="20000" port="8080" protocol="HTTP/1.1" redirectPort="8443" maxPostSize="0" />

 

그리고 eclipse 에서는 추가한 서버의 server.xml 에 아래와 같이 maxPostSize 를 추가하시면 됩니다.

<Connector connectionTimeout="20000" port="8080" protocol="HTTP/1.1" redirectPort="8443" maxPostSize="0" />

 

 

값 “0”의 의미는 제한을 주지 않는다라는 이야기입니다.

 

 

자세한 Spec 은 아래의 사이트에서 참고하세요 ^..^*

http://tomcat.apache.org/tomcat-5.5-doc/config/http.html

JavaScript-Memory leak 해결하기, 메모리 누수 해결하기

Content_TopTitle-JavaScript

 

 

JavaScript-jQueryUi-Slider 의 Handler 를 여러 개 생성하기

Content_TopTitle-JavaScript

 

 

* 사용에 필요한 라이브러리

    • jQuery Library
    • jQuery Ui Library

 

jQuery UI 에서 Slider 를 사용하는데, 기본적으로 제공되는 slider handler 는 1개 이지만, 이를 여러 개 생성하여 사용할 수 있습니다.

 

<div id="slider"></div>

Html 에 위와 같이 slider 를 하나 만들고 아래와 같이 스크립트를 작성해서 사용할 수 있습니다.

 

 

$(function () {
    // the code belows assume the colors array is exactly one element bigger than the handlers array.
    var handlers = [25, 50, 75];
    var colors = ["#ff0000", "#00ff00", "#0000ff", "#00ffff"];
    updateColors(handlers);
    
    $("#slider").slider({
        min: 0,
        max: 100,
        values: handlers,
        slide: function (evt, ui) {
            updateColors(ui.values);
        }
    });
    
    function updateColors(values) {
        var colorstops = colors[0] + ", "; // start left with the first color
            for (var i=0; i< values.length; i++) {
                colorstops += colors[i] + " " + values[i] + "%,";
                colorstops += colors[i+1] + " " + values[i] + "%,";
            }
            // end with the last color to the right
            colorstops += colors[colors.length-1];
            
            /* Safari 5.1, Chrome 10+ */
            var css = '-webkit-linear-gradient(left,' + colorstops + ')';
            $('#slider').css('background-image', css);
    }
});

 

 

위의 소스를 사용한 예제 > http://jsfiddle.net/LLfWd/60/

JavaScript-User Agent 리스트 / 디바이스별 미디어 쿼리 / 모바일 기기 체크 자바스크립트 코드

Content_TopTitle-JavaScript

 

 

--UserAgent 리스트
http://user-agents.org/
 
--디바이스별 미디어쿼리
http://www.stuffandnonsense.co.uk/blog/about/hardboiled_css3_media_queries/
 
--모바일기기 체크
<script type="text/javascript">
var UserAgent = navigator.userAgent;
 
if (UserAgent.match(/iPhone|iPod|Android|Windows CE|BlackBerry|Symbian|Windows Phone|webOS|Opera Mini|Opera Mobi|POLARIS|IEMobile|lgtelecom|nokia|SonyEricsson/i) != null || UserAgent.match(/LG|SAMSUNG|Samsung/) != null)
{
  location.href = "/mobile/index.html";
}
else
{
 alert("Web");
}
</script>

 

 

http://blog.naver.com/PostView.nhn?blogId=nowwarfare&logNo=140127178015

[출처] [JavaScript] User Agent 리스트 / 디바이스별 미디어 쿼리 / 모바일 기기 체크 자바스크립트 코드|작성자 제무

JavaScript-Array to JSON 변환하기

Content_TopTitle-JavaScript

 

JavaScript 에서 아래와 같은 Array 형식의 데이터를 JSON 으로 변환할 수 있습니다.

 

[1]. JSON.stringify() 를 사용하기 위해서 아래의 라이브러리를 사용합니다.

>>> https://github.com/douglascrockford/JSON-js/blob/master/json2.js

[2]. 그리고 아래와 같이 사용할 수 있습니다.

 

var yourArray = {
    url: "http://www.google.com",
    realWidth: 60,
    realHeight: 80,
    realVCm: 20,
    realHCm: 15
};
var myJsonString = JSON.stringify(yourArray);

 

 

[3]. 또한 변환한 JSON 데이터는 jQuery 라이브러리를 사용하여 아래와 같이 Array 유형으로 변환할 수 있습니다.

 

var yourJSONString = "{\"url\":\"/http://www.google.com/\",\"realWidth\":60,\"realHeight\":80,\"realVCm\":20,\"realHCm\":15}"; 

var parsedJSONString = $.parseJSON(yourJSONString); 
|  1  |  2  |  3  |  4  |  5  |  6  |