api 통신 ajax 스크립트 에러를 못찾겠습니다. - 원본소스 공개
본문
최소한 필요한 코드만 첨부했습니다.
테스트 할수있는 주소입니다.
http://lsp80.cafe24.com/2.html
꼭 해결하고싶습니다.
로그인 계정/ 비번 : lsp골뱅이nate.com/1234 ( 골뱅이 -> @)
로그인정보를 틀리게 했을경우 에러발생!!
성공와 실패시 포스트맨으로 테스트했던 내용 첨부합니다.
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<form name="login" method="post" >
<table align="center" cellpadding="0" cellspacing="0" border="0">
<tr><td height="4"></td></tr>
<tr>
<td bgcolor="ffffff"><input type="text" name="mid" id="identifier" tabindex="1" value="*** 개인정보보호를 위한 이메일주소 노출방지 ***" maxlength="50" style="font:9pt 굴림; line-height:120%; background-color:#ffffff; color:#555555; border:1px solid #cccccc; height:22px; padding:3px 3px 0px 3px; "></td>
<td rowspan="2" width="4"></td>
<td rowspan="2"><a href="javascript:login_app();">로그인</a></td>
</tr>
<tr>
<td bgcolor="ffffff"><input type="password" name="passwd" id="password" style="width:105px;height:22px" class="login_pw" maxlength="50" tabindex="2" ></td>
</tr>
</table>
</form>
<script>
function login_app()
{
$.ajax({
url: "https://api.flextalk.co.kr/auth/local",
type: "POST",
dataType: 'json',
data: {
identifier: $("#identifier").val(),
password: $("#password").val(),
},
success: function(data) {
alert('성공--' + data['user']['username']);
console.log(data);
} ,
error : function(){
alert("AJAX Failed!");
}
});
}
</script>
답변 1
잘 됩니다. 지금 자꾸 크롬 콘솔에서 빨간 글씨로 에러가 나는 것을 체크하시는데
원래 거기는 http 에러가 나면 브라우저가 자동으로 표시해줍니다.
스크립트에서 제어하는게 아닙니다.
(감추고 싶으면 그냥 디버그 창의 설정을 바꾸심 됨. hide network 체크하심 됩니다.)
일반적으로 서버 api는 http 200이면 정상으로 판단하고 그 다음 들어온 값이 정확한지 판단한 후
http 200 -> 성공/실패를 주는데
이 api는 특이하게 실패시 그냥 http 400을 주는 것 같습니다.
따라서 그냥 error: function 부분에서 status 를 받아 400 이면 로그인 실패 처리를 하시면
될것 같습니다.
대충 아래와 같습니다.
function login_app() {
$.ajax({
url: "https://api.flextalk.co.kr/auth/local",
type: "POST",
dataType: "json",
data: {
identifier: "*** 개인정보보호를 위한 이메일주소 노출방지 ***",
password: "123456",
},
success: function(data) {
alert("성공--" + data['user']['username']);
console.log(data);
},
error: function(err) {
if(err.status == 400) {
var err_data = JSON.parse(err.responseText);
console.log(err_data);
console.log(err_data.data[0]['messages'][0]['id']);
console.log(err_data.data[0]['messages'][0]['message']);
alert("실패--" + err_data.data[0]['messages'][0]['message']);
} else {
console.log(err);
}
}
});
}
몰랐던 내용입니다.
정말감사합니다. 크롬 콘솔창에 빨간글씨때문에 계속 오류로 생각하고 있었습니다.
알려주신 코드는 제가 정확히 찾던부분입니다.
이건 또다른 문제인데..
ajax 자체가 익스 8~9 환경에서 동작하지 않더군요..
axios 로 대체하는 방안을 찾고있습니다.
다시한번 감사합니다.
답변을 작성하시기 전에 로그인 해주세요.
