TWIL 2021-9 (5)

1. FileReader.readAsDataURL()

---

사용자가 업로드한 파일을 문자열로 Base 64 형식으로 인코딩 하여 서버에 전송해야 했다.

(...)  
const file = event.target.files[0];
const reader = new FileReader();

reader.onloadend = () => {
  file.string = reader.result;
  _dispatch(updateFile(file));
};
reader.readAsDataURL(file);

• input 태그의 type을 file로 지정하면 업로드 된 파일이 event.taget을 통해 File 객체로 들어온다.
• Base 64는 64진법으로 Binary data를 ASCII string format으로 변환하는 인코딩 방식이다.

🔗 💾 자바스크립트 File 객체

2. 간편하게 Mock Data 만들기

---

서버 데이터 구축 전, 클라이언트에서 간편하게 목업 데이터 만들어서 사용하는 방법
mokaroo에서 다운받는 것 보다 더 빠르고 편리한 것 같다.

const users = ['Kim', 'Lee', 'Park'];
const getRandomUserId = () => users[Math.round(Math.random())];

const msgs = Array(50)
  .fill(0)
  .map((_, index) => ({
    id: index + 1,
    userId: getRandomUserId(),
    timestamp: 1234567890123 + index * 1000 * 60,
    text: `${index + 1} mock text`,
  }))
  .reverse();

• reverse()는 최신 시간 순 정렬을 위한 것