개발/에러해결48 mysql query 시간이 오래 걸리고 느릴 때 에러 내용 select * from where = order by ; mysql query가 너무 오래 걸리고 느립니다. 이런 query를 사용하는 front 나 back에도 성능 면에서 안 좋은 영향이 나타납니다. 에러 원인 1. 너무 많은 row : 현재 테이블에 약 400만 개의 row가 있습니다. 2. 비효율적인 query : ordery by나 where과 같은 추가적인 리소스 소모를 일으키는 query가 있습니다. 해결 방법 세 가지 정도의 해결 방법을 생각할 수 있습니다. index를 사용합니다. limit을 사용합니다. order by 나 where를 다른 방식으로 구현합니다. ALTER TABLE `` ADD INDEX `` (``); 저는 order by에 해당하는 column을 ind.. 2023. 3. 10. react setInterval에서 state 업데이트 안됨 에러 내용 주기적으로 업데이트해야 하는 화면이 있을 때, setInterval을 활용하게 됩니다. 그러나 이러한 setInterval에서는 state 업데이트가 되지 않습니다. 이로 인해 state로 인한 주기 종료(clearInterval)을 할 수 없습니다. 에러 원인 이는 클로저로 인함입니다. state가 업데이트 되더라고 setInterval을 호출한 시점에서의 변수 환경이 클로저의 형태로 함수에 종속되기 때문에 setInterval에서는 state의 변화를 감지할 수 없습니다. 해결 방법 state를 직접 사용하지 않고 화면의 특정 요소의 값이나 그 요소 자체의 유무를 사용하도록 하면 됩니다. 수정 전 코드 useEffect(() => { let intervalId; intervalId = se.. 2023. 2. 17. 은(는) 위험할 수 있으므로 다운로드 하지 않습니다. 오류 해결 에러 내용 파일을 다운로드하는데 다음과 같이 오류가 나타난다. 에러 원인 구글 크롬 정책상 외부 사이트에서 직접적으로 파일을 다운로드하는 것은 경고를 보낸다 해결 방법 blob으로 바꿔서 내부 오브젝트 url을 만든다 아래는 react로 이를 구현한 코드이다. 핵심은 file download 링크에서 response을 받고 blob으로 변환한 오브젝트를 내부 URL로 다운로드할 수 있도록 변경하는 것이다. const AttachmentsIcon = ({ attachments }) => { if (attachments === undefined || attachments.length === 0) { return ; } else { async function handleFileDownload() { for a.. 2023. 2. 13. setheader 안됨 : fetch 후 reponse에 header가 없을 때 에러 내용 서버에서 response에 헤더를 분명 설정 및 추가하였는데 getHeader 했을 때 response에는 없는 경우입니다. setHeader addHeader headers.set 등 어떤 header 조작도 안됩니다. 에러 원인 cors 정책 때문입니다. (보안상의 이유) 표준 헤드가 아닌 경우 일반적인 getHeader, headers.get 등으로 볼 수 없도록 제한하여 놓았습니다. 헤더를 문자열로 변환시켜 raw header 형태로 보면 찾을 수 있지만 너무 번거롭습니다. 해결 방법 표준 헤드 중 쓰지 않는 것을 넣으면 됩니다. 보통 Pragma는 사용하지 않으니 Pragma를 key로 원하는 value를 사용하면 됩니다. 참고 자료 Reading response headers wit.. 2023. 2. 13. Uncaught Error: Objects are not valid as a React child (found: [object Promise]). If you meant to render a collection of children, use an array instead. 에러 내용 Uncaught Error: Objects are not valid as a React child (found: [object Promise]). If you meant to render a collection of children, use an array instead. react에서 async, awiat, promise, then 등의 비동기를 활용해 새로운 요소를 만들고 렌더링 하자 위와 같은 에러를 만났습니다. 아래는 에러 코드 예시입니다. const component = ({list}) => { return {list.map(async()=>{ await ... return })} } 에러 원인 에러 원인은 비동기(Promise)가 아직 처리되지 않았을 때 처리되지 않은 Promis.. 2023. 1. 27. html 또는 react에서 /r 또는 /n 으로 줄바꿈(개행)이 안됨 에러 내용 html의 요소 안 텍스트가 /r 또는 /n으로 줄 바꿈을 하고 있는데 줄 바꿈(개행)이 동작하지 않는다. 에러 원인 웹에서 보여줄 때 몇몇 문자들은 자동으로 인코딩이 하여서 보여주지 않는다. 해결 방법 div { white-space: pre-wrap; } 위의 css를 해당 요소에 추가하거나 {item.data} react의 JSX에서는 위와 같이 스타일을 추가한다. 해결 결과 스샷 참고 자료 Newline in react string [Solved] If you’ve ever wondered how to render the newline character (\n) in a string as an actual newline in your React app, read on. Imagine y.. 2023. 1. 19. 이전 1 2 3 4 5 6 7 8 다음