HTML(10)
-
스웨거로 작업한 API를 html 문서로 저장하기
본 포스팅은 스웨거로 작업한 API를 html 문서로 저장하는법을 다룹니다. 1단계 http://localhost:8080/swagger-ui/index.html#/ 로 접속해 제목 아래에 있는 링크로 접속한다. 2단계 출력되는 json을 저장한다. 3단계 https://editor.swagger.io/로 접속해 방금 만든 json 파일을 import한다. 4단계 html로 export한다. 에러발생 간혹가다 export가 안되는 경우가 있는데, 그때는 requestdto, responsedto쪽 Schema 어노테이션을 수정하면 된다!
2024.03.06 -
[Flask] 초간단! HTML과 Flask 통신 - 3
본 포스팅에서는 Naver Cloud Flatform의 API를 이용해 Flask서버에서 지도 정보를 받아서 웹 페이지에서 지도를 그려주는 것에 관해 다룹니다. Naver Cloud Flatform에서는 네이버 지도에 관한 여러 어플리케이션(e.g. Web Dynamic Map, Geocoding)을 API로 제공합니다. 회원 가입을 하고 ID를 발급 받는 과정등은 추후에 다른 포스팅에서 다루도록하고 본 포스팅에서는 geocoding을 이용하여 어떻게 지도를 불러오고 웹페이지에 그리는지에 대해 다루도록 하겠습니다. 먼저 flask서버에서 geocoding을 이용할 수 있도록 관련 설정을 해주고, requests 라이브러리의 get함수를 통해서 url의 정보를 가져옵니다. 그 후, 이것을 parsing하여..
2024.02.04 -
네이버 지도 Open API 인증이 실패하였습니다. 클라이언트 아이디와 웹 서비스 URL을 확인해 주세요., * Error Code / Error Message: 2 / 서버로 전달된 정보에 오류가 있습니다.
본 포스팅은 네이버 지도 Open API 인증이 실패하였습니다. 클라이언트 아이디와 웹 서비스 URL을 확인해 주세요., * Error Code / Error Message: 2 / 서버로 전달된 정보에 오류가 있습니다. 에러의 해결 방안에 대해 담고있습니다. Naver Cloud Platform을 이용하여 파이썬 flask 서버에서 Geocoding을 수행하여 html로 정보를 넘겨주고, html에서는 그 정보를 바탕으로 네이버 지도를 그릴려고 하였는데, 자꾸 위와 같은 에러가 뜨길래 파이썬 플라스크 서버와 html에서 여러 삽질을 하다가 Naver Map API를 가져오는 방식을 하나 고치니 수정할 수 있다는 것을 알게되었습니다.. Naver Cloud Platform에서 제공하는 API를 HMTL에..
2024.02.04 -
[Flask] 초간단! HTML과 Jinja2
본 포스팅에서는 Python 기반의 템플릿 엔진으로, 주로 웹 애플리케이션의 프론트엔드와 백엔드 사이에서 동적인 컨텐츠를 생성하는 데 사용되는 Jinja2에 대해 알아보겠습니다. 중요한 키워드인 "템플릿 엔진" 에 대해 알아보겠습니다. "템플릿 엔진"을 chatGPT에게 물어보면 아래와 같이 대답합니다. 템플릿 엔진은 동적인 콘텐츠를 생성하기 위한 마크업 언어와 로직을 조합한 도구입니다. 주로 웹 개발에서 사용되며, 정적인 HTML 코드 내에 동적인 데이터를 삽입하고 제어할 수 있게 도와줍니다. 템플릿 엔진은 서버 측에서 실행되어 클라이언트에게 동적인 HTML을 전송하는 데 사용됩니다. 즉, HTML과 같이 정적인 웹페이지에서 동적인 데이터를 삽입하고 제어할 수 있게 해주는 역할을 수행한다는 것을 알 수..
2024.01.30 -
[Python] 초간단! 파이썬 웹 크롤링
본 포스팅에서는 파이썬의 Beautifulsoup 라이브러리, requests 라이브러리, HTML 태그를 이용하여 웹 크롤링을 진행합니다. 아래의 코드를 실행하면 특정 URL로 부터 웹페이지에 있는 텍스트(멜론의 top100 차트 정보)를 가져올 수 있게 됩니다. 8번째 줄의 get함수는 지정된 URL로 HTTP GET 요청을 보내는 함수입니다. 즉, '지정된 URL에서 정보를 가져오겠다.'라고 웹페이지에 선언하는 것입니다. 8번째 줄의 data의 text 인자에는 지정된 URL의 웹페이지의 모든 텍스트가 들어가있는데, 9번째 줄의 BeautifulSoup에서 HTML parser를 이용하여 내용들을 잘라주는 역할을 수행합니다. from bs4 import BeautifulSoup import requ..
2024.01.30 -
[Flask] 초간단! HTML과 Flask 통신 - 2
본 포스팅에서는 html에서 form 태그를 통해 원하는 날짜의 박스오피스 순위를 들고와서 다시 화면에 보여주는 코드를 작성해보겠습니다. 먼저 아래와 같이 HTML 코드를 작성해보겠습니다. 코드를 작성하면, input 태그를 통해 텍스트를 입력받고, button을 누르면 input 태그를 통해 받은 텍스트가 "query"라는 이름으로 "movie_boxoffice"라는 웹페이지로 라우팅 되게 됩니다. 박스 오피스 검색 사이트 "YYYYMMDD"형태로 입력하세요. 검색 "movie_boxoffice" 페이지에서 전달받은 영화 날짜의 텍스트("query")를 이용하여 해당 날짜의 박스오피스 정보를 가져오는 flask 서버의 코드는 아래와 같습니다. requests 라이브러리의 get 함수의 인자는 영화진흥위..
2024.01.29