codestates / codestates/HoloSulo
[Dev-log] 강범규 - 2022.02.21
- Dominant language
- JavaScript
- Stars
- 0
- Forks
- 0
- PR merge metrics
- No merged PRs in 30d
Description
### 오늘은 어떻게 프로젝트에 기여했나요?
- https://github.com/codestates/HoloSulo/issues/33
- https://github.com/codestates/HoloSulo/issues/85
### 오늘의 프로젝트에서 힘든 점은 무엇인가요?
1. youtube iframe api 연동시 메인페이지에 오랫동안 머물면 아래와 같은 에러 메세지 뜨면서 에러 발생중.
```
react-dom.development.js:10290 Uncaught DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.
```
useEffect안에서 script 추가하는 곳이 의심
```
useEffect(() => {
const tag = document.createElement("script");
tag.src =
"https://www.youtube.com/iframe_api?origin=http://localhost:3000/main";
tag.async = true;
const firstScriptTag = document.getElementsByTagName("script")[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
window.onYouTubeIframeAPIReady = () => {
setPlayer(
new window.YT.Player("player", {
height: "360",
width: "640",
videoId: videoIds[youtubeIndex.current].id,
events: {
onReady: onPlayerReady,
onStateChange: onPlayerStateChange,
},
})
);
};
function onPlayerReady(event) {
event.target.playVideo();
}
function onPlayerStateChange(event) {
console.log("state changed!", event.target);
if (event.data === window.YT.PlayerState.ENDED) {
youtubeIndex.current = (youtubeIndex.current + 1) % videoIds.length;
setCurrentYoutubeIndex(youtubeIndex.current);
event.target.loadVideoById(videoIds[youtubeIndex.current].id);
}
}
}, [player]);
```
### 내일은 프로젝트에 기여하기 위해 무엇을 해야 하나요?
* [ ] https://github.com/codestates/HoloSulo/issues/85
* [ ] https://github.com/codestates/HoloSulo/issues/86
**Additional context**
Add any other context or screenshots about the feature request here.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.