가카리의 공부방

Chrome Hack: AJAX Cross-domain Hack Windows: 단축아이콘에 대상에 --disable-web-security 추가 OSX:open -b com.google.chrome --args --disable-web-security 버전에 따라 작동이 다를 수 있음. 출처 : http://egloos.zum.com/spectrum/v/5578302

jax를 사용하다보면 외부 서버에 요청을 할 경우가 있다. 외부서버에 ajax호출을 하면 크로스 도메인 문제가 생긴다. 해결하는 방법은 아래와 같다. Proxy Server 이용 클라이언트에서 로컬서버로 호출 후 로컬서버에서 외부서버로 호출 하는 방식이다. 스크립트로 호출 서버쪽 언어로 데이터 처리를 하고 스크립트로 응답한다. 클라이언트는 해당 파일을 스크립트로 로드하여 사용한다. response시 도메인 허용 response header에 Access-Control-Allow-Origin속성을 추가하여 해당 도메인은 크로스도메인에 걸리지 않게 한다. 예)node.js 에 express사용할 경우 app.use(function(req, res, next) { res.header("Access-Contro..

jQuery.ajax (options) HTTP 통신에서 페이지를로드합니다. 이 함수는 jQuery의 AJAX 통신의 기본 부분에서 실제로 $. get및 $. post 같은 함수를 사용하는 것이 쉽게 구현할 수 있습니다. 그러나 이러한 추상화된 함수는 구현의 용이성과 교환에 오류시 콜백과 같은 복잡한 기능을 잃고 있습니다. 그런 처리를 구현하려면, 역시 핵심이다이 함수를 사용해야합니다. $. ajax 함수는 반환값으로 XMLHttpRequest 객체를 반환합니다. 대부분의 경우이 개체를 직접 조작하는 것은 없다고 생각되지만, 예를 들어 던져 버린 요청을 중단하는 경우 등, 필요하면 이용하십시오. 이 함수는 인수를 하나만 취하지만, 실제로는 해시에서 키 - 값 조합은 많은 옵션을받습니다. 다음에 그 목록을..

클라이언트 소스(브라우저) 1 2 3 4 5 6 7 8 9 $.ajax({ url : "192.168.48.123/api/client", type : "POST", cache : false, dataType:"json", success: function(data) { console.log(data); }, }); 오류메세지 XMLHttpRequest cannot load http://192.168.48.123/api/client. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '192.168.48.456' is therefore not allowed access. 해결방법(서버 Node.js 소스 수..

jquery UI Effect 플러그인을 다운 http://jqueryui.com 에서 download에서 받을 수 있습니다. 기본적으로 addClass메소드로 애니메이션을 추가하고 removeClass메소드로 애니메이션을 삭제 할 수 있습니다. 이를 사용하기 위해서는 과 이부분을 추가해줘야 플러그인을 사용할 수 있습니다. 소스 DOCTYPE html> .reverse{ color: white; background-color: black; } $(document).ready(function(){ $('div').hover(function(){ $(this).addClass('reverse', 1000); }, function(){ $(this).removeClass('reverse', 1000); });..

애니메이션를 지연하고 싶다면 delay 메소드를 이용하면 됩니다. 사용 방법은 소스를 보시면 바로 알 수 있습니다.(첫번째 파라미터가 delay 되는 시간 ms단위) 아래 소스중 each 메소드는 요소만큼 반복하는 메소드입니다. 각 인덱스는 index 파라미터에 의해서 알수있구요. 소스 DOCTYPE html> div{ width: 100px; height: 100px; background-color: orange; position: relative; } $(document).ready(function(){ $('div').each(function (index){ //(index * 500)초 후 animate() 메서드를 실행합니다. $(this).delay(index * 500).animate({ l..

문서 객체 모델(DOM, Document Object Model)은 document 객체와 관련된 객체의 집합입니다. 문서 객체 모델을 사용하면 HTML 페이지에 태그를 추가 수정 제거 할 수 있습니다. 다음은 이 문서 객체 모델을 이용한 글자들의 움직임을 만든 예제입니다. DOCTYPE html> Insert title here //랜덤한 정수를 생성 function nextRandomInteger(limit){ return Math.round(Math.random() * limit); } //랜덤한 알파벳을 리턴 var alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; function randomAlphabet(){ return alphabet.charAt(nextRandomI..