개발일지/오류 해결기

html 이미지 엑박 해결기

Rolls01 2018. 9. 8. 10:27

문제점: html 이미지 소스 <img src="주소" />를 썼으나(ex: <img src="/images/basic.png" /> 웹페이지에는 엑박으로 표시됨.
문제 원인: 이미지 경로 지정 문제

해결방법:
1)www 폴더를 다 백업 복사함. 그리고 그 폴더를 불러 작업.
2))www 경로 밑에 images 폴더를 생성 후
3)basic.png 파일을 옮김
4)그 후 ftp파일로 www 폴더 전체를 업데이트 후, 적용하니 엑박없이 원래의 이미지로 제대로 표시됨



해결하기까지 시도했던 방법(오답 및 정답 포함)
처음에 본인이 작업하던 방식은 에디터에 폴더를 따로 생성하고 html 파일을 만들어서 작업 후, 테스트를 거쳐 ftp 프로그램을 거쳐 파일 경로에 수정한 파일을 덮어쓰기하는 형태였음. 예를 들면, www 폴더에 index.html 파일이 있는 기본 형태를 기준. www폴더 하위에 images 폴더를 만들고 images 폴더 안에 basic.png 라는 내가 이용할 이미지 파일을 넣어 놓아야 정상 처리 되는 것.
그러나 본인은, www 폴더를 웬만하면 오류날까봐 건드리지 않으려고 다른 폴더를 썼음. 예를 들면 project 폴더라 칭함. 그 project 폴더에 images 폴더를 만들고 코드를 작성하니 안되었음. => 여기서 이미지 경로 지정의 문제가 발생함. 그러나 문제를 파악하지 못하고 이것 저것 시도를 함



시도 ① www 파일 하위에 폴더를 생성하지 않고, 다른 외부 폴더에 하위 폴더를 생성하고 그 폴더 안에 <img src="../images/basic.png">
시도 ② <img src="/images/basic.png">
=> 시도를 해보았으나, 상위경로의 문제도 아니었고, 상대경로/절대경로의 문제가 본질적인 문제가 아니었음을 파악함. 그래서 위와같은 해결방법으로 해결함.