WEB11 JSON, JavaScript 객체 차이 📌type이 object인 이유?? jsp의 success: function(data) 여기로 넘어감 console.log(data) 결과 🚩ajax에서 dataType: "JSON"을 설정했을 때, 서버에서 응답한 데이터가 JSON 형식으로 전달되면, JavaScript에서는 이 데이터를 받아서 자동으로 JavaScript 객체로 변환함 예를 들어, 서버에서 다음과 같은 JSON 형식의 데이터를 보냈다고 가정 { "name": "John", "age": 30 } 이 데이터는 JavaScript 객체처럼 다루어짐 즉, 다음과 같이 사용 console.log(data.name); // "John" console.log(data.age); // 30 typeof data가 "object"로 표시되는 이유는 .. WEB/JS 2023. 10. 5. jquery 제이쿼리와 AjaxAjax를 이용하여 개발을 손쉽게 할 수 있도록 미리 여러 가지 기능을 포함해 놓은 개발 환경을Ajax 프레임워크라고 합니다.그중에서도 현재 가장 널리 사용되고 있는 Ajax 프레임워크는 바로 제이쿼리(jQuery)입니다.$.ajax({ url: "/examples/media/request_ajax.php", // 클라이언트가 요청을 보낼 서버의 URL 주소 data: { name: "홍길동" }, // HTTP 요청과 함께 서버로 보낼 데이터 type: "GET", // HTTP 요청 방식(GET, POST) dataType: "json" // 서버에서 보내줄.. WEB/JS 2023. 9. 12. Ajax 개념과 코드 적용(댓글 등록) 웹 페이지 전체를 다시 로딩하지 않고 일부분만을 갱신할 수 있다. 즉 백그라운드 영역에서 서버와 통신하여, 그 결과를 웹 페이지의 일부분에만 표시할 수 있다.\ 댓글 등록시 바로 등록되고 삭제시 바로 삭제된다. (새로고침되지않음) 세션 등록을 했기 때문에 댓글 작성자만 삭제 가능하다. Asynchronous JavaScript and XML 으로 동적인 웹 페이지를 만들기 위한 개발 기법이며 이때 서버와는 다음과 같은 다양한 형태의 데이터를 주고받을 수 있다. - JSON - XML - HTML - 텍스트 파일 등 동작원리 ① : 사용자에 의한 요청 이벤트가 발생합니다. ② : 요청 이벤트가 발생하면 이벤트 핸들러에 의해 자바스크립트가 호출됩니다. ③ : 자바스크립트는 XMLHttpRequest 객체를 .. WEB/JS 2023. 9. 12. 4.결과를 전달하는 HTTP 상태코드 4.1 상태코드 클라이언트 --request---> 서버 서버로부터 request 결과를 전달 response의 클래스 클래스 설명 1XX Informational request 처리중 2XX Success request 정상 처리 3XX Redirection request 를 완료하기 위해 추가 동작이 필요 4XX Client Error 서버는 request 이해 불가 5XX Server Error 서버는 request 처리 실패 ◆2XX request 성공 ▷200 정상처리 ▷204 No Content request 성공 but 돌려줄 리소스가 없음 엔티티(HTTP 요청 또는 응답의 본문) 바디가 없음 -> 브라우저에서 request 보낸후 화면이 변하는 일은 없을 것임 클라이언트에서 서버로 정보를 .. WEB/HTTP&NETWORK 2023. 8. 25. 2.간단한 프로토콜 HTTP 2.1,2 HTTP는 클라이언트와 서버 간 통신을 한다.HTTP 프로토콜에서는 반드시 한쪽이 클라이언트(request) 다른 한 쪽은 서버(response)역할을 담당클라이언트측에서 먼저 통신이 시작 -> request가 있어야 response가 있음 GET : 서버에 요구하는 종류 == 메소드/index.html : request URI(요구대상) == 리소스HTTP/1.1 : 클라이언트 기능 식별 == HTTP 버전 번호- 다른예시POST(메소드) /form/entry(URI) HTTP/1.1(프로토콜 버전)Host: hackr.jp (리퀘스트 헤더 필드)Connection: keep-alive (리퀘스트 헤더 필드)Content-Type: application/x-www-form-urlencoded.. WEB/HTTP&NETWORK 2023. 8. 25. json데이터를 활용한 기초적인 홈페이지 https://data.seoul.go.kr/dataList/OA-1176/S/1/datasetView.do 열린데이터광장 메인데이터분류,데이터검색,데이터활용data.seoul.go.kr 열린데이터광장의 json데이터를 활용하였다.필드를 체크하고 검색하고 싶은 단어를 치면 결과값이 나온다!>>>>>>>데이터 URL: https://data.seoul.go.kr/dataList/OA-1176/S/1/datasetView.do 검색 단어: 필드: guname m_addr m_name lng m_code .. WEB/JS 2023. 8. 24. 자바스크립트 테이블 만들기 테이블 만들기 테이블 만들기 세로 줄수 : 가로 칸수 : enter WEB/JS 2023. 8. 24. 자바스크립트 과목,평균,반평균 점수,순위 출력하기 과목 평균 순위 WEB/JS 2023. 8. 24. 자바스크립트 문자열 뒤집기 문자열 뒤집기 WEB/JS 2023. 8. 24. Cookie & Session Cookie(쿠키) 클라이언트(브라우저)로컬에 저장되는 키와 값이 들어있는 작은 데이터 파일 HTTP에서 클라이언트의 상태 정보를 클라이언트의 PC에 저장하였다가 필요시 정보를 참조하거나 재사용할 수 있다. 사용자의 편의를 위한 것으로 지워져도 되고, 조작되거나 가로채이더라도 큰 지장이 없는 수준의 정보 ex) 팝업에서 "오늘 더 이상 이 창을 보지 않음" 체크, 자동로그인 사용자가 따로 요청하지 않아도 브라우저가 Request시에 Request Header를 넣어서 자동으로 서버에 전송 Session(세션) 세션은 쿠키를 기반하고 있지만, 사용자 정보 파일을 브라우저에 저장하는 쿠키와 달리 세션은 서버 측에서 관리 사용자나 다른 누군가에게 노출되면 안되는 중요한 정보 ex) 로그인 클라이언트가 requ.. WEB/HTTP&NETWORK 2023. 8. 24. 1.웹 네트워크 기본 1.1 웹은 HTTP로 나타낸다이 흐름을 결정하는 프로토콜(약속)-> HTTP(HyperText Transfer Protocol) 라는 약속을 사용한 통신을 함 1.2 HTTP가 등장한 배경- 멀리 떨어져 있는 사람들을 연결하는 시스템 즉 WWW(웹)을 구성하는 기술 기술언어 HTML(HyperText Markup Language)+ 문서 전송 프로토콜 HTTP+ 문서의 주소를 지정하는 방법 URL(Uniform Resource Locator) 1.3 네트워크 기본 TCP / IP◆TCP/IP는 프로토콜의 집합네트워크에서 사용되는 프로토콜이다.프로토콜 : 서로 다른 HW, OS가 서로 통신을 하기 위해서 필요한 규격케이블 규격, IP주소 지정방법, 웹에 표시하기 위한 순서 등...인터넷 프로토콜들을.. WEB/HTTP&NETWORK 2023. 8. 24. 이전 1 다음