본문 바로가기
(Before)BitSchool

2014/06/16 AJAX - JSON사용 서버와의 통신,AJAX 서버/클라이언트,서버에서 오라클하기,ajax계산기

k_brown 2014. 6. 16. 16:20
반응형


AJAX를 이용한 서버와의 통신(JSON 사용)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
package ajax.web;
 
import java.io.IOException;
import java.io.PrintWriter;
 
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
import org.json.simple.JSONObject;
 
 
public class SimpleJSONAjaxServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;
       
    
    protected void doGet(HttpServletRequest request, HttpServletResponse response) 
            throws ServletException, IOException {
        JSONObject jsonObject = new JSONObject();
        jsonObject.put("message","Hi, Simple JSON Ajax Client");
        
        response.setCharacterEncoding("UTF-8");
        response.setContentType("applicaton/json;charset=UTF-8");
        PrintWriter out = response.getWriter();
        out.print(jsonObject);
        
    }
 
    
    protected void doPost(HttpServletRequest request, HttpServletResponse response) 
            throws ServletException, IOException {
        doGet(request,response);
    }
 
}
 


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xmlns="http://java.sun.com/xml/ns/javaee" 
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
  <display-name>AjaxExample</display-name>
  <servlet>
    <servlet-name>SimpleAjaxServlet</servlet-name>
    <servlet-class>ajax.web.SimpleAjaxServlet</servlet-class>
  </servlet>
  <servlet>
    <servlet-name>SimpleXMLAjaxServlet</servlet-name>
    <servlet-class>ajax.web.SimpleXMLAjaxServlet</servlet-class>
  </servlet>
  <servlet>
      <servlet-name>SimpleJSONAjaxServlet</servlet-name>
      <servlet-class>ajax.web.SimpleJSONAjaxServlet</servlet-class>
  </servlet>
  
  
  <servlet-mapping>
    <servlet-name>SimpleAjaxServlet</servlet-name>
    <url-pattern>/SimpleAjaxServlet</url-pattern>
  </servlet-mapping>
  <servlet-mapping>
    <servlet-name>SimpleXMLAjaxServlet</servlet-name>
    <url-pattern>/SimpleXMLAjaxServlet</url-pattern>
  </servlet-mapping>
  <servlet-mapping>
      <servlet-name>SimpleJSONAjaxServlet</servlet-name>
      <url-pattern>/SimpleJSONAjaxServlet</url-pattern>
  </servlet-mapping>
</web-app>


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<script type="text/javascript">
    function getXMLHttpRequest(){
        if(window.ActiveXObject){
            //win e4, e5,e6용
            try{
                return new ActiveXObject("Msxml2.XMLHTTP");
            }catch(e){
                try{
                    return new ActiveXObject("Microsoft.XMLHTTP");
                }catch(e2){
                    return null;
                }
            }
        }else if(window.XMLHttpRequest){
            // win Mac Linux m1, f1, o8 Mac s1 Linux k3용
            return new XMLHttpRequest();
        }else{
            return null;
        }
    }
    
    var xmlHttpRequest = getXMLHttpRequest();
    
    function responseAjax(){
        if(xmlHttpRequest.readyState==4){
            if(xmlHttpRequest.status==200){
                eval("var jsonObj = "+xmlHttpRequest.responseText);
                var messageElement = document.getElementById("message");
                messageElement.innerHTML = "The server said : "+jsonObj.message;
            }
        }
    }
    
    function sendRequest(){
        var url = "http://localhost:9090/AjaxExample/SimpleJSONAjaxServlet";
        
        xmlHttpRequest.open("GET",url,true);
        xmlHttpRequest.onreadystatechange = responseAjax;
        xmlHttpRequest.send(null);
    }
</script>
</head>
<body>
<form>
    <input type="button" value="서버로부터 JSON문서를 수신" onClick="sendRequest()">
</form>
<p id="message"></p>
 
</body>
</html>



AJAX를 이용한 Echo 서버/클라이언트 통신(JSON사용)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
package ajax.web;
 
import java.io.IOException;
import java.io.PrintWriter;
import java.net.URLDecoder;
 
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
import org.json.simple.JSONObject;
 
public class SimpleEchoAjaxServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;
 
    protected void doGet(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        
        String data = request.getParameter("data");
        if (data == null || data.trim().length()==0) {
            data = "전달된  Echo 메시지가 없습니다.";
        } else {
            data = new String(data.getBytes("8859_1"), "UTF-8"); // 한글이 깨진다면 삭제를 해도된다.
            data = URLDecoder.decode(data, "UTF-8");
 
        }
 
        JSONObject jsonObject = new JSONObject();
        jsonObject.put("message", data);
 
        try {
            Thread.sleep(3000);
        } catch (InterruptedException e) {
            e.printStackTrace();
        }
 
        response.setCharacterEncoding("utf-8");
        response.setContentType("applicaton/json;charset=UTF-8");
        PrintWriter out = response.getWriter();
        out.print(jsonObject);
    }
 
    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
     *      response)
     */
    protected void doPost(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        
        doGet(request, response);
    }
 
}
 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
  <display-name>AjaxExample</display-name>
  <servlet>
    <servlet-name>SimpleAjaxServlet</servlet-name>
    <servlet-class>ajax.web.SimpleAjaxServlet</servlet-class>
  </servlet>
  <servlet>
    <servlet-name>SimpleXMLAjaxServlet</servlet-name>
    <servlet-class>ajax.web.SimpleXMLAjaxServlet</servlet-class>
  </servlet>
  <servlet>
    <servlet-name>SimpleJSONAjaxServlet</servlet-name>
    <servlet-class>ajax.web.SimpleJSONAjaxServlet</servlet-class>
  </servlet>
  <servlet>
      <servlet-name>SimpleEchoAjaxServlet</servlet-name>
      <servlet-class>ajax.web.SimpleEchoAjaxServlet</servlet-class>
  </servlet>
  
  <servlet-mapping>
    <servlet-name>SimpleAjaxServlet</servlet-name>
    <url-pattern>/SimpleAjaxServlet</url-pattern>
  </servlet-mapping>
  <servlet-mapping>
    <servlet-name>SimpleXMLAjaxServlet</servlet-name>
    <url-pattern>/SimpleXMLAjaxServlet</url-pattern>
  </servlet-mapping>
  <servlet-mapping>
    <servlet-name>SimpleJSONAjaxServlet</servlet-name>
    <url-pattern>/SimpleJSONAjaxServlet</url-pattern>
  </servlet-mapping>
  <servlet-mapping>
      <servlet-name>SimpleEchoAjaxServlet</servlet-name>
      <url-pattern>/SimpleEchoAjaxServlet</url-pattern>
  </servlet-mapping>
</web-app>


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<script type="text/javascript">
    function getXMLHttpRequest() {
        if (window.ActiveXObject) {
            try {
                return new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    return new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e2) {
                    return null;
                }
            }
        } else if (window.XMLHttpRequest) {
            return new XMLHttpRequest();
        } else {
            return null;
        }
    }
 
    var xmlHttpRequest = getXMLHttpRequest();
 
    function responseAjax() {
        if (xmlHttpRequest.readyState == 4) {
            if (xmlHttpRequest.status == 200) {
                var sendButtonElement = document.getElementById("send_button");
                sendButtonElement.removeAttribute("disabled");
                var spinnerElement = document.getElementById("spinner");
                spinnerElement.setAttribute("style", "display:none");
 
                eval("var jsonObj = " + xmlHttpRequest.responseText);
 
                var messageElement = document.getElementById("message");
                messageElement.innerHTML = "The server said: "
                        + jsonObj.message;
            }
        }
    }
 
    function sendRequest() {
        var sendButtonElement = document.getElementById("send_button");
        sendButtonElement.setAttribute("disabled", true);
        var spinnerElement = document.getElementById("spinner");
        spinnerElement.setAttribute("style", "display:inline");
 
        var url = "http://localhost:9090/AjaxExample/SimpleEchoAjaxServlet";
 
        var echoMessage = document.getElementById("echo_message").value;
        url += "?data=" + encodeURIComponent(echoMessage);
 
        xmlHttpRequest.open("GET", url, true);
        xmlHttpRequest.onreadystatechange = responseAjax;
        xmlHttpRequest.send(null);
    }
</script>
</head>
<body>
    <form>
        <input id="echo_message" type="text" value="전송할 Echo 메시지를 입력하세요."
            style="width: 150px"> <br> <input id="send_button"
            type="button" value="서버로 Echo 메시지를 전송" onclick="sendRequest()">
        <img id="spinner"
            src="/AjaxExample/imgs/ajaxSpinner.gif"
            width="15px" height="15px" style="display: none" />
    </form>
 
    <p id="message"></p>
</body>
</html>



3초후




계산기 만들기

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
package ajax.web;
 
import java.io.IOException;
import java.io.PrintWriter;
import java.net.URLDecoder;
 
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
import org.json.simple.JSONObject;
 
public class SimpleEchoAjaxServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;
 
    protected void doGet(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        
        String data = request.getParameter("data");
        PrintWriter out = response.getWriter();
        response.setCharacterEncoding("utf-8");
        response.setContentType("applicaton/json;charset=UTF-8");
        
        if (data == null || data.trim().length()==0) {
            data = "전달된  Echo 메시지가 없습니다.";
        }else {
            data = new String(data.getBytes("8859_1"), "UTF-8"); // 한글이 깨진다면 삭제를 해도된다.
            //data = URLDecoder.decode(data, "UTF-8");
        }
 
        
 
        try {
            Thread.sleep(100);
        } catch (InterruptedException e) {
            e.printStackTrace();
        }
 
        
        
        //if((49<=data.charAt(0)|| data.charAt(0)>=58)){
            for(int i=0;i<data.length();i++){
                if(data.charAt(i)=='+'){ 
                    String[] array = data.split("\\+");
                    int a = Integer.parseInt(array[0]);
                    int b = Integer.parseInt(array[1]);
                    int p = a+b;
                    
                    JSONObject jsonObject = new JSONObject();
                    jsonObject.put("message", p);
                    out.print(jsonObject);
                }else if(data.charAt(i)=='-'){ 
                    String[] array = data.split("\\-");
                    int a = Integer.parseInt(array[0]);
                    int b = Integer.parseInt(array[1]);
                    int p = a-b;
                    
                    JSONObject jsonObject = new JSONObject();
                    jsonObject.put("message", p);
                    out.print(jsonObject);
                    
                }else if(data.charAt(i)=='*'){ 
                    String[] array = data.split("\\*");
                    int a = Integer.parseInt(array[0]);
                    int b = Integer.parseInt(array[1]);
                    int p = a*b;
                    
                    JSONObject jsonObject = new JSONObject();
                    jsonObject.put("message", p);
                    out.print(jsonObject);
                }else if(data.charAt(i)=='/'){ 
                    String[] array = data.split("\\/");
                    int a = Integer.parseInt(array[0]);
                    int b = Integer.parseInt(array[1]);
                    int p = a/b;
                    
                    JSONObject jsonObject = new JSONObject();
                    jsonObject.put("message", p);
                    out.print(jsonObject);
                }
            }
        /*}else if((97<=data.charAt(0)|| data.charAt(0)>=122)||(65<=data.charAt(0)|| data.charAt(0)>=90)){
            JSONObject jsonObject = new JSONObject();
            jsonObject.put("message", data);
            out.print(jsonObject);
        }*/
    
            
        
        
        
        
    }
 
    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
     *      response)
     */
    protected void doPost(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        
        doGet(request, response);
    }
 
}
 


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<script type="text/javascript">
    function getXMLHttpRequest() {
        if (window.ActiveXObject) {
            try {
                return new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    return new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e2) {
                    return null;
                }
            }
        } else if (window.XMLHttpRequest) {
            return new XMLHttpRequest();
        } else {
            return null;
        }
    }
 
    var xmlHttpRequest = getXMLHttpRequest();
 
    function responseAjax() {
        if (xmlHttpRequest.readyState == 4) {
            if (xmlHttpRequest.status == 200) {
                var sendButtonElement = document.getElementById("send_button");
                sendButtonElement.removeAttribute("disabled");
                var spinnerElement = document.getElementById("spinner");
                spinnerElement.setAttribute("style", "display:none");
 
                eval("var jsonObj = " + xmlHttpRequest.responseText);
 
                var messageElement = document.getElementById("message");
                messageElement.innerHTML = "The server said: "
                        + jsonObj.message;
            }
        }
    }
 
    function sendRequest() {
        var sendButtonElement = document.getElementById("send_button");
        sendButtonElement.setAttribute("disabled", true);
        var spinnerElement = document.getElementById("spinner");
        spinnerElement.setAttribute("style", "display:inline");
 
        var url = "http://localhost:9090/AjaxExample/SimpleEchoAjaxServlet";
 
        var echoMessage = document.getElementById("echo_message").value;
        
        url += "?data=" + encodeURIComponent(echoMessage);
 
        xmlHttpRequest.open("GET", url, true);
        xmlHttpRequest.onreadystatechange = responseAjax;
        xmlHttpRequest.send(null);
    }
    
    
</script>
</head>
<body>
    <form>
        <input id="echo_message" type="text" value="전송할 Echo 메시지를 입력하세요."
            style="width: 150px"> <br> 
        
        <input id="send_button"
            type="button" value="서버로 Echo 메시지를 전송" onclick="sendRequest()">
        <img id="spinner"
            src="/AjaxExample/imgs/ajaxSpinner.gif"
            width="15px" height="15px" style="display: none" />
    </form>
 
    <p id="message"></p>
</body>
</html>







===========================================================================================

서버를 통한 오라클 작업을 위한 준비

cmd창에서 lsnrctl status를 입력 후 엔터 (안되면 관리자권한으로 실행)

XE가 써있는지 확인



이렇게 안나온다면

C:\oraclexe\app\oracle\product\11.2.0\server\network\ADMIN\listener.ora 에다가

SID_LIST_LISTENER =

  (SID_LIST =

    (SID_DESC =

      (SID_NAME = PLSExtProc)

      (ORACLE_HOME = C:\oraclexe\app\oracle\product\11.2.0\server)

      (PROGRAM = extproc)

    )

    (SID_DESC =

      (SID_NAME = CLRExtProc)

      (ORACLE_HOME = C:\oraclexe\app\oracle\product\11.2.0\server)

      (PROGRAM = extproc)

    )

    (SID_DESC =

      (GROBAL_DB_NAME = XE)

      (SID_NAME = XE)

      (ORACLE_HOME = C:\oraclexe\app\oracle\product\11.2.0\server)

    )    

  )


LISTENER =

  (DESCRIPTION_LIST =

    (DESCRIPTION =

      (ADDRESS = (PROTOCOL = IPC)(KEY = EXTPROC1))

      (ADDRESS = (PROTOCOL = TCP)(HOST = bit-PC)(PORT = 1521))

    )

  )


DEFAULT_SERVICE_LISTENER = (XE)


이렇게 입력



반응형

'(Before)BitSchool' 카테고리의 다른 글

2014/06/18 AJAX를 이용하여 Suggest 기능 만들기  (0) 2014.06.18
2014/06/17 Servlet,JSP웹 프로그래밍 - 쿼리 수행기  (0) 2014.06.17
2014/06/13 AJAX - 서버와 통신, JSON  (0) 2014.06.13
2014/06/12 JavaScript - 기본함수, 사용자 함수, 이벤트  (0) 2014.06.12
2014/06/11 JavaScript  (0) 2014.06.11

'(Before)BitSchool' Related Articles

티스토리툴바