self.crypto.randomUUID() is not a function

devhan·2023년 6월 7일
0

1. Localhost는 secure origin으로 간주한다.
2. Web Cryptography API는 secure origin에서 작동한다.

오늘 튜터링 진행하면서 다른 팀원들은 정상작동하는데, 한 팀원에게서만 코드가 작동하지 않는 상황을 만났습니다.

 reviewBtn.addEventListener("click", () => {
  const uuid = self.crypto.randomUUID();
  localStorage.setItem(uuid, { name: 'hi' });
}

// Uncaught TypeError: self.crypto.randomUUID is not a function

self.crypto.randomUUID()가 함수가 아니라는 에러를 주는 상황입니다.
브라우저의 버전이나 종류에 문제가 있을 것이라고 생각하였는데, 학생분이 live-server에 접속할 때 localhost가 아닌 local Ip를 사용하는 것이 문제였습니다.

localhost는 secure origin으로 간주하나, local Ip는 unsecure origin으로 간주되었고, 이 때문에 Web Cryptography API가 작동하지 않았습니다.

다른 튜터분께서 멋지게 해결책을 찾아주셔서 새로운 내용을 배우게 되었습니다ㅎㅎ
해결방법은 vscode의 extension 세팅에서 Use Local Ip 체크 해제!

profile
한번에 한가지씩

0개의 댓글

관련 채용 정보