728x90
반응형

IT/웹프로그래밍 15

모바일 사파리에서 전화번호 자동 링크 생성되는 문제

왠지는 모르겠지만 백엔드 개발로 파견나갔다가 퍼블리싱을 했는데 그냥 span 태그 안에 넣어둔 사업자 번호(123-45-67890)를 브라우저가 제멋대로 전화번호 형식으로 인식해서 통화 링크를 걸어주고 난리 난 안드로이드 폰이라 몰랐는데, 아이폰에서 사파리로 들어가면 그렇더라... 구글링 1 a 태그에 css로 color:white를 넣어라 -> 파란색만 없어지지 밑줄이랑 하이퍼링크는 그대로 구글링2 메타 태그 를 넣어라 ->유효함. 그런데 새로고침 할 때마다 링크가 있다가 없다가 왔다갔다함 캐시 지우고 새로고쳐도 안됨... 이 부분은 html 파일의 문제인건지, 아님 클라우드 스토리지의 문제인 건지 알 수 없음 결국 전화번호 부분만 태그로 감싸고 href 안줘버림 회사명 : ... 사업자등록번호 : 1..

spring에서 json api 만들기

pom.xml jackson 라이브러리 디펜던시 추가하고 메이븐 업데이트를 해준다. 버전은 아래를 참고하여 최신 것으로 설정 https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind/2.9.8 Entity 클래스 위에 @JsonIdentityInfo 어노테이션 추가 안그러면 chunked 에러가 발생한다... Controller @ResponseBody 어노테이션을 추가해준다. 이게 없으니 404 에러가 떴다. 자료형은 Object로 설정해준다. 브라우저 설정한 경로로 접속하면 이렇게 데이터가 json 형태로 뿌려진 것을 볼 수 있다.

Vanilla JS

Vanilla JS 바닐라 자바스크립트는 프레임워크나 라이브러리를 사용하지 않는 순수한 자바스크립트를 말한다. 공식 사이트에서 바닐라js 파일을 다운받으면 크기가 0이다. 바닐라 자바스크립트를 사용하기 위해서는 다른 무언가가 필요없다는 뜻이라고... 학습단계에서는 jQuery 등의 라이브러리 사용법을 먼저 공부하기보다는 바닐라 자바스크립트를 공부하면서 웹과 js에 대한 이해를 쌓는 게 좋다고 한다. http://vanilla-js.com/

스프링 한글 파라메터값 GET방식으로 넘기기

영어 파라메터는 잘 넘어가는데 한글 파라메터만 넘기면 url에서부터 깨져있는 현상.. server.xml 수정 get 방식은 url에 데이터를 넣어 보내는 방식이기 때문에 서블릿 영역 안에서 컨트롤되지 않는다고 한다. 때문에 프로젝트 파일이 아닌 서버 파일을 수정해야 한다. 이클립스 내 서버 폴더 아래 server.xml 파일을 수정한다. 이 부분을 찾아서 끝에 URIEncoding="UTF-8" 추가 이부분도 찾아서 마찬가지로 끝에 URIEncoding="UTF-8" 추가 뷰 파일 수정 원래 내 프로젝트는 이렇게 되어있었는데 저 부분은 없애도 된다. 그리고 인코딩 설정이 UC-KR로 설정되어 있는 것을 UTF-8로 다 바꿔준다. 이렇게 수정하고 나면 한글이 깨지지 않고 잘 넘어간다.

ajax 크로스 도메인 허용하기 (헤더 설정)

db에서 데이터를 가져와 json으로 뿌려주는 파일이다. 밑줄친 response.setHeader("Access-Control-Allow-Origin","*"); 부분을 코드 상단에 써주면 크로스도메인을 허용한다는 내용이 된다. 물론 내 서버 파일이니까 가능했지, 남이 만들어서 뿌려주는 파일을 쓰려먼 못하는 방법이다... 그래서 이 글에서는 못 했었다. 2019/08/08 - [웹프로그래밍] - ajax 사용하여 비동기 데이터 받아오기

react로 json 데이터 불러오기

index.js 새로 만들 파일의 이름은 Allview.js이다. App.js가 임포트되어있던 것을 Allview로 바꾸고 render 안의 태그도 Allview로 바꿔준다. Allview.js import React, {useEffect, useState} from 'react'; import * as $ from 'jquery'; function Allview() { const [ exams, setExams ] = useState(null); $.ajax({ url:"http://(서버주소)/AllviewDB_view.jsp",//클라이언트가 요청을 보낼 서버의 url 주소 type: "GET",//http 요청 방식 (get, post) }) //http 요청이 성공하면 요청한 데이터가 done(..

react 맛보기 (node.js와 함께)

node.js 설치 node.js를 다운받는다. 다운로드가 완료되면 인스톨 진행. 설치가 끝났으면 cmd 창에서 설치됐는지 확인해본다. git 설치 git은 예전에 이미 깔아뒀었다. cmd창에서 확인만 한번 하고 넘어간다. 프로젝트 생성 원하는 위치에서 npx create-react-app로 디렉토리를 만든다. (tic-tac-to는 프로젝트 이름이다.) 엔터를 치면 무언가 막 진행된다. 생성이 완료되면 위와 같이 뜬다. 해당 디렉토리로 이동하여 npm start를 입력하면 리액트가 실행된다. 브라우저가 켜지고 아래와 같이 인덱스창이 뜨면 성공이다. 제이쿼리 추가하기 방금 생성한 tic-tac-to 프로젝트에서 package.json 파일을 열어 이미지에 표시한 것처럼 "jquery" 부분을 추가하고 저..

ajax 사용하여 비동기 데이터 받아오기

curr.json 서버에 위와 같은 json 파일을 만들어뒀다. 이 데이터를 실시간으로 받아오려고 한다. ajax_test.html Ajax Test intervals 함수에 의해 1초마다 dt 함수와 func1 함수를 실행한다. dt 함수는 실행될 때마다 현재시각을 받아 dtime div에 표시한다. func1 함수는 실행될 때마다 curr.json의 데이터를 받아와 ret div에 표시한다. curr.json 파일의 값을 수정하고 저장하면 수정된 값이 ajax_test.html에 실시간으로 반영되는 것을 볼 수 있다. 2019/08/02 - [웹프로그래밍] - Open API로 json 데이터 받아서 파싱하기 (json-simple 라이브러리) Open API로 json 데이터 받아서 파싱하기 (js..

300x250
반응형