JavaScript

Flask 서버와 A jax

leehii 2022. 7. 11. 18:22

 !pip install flask
 !pip install flask_cors

from flask import Flask, request
from flask_cors import CORS

app = Flask(__name__)
CORS(app) 

@app.route('/test') 
def test(): 
    
    if request.method == "GET": 
        data = dict(request.args)
        
  
        
        return ''' 
        [
            {
                "name" : "안현진",
                "age" : "20",
                "class" : "빅데이터 분석서비스 개발자 과정"
            },
            {
                "name" : "aaa",
                "age" : "20",
                "class" : "인공지능 융합서비스 개발자 과정"
            }
        ]
        '''

    else:
        return "Post요청" 

if __name__ == '__main__': 
    app.run(host="172.30.1.3", port="6600") 

 

 

---------------------------------------------------------------------------------------------------------


<body>

<form action="http://172.30.1.3:6600/test">
name : <input type="text" name="name">
<input type="submit" value="전송" >
</form>

<button onclick="flask()">데이터 받기</button>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript">

function flask(){

$.ajax({
url : 'http://172.30.1.3:6600/test',  // 어디로 요청할건지
type : 'get', 
data : {
// 어떤 값을 보내줄 것인지
// "key" : value
"age" : 25
},
dataType:"json", // json데이터 받아올때만 
success : function(res){
// 요청에 성공하면 어떤 코드를 실행시킬 것인지???
console.log(res[0].class);

},
error : function(e){
alert("error!")
}
})
}


</script>


</body>
-------------------------------------------------------------------------------------------------------------

 

# !pip install flask
# !pip install flask_cors

from flask import Flask, request
from flask_cors import CORS

app = Flask(__name__)
CORS(app) # 동일 출처 정책 무시

@app.route('/test') # @WebServlet 어노테이션과 동일하게 url맵핑 지정
def test(): # /test라는 요청이 들어오면, test() 함수실행
    
    if request.method == "GET": # 요청 방식이 Get???
        data = dict(request.args)
        
        
        # DataFrame -->JSON
        
        return ''' 
        [
            {
                "name" : "안현진",
                "age" : "20",
                "class" : "빅데이터 분석서비스 개발자 과정"
            },
            {
                "name" : "노준호",
                "age" : "20",
                "class" : "인공지능 융합서비스 개발자 과정"
            }
        ]
        ''' # 리턴값 == 응답값

    else:
        return "Post요청" #  응답 ==> out.print()

if __name__ == '__main__': # java의 Main
    app.run(host="172.30.1.3", port="6600") # 서버 스타트, # host == ip , #port==port번호
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<form action="http://172.30.1.3:6600/test">
		name : <input type="text" name="name">
		<input type="submit" value="전송" >
	</form>
	
	<button onclick="flask()">데이터 받기</button>
	
	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
	<script type="text/javascript">
		// ajax 요청
		
		function flask(){
			// flask서버로 요청
			$.ajax({
				url : 'http://172.30.1.3:6600/test', // 어디로 요청할건지,
				type : 'get', // get? post
				data : {
					// 어떤 값을 보내줄 것인지
					// "key" : value
					"age" : 25
				},
				dataType:"json", // json데이터 받아올때만 넣을것
				success : function(res){
					// 요청에 성공하면 어떤 코드를 실행시킬 것인지???
					console.log(res[0].class);	
							
				},
				error : function(e){
					alert("error!")
				}
			})
		}
	
	
	</script>
	

</body>
</html>

 

 

.