실리콘밸리 AI 인턴십 3주차 수요일

오늘은 프로메테우스와 그라파나에 대해서 배웠다

 

프로젝트를 했는데 서버가 잘돌아가는지 알 수 있는 툴이다

 

ELK 랑 뭐가 다르냐

 

ELK 메인 용도는 서버를 운영할때 로그를 다 모아온다

웹브라우저에서 콜하고 사용하면 프로메테우스 , 그라파나를 바로 볼 수 있다.

 

용길한 멘토한테 가르쳐라도 하게 할테니 모르면 방법 물어보자

 

앤드류멘토님의 도커 프로메테우스,그라파나

https://github.com/shpark76/docker-monitoring/tree/main

클론해가서 분석해보자

서비스 api에 대해서 각각의 분석이 가능

원래는 복잡한건데 쉽게 쓸 수 있게 다 해놓았다.

 

 

+ 팀작업 , 현재진행상황

 

카메라 앨범과 촬영사진을 업로드 하는 과정에서 post를 쓰는데 계속해서 401에러와 500에러가 번갈아가면서 났다.

401에러가 났던 이유는 jwt 토큰을 사용해서 프로젝트를 진행하는데 authorization header에 jwt 토큰이 첨부가 되지 않아서 401에러가 계속 났다. 그래서 이유를 찾다가 헤더에 credential으로 include를 해주니 401 에러는 해결이 되었다 .그러나 그다음부터는 500에러가 떴다 이 에러가 왜 나는지 찾아보다가 postman에서는 image를 실어서 post를 주면 문제없이 리스폰스를 받는것을 확인하였다 . 그래서 react에서의 코드를 수정을 하기 시작했다. 처음에는 axios 다음으로는 fetch를 써가면서 포스트 요청을 했지만 계속해서 500 에러가 떴다 .결국 방법을 찾다가 postman에서 api 요청을 자동으로 여러 언어에 맞게 바꿔주는 기능이 있었다.

이 기능을 사용해서 axios 도 react에 붙여보았지만 fs from import "fs" 가 작동하지 않아서 (원래는 nodejs 에서 사용하는 문법이라고 한다 . filesystem)그래서 리액트 코드와 거의 유사한 javascript fetch로 바꾸어서 코드를 붙여보았다. 결과는 여전히 작동을 안하였다 그래서 방법을 찾던중에 img파일을 그저 url만 붙여주는게 아니라 객체를 생성해서 url name imgname등을 실어서 보내는 방법을 찾았다. 

그렇게 요청을 했는데도 에러가 떴다 . 더 이상 fetch 나 axios 로 더 할 수 없을 만큼 코드를 짰는데 에러가 나니 다른 이유를 찾기 시작했다

그 이유는 가까운데 있었다. 현재 image url 은 엑스포 카메라 앨범에서 받아온 url 로 저장이 되어있었다. 휴대폰의 경로와 컴퓨터의 경로는 다르기 때문에 local에 있는 버섯 이미지를 받아와서 포스트 요청을 보내보았다. 결과는 성공 !! 참고로 로컬의 url은 User/kimjunhyeong 이런식으로 시작한다면 expo나 모바일 앨범 url은 file:// 이런식으로 시작한다 expo camera에서 localhost의 url로 전송을 하려고하면 둘다 localhost에서 작동이 되기 때문에 네트워크 에러가 뜨며 전송이 되지 않는다는걸 알았다. 서버 배포가 완료되면 테스트 모바일 환경과 서버환경의 ip가 달라지기때문에 그때 다시 시도를 해보아야겠다. 

 

 

그리고 post 작업을 완료하고 image get api를 사용해서 이미지리스트를 구현하는데 성공했다. 처음에는 json을 불러올때 response.json()으로 불러와야하는데 response.data로 불러와서 계속 json 형태를 읽지 못해서 undefined로 떴다. 나중에 type명령어로 response data의 타입을 확인하니 string으로 되어있었다. 그래서 바로 response.json으로 바꾸고 json형태로 불러온뒤에 

 

내가 원하는 flatlist 의 데이터 json 형태는 {images[id:1,name:1,lat:1]} 이런식이었는데 앞에 success라는 json 요소가 하나 더 있었다. 그래서 내가 필요한 images만 받아오기 위해서 새로운 json을 생성해서 거기다가 data.images로 할당을 시켜주었다. 

그러고 똑같이 임시로 만들어놨던 flatlist에 새로운 json을 넣고 동작시키니 잘 작동이 되었다.