CI 묻고 답하기

제목 책에 ajax 예제 왜 작동이안되는지좀 봐주세요.(수정2)
글쓴이 해행행 작성시각 2016/01/18 14:53:13
댓글 : 8 추천 : 0 스크랩 : 0 조회수 : 13921   RSS 
httpRequest.js 파일

function getXMLHttpRequest() {
    if (window.ActiveXObject) {
        try {
            return new ActiveXObject("Msxml2.XMLHTTP");
        } catch(e) {
            try {
                return new ActiveXObject("Microsoft.XMLHTTP");
            } catch(e1) { return null; }
        }
    } else if (window.XMLHttpRequest) {
        return new XMLHttpRequest();
    } else {
        return null;
    }
}
var httpRequest = null;

function sendRequest(url, params, callback, method) {
    httpRequest = getXMLHttpRequest();
    var httpMethod = method ? method : 'GET';
    if (httpMethod != 'GET' && httpMethod != 'POST') {
        httpMethod = 'GET';
    }
    var httpParams = (params == null || params == '') ? null : params;
    var httpUrl = url;
    if (httpMethod == 'GET' && httpParams != null) {
        httpUrl = httpUrl + "?" + httpParams;
    }
    httpRequest.open(httpMethod, httpUrl, true);
    httpRequest.setRequestHeader(
        'Content-Type', 'application/x-www-form-urlencoded');
    httpRequest.onreadystatechange = callback;
    httpRequest.send(httpMethod == 'POST' ? httpParams : null);
}

 

test_v.php (views 에 위치)

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<title></title>
	<script type="text/javascript" src="/raw_doc/jquery-1.11.2.js"></script>
	<script type="text/javascript" src="/raw_doc/httpRequest.js"></script>	<!-- httpRequest.js 파일 불러옴 -->
	<script type="text/javascript">
		function server_request(){																//전송버튼 클릭시 실행되는 함수
// 			var csrf_token = getCookie('csrf_cookie_name');								//$config['csrf_protection']가 false면 불필요
			var name = "name="+encodeURIComponent	(document.ajax_test.names.value);
// 			+"&csrf_test_name="+csrf_token;													//XMLHttpRequest 객체에 전달할 데이터를 만듬 데이터는 쿼리스프링 박식으로 만듬
		
			sendRequest("ajax_board/ajax_action", name, callback_hello, "POST");		//js파일 안의 함수. XMLHttpRequest 객체를 사용하여 지정한 URL, 첨부할
		}																											//파라미터, 지정한 전송 방식으로 웹서버에 요청
		
		function callback_hello(){																//웹서버로부터 도착한 응답결과 처리하는 콜백함수
			if(httpRequest.readyState == 4){
				if(httpRequest.status==200){
					var contents = document.getElementByid("contents");
					contents.innerHTML = httpRequest.responseText;
				}
			}
		}
		
		function getCookie(name){
			var nameOfCookie = name + "=";
			var x = 0;
		
			while ( x <= document.cookie.length ){
				var y = ( x + nameOfCookie.length);
		
				if (document.cookie.substring(x, y) == nameOfCookie ){
					if((endOfCookie = document.cookie.indexOf(";", y)) ==-1)
						endOfCookie = document.cookie.length;
						return unescape(document.cookie.substring(y, endOfCookie));
				}
				x = document.cookie.indexOf("", x) +1;
				if(x == 0)
					break;
			}
			return "";
		}
	
	</script>
<body>
<div id="main">
<form method="post" name="ajax_test">
<label>이름</label>
<div>
<input type="text" name="names" value="웅파"/>
</div>

<div>
<input type="button" onclick="server_request()" value="전송">
</div>
</form>
	
<div id="contents"></div>
</div>
</body>
</head>
</html>

 

ajax_board.php (controllers 에 위치)

 

load->view('test_v');
	}
	
	public function ajax_action(){
		echo 'meta http-equiv="Content-Type" content="text/html; charset=utf-8" />';
		
		$name = $this->input->post("name");
		
		echo $name."님 반갑습니다!";
		
	}
}

 

config/config.php (설정)

 

$config['csrf_protection'] = FALSE;
$config['csrf_token_name'] = 'csrf_test_name';
$config['csrf_cookie_name'] = 'csrf_cookie_name';
$config['csrf_expire'] = 7200;
$config['csrf_regenerate'] = TRUE;
$config['csrf_exclude_uris'] = array();

 

 

에러는

이렇게 뜹니다... 같은페이지에 여러번 이렇게 글을써서 죄송합니다.

 

부탁드리겠씁니다.
 다음글 세션유지 시간이 불규칙합니다. (2)
 이전글 foreach 관련 질문입니다 (5)
목록

댓글

닉 / 2016/01/18 15:51:08 / 추천 0

@해행행

요청하는 주소가 404네요. ajax_board가 2번써져서일거같은데요?
해행행 / 2016/01/18 15:55:43 / 추천 0

@닉

어디쪽에 말씀이신지 알수있을까요? 테스트쪽 sendRequest 쪽이에요?
해행행 / 2016/01/18 15:59:05 / 추천 0

@닉

oh우우 감사합니다 다음에러만났지만 차근차근해보겠습니다
해행행 / 2016/01/18 16:32:51 / 추천 0

@닉 

잡고나니 정말 어이없는 에러였네요 ㅜㅜ

 

덕분에 해결했습니다
닉 / 2016/01/18 16:41:19 / 추천 0

@해행행

ㅎㅎ 즐프요~
닉 / 2016/01/18 16:54:48 / 추천 0

@해행행

알고 계셔야 할 팁!! ajax 폼검증은 서버 자원을 사용합니다.

웹브라우저에서 js로 폼검증 후에 서버 요청을 하셔야 좀더 서버자원을 적게 쓰게 됩니다.

 
kaido / 2016/01/19 09:05:54 / 추천 0

@닉

 

사실은 2곳 전부 하는게 맞습니다.

js 에서 1차로 검증하고 2차로 폼검증을 서버에서도 해야합니다.

js 폼검증은 얼마든지 위변조 해서 통과 시킬수 있습니다.

 

정작 이렇게 말하는 저도 시간 관계상 2개다 안 합니다 핫핫;
변종원(웅파) / 2016/01/19 10:38:59 / 추천 0

중요도에 따라 2군데 모두 처리하는 곳이 있고 한군데서만 처리하는게 있는데

요즘 거의 api쪽이다 보니 서버단에서 항상 체크를 하다보니 앞쪽은 당연히 체크합니다. ㅎㅎㅎ

서버에서 없으면 error 를 리턴하니 프론트단은 당연히 체크를...

 

웹페이지 개발이 분리된 형태라...(서버는 php api, 프론트는 html5, css, javascript, ajax)