three.js 수업 중 질문입니다.

Question

안녕하세요 선생님.  좋은수업 감사합니다. 수업을 듣고 연습 중 몇가지 궁금한 점이 생겼습니다.   1. 페이지에서,  renderer 를 여러개의 div element에 중복 적용하고 싶은데요,   한개의 renderer로 append를 시도하니 오류가 납니다. 동일한 renderer가 여러 element에 중복 append 될 수 있을까요??   2. 라운드처리 된 직사각형이 z축으로 extrude 된 아래와 같이 앞면, 뒷면의 각이 살아있는 육면체를 만들고 싶은데, 혹시 지오메트리를 사용해서 만들 수 있는 방법이 있나요??   3. GLTF Loading을 시도하였는데, Live Server 에서는 잘 동작하지만, 개인 호스팅에 업로드시  ~~ has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 이렇게 나와 오류가 나고 있습니다.. 혹시 three 내에서 설정할 수 있는 부분이 있을까요..? 사실 3번이 되지 않아 2번을 여쭤보게 되었습니다.. ㅠ   질문이 조금 많지만 ㅠ 혹시 답변주시면 정말 감사하겠습니다! 앞으로 열심히 공부하겠습니다 . 좋은 강의 만들어주셔서 다시한번 감사합니다 ^^

1분코딩 · Answer

1. 실 서비스에 적용할 때 말씀하신 부분이 필요한 경우가 꽤 많을 것 같아서, 관련해서 추가 영상을 제작하고 있습니다^^ 추가 영상 제작되면 알려드릴게요~~ 2. https://threejs.org/docs/#api/en/geometries/ExtrudeGeometry Shape로 형태를 만들고 ExtrudeGeometry를 이용해서 가능할텐데요, 말씀하신대로 glb 파일을 활용하시는게 더 간편할 것 같습니다. 3. CORS 에러는 다른 서버에 있는 리소스를 요청했을 때 보통 발생하는데요, 혹시 glb 파일이 다른 서버에 올라가 있을까요? 왠지 그건 아닐 것 같은데^^; three.js와 연관이 있다기 보다는, 사용하시는 서버와 관련된 세팅을 수정해주셔야 할 것 같습니다. 정 해결이 어렵다면 일단 다른 서버에서 테스트 해보시면 어떨까 싶습니다! CORS 관련해서 얄코님의 정말 좋은 영상이 있어서 링크 올려드릴게요. https://www.youtube.com/watch?v=bW31xiNB8Nc (힘나는 첫 수강평 달아주셔서 정말 감사합니다 영서님!)