Update CommentLoadingTest.js
correct error : load page asynchronous
Showing
1 changed file
with
44 additions
and
41 deletions
... | @@ -12,14 +12,51 @@ var commentList = new Array(); | ... | @@ -12,14 +12,51 @@ var commentList = new Array(); |
12 | var commentNum = 0; | 12 | var commentNum = 0; |
13 | var savednpt = '' | 13 | var savednpt = '' |
14 | 14 | ||
15 | -function loadcomment(ApiKey, VideoNum, npt, n){ | 15 | +function showcomment(response, VideoNum){ |
16 | + let body = '' | ||
17 | + let commentDisplay = ""; | ||
18 | + console.log(commentNum); | ||
19 | + for(let iterArr = 0; iterArr < commentNum; iterArr++){ | ||
20 | + commentDisplay += `<br>${commentList[iterArr].name}<br>${commentList[iterArr].text}<br><br>` | ||
21 | + } | ||
22 | + body = ` | ||
23 | + <!doctype html> | ||
24 | + <html> | ||
25 | + <head> | ||
26 | + <title>Youtube Comment</title> | ||
27 | + <meta charset="utf-8"> | ||
28 | + </head> | ||
29 | + <body> | ||
30 | + <form action="http://localhost:3000/search" method="get"> | ||
31 | + <p> | ||
32 | + <textarea name="videourl" placeholder="Write your video Url" >${VideoNum}</textarea> | ||
33 | + </p> | ||
34 | + <p> | ||
35 | + <input type="submit"> | ||
36 | + </p> | ||
37 | + </form> | ||
38 | + <br> | ||
39 | + <br> | ||
40 | + <iframe width="560" height="315" src="https://www.youtube.com/embed/${VideoNum}" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> | ||
41 | + | ||
42 | + <br> | ||
43 | + <br> | ||
44 | + ${commentDisplay} | ||
45 | + </body> | ||
46 | + </html> | ||
47 | + `; | ||
48 | + response.writeHead(200); | ||
49 | + response.end(body); | ||
50 | +} | ||
51 | + | ||
52 | +function loadcomment(ApiKey, VideoNum, npt, n, res){ | ||
16 | return service.commentThreads.list({ | 53 | return service.commentThreads.list({ |
17 | "key":ApiKey, | 54 | "key":ApiKey, |
18 | "part":[ | 55 | "part":[ |
19 | "snippet, replies" | 56 | "snippet, replies" |
20 | ], | 57 | ], |
21 | "videoId":VideoNum,//비디오 주소 | 58 | "videoId":VideoNum,//비디오 주소 |
22 | - "maxResults" : 50, | 59 | + "maxResults" : 100, |
23 | "pageToken" : npt | 60 | "pageToken" : npt |
24 | }).then(function(response) { | 61 | }).then(function(response) { |
25 | //console.log("Response", response); | 62 | //console.log("Response", response); |
... | @@ -38,12 +75,15 @@ function loadcomment(ApiKey, VideoNum, npt, n){ | ... | @@ -38,12 +75,15 @@ function loadcomment(ApiKey, VideoNum, npt, n){ |
38 | 75 | ||
39 | if(response.data.pageInfo.totalResults == response.data.pageInfo.resultsPerPage){ | 76 | if(response.data.pageInfo.totalResults == response.data.pageInfo.resultsPerPage){ |
40 | if( n > 1 ){ | 77 | if( n > 1 ){ |
41 | - loadcomment(ApiKey, VideoNum, npt, n - 1); | 78 | + loadcomment(ApiKey, VideoNum, npt, n - 1, res); |
42 | }else{ | 79 | }else{ |
43 | savednpt = npt; //만약 댓글을 n번 불러온 후에 댓글이 더 남아있으면 savednpt 갱신 | 80 | savednpt = npt; //만약 댓글을 n번 불러온 후에 댓글이 더 남아있으면 savednpt 갱신 |
81 | + showcomment(res, VideoNum); | ||
44 | } | 82 | } |
45 | }else{ | 83 | }else{ |
84 | + savednpt = ''; | ||
46 | console.log('end page'); // 댓글의 마지막 페이지 | 85 | console.log('end page'); // 댓글의 마지막 페이지 |
86 | + showcomment(res, VideoNum); | ||
47 | } | 87 | } |
48 | }, | 88 | }, |
49 | function(err) { console.error("Execute error", err); }); | 89 | function(err) { console.error("Execute error", err); }); |
... | @@ -84,44 +124,7 @@ var app = http.createServer(function(request,response){ // request는 브라우 | ... | @@ -84,44 +124,7 @@ var app = http.createServer(function(request,response){ // request는 브라우 |
84 | videoNum = queryData.videourl; | 124 | videoNum = queryData.videourl; |
85 | console.log(videoNum); | 125 | console.log(videoNum); |
86 | let npt = "" | 126 | let npt = "" |
87 | - loadcomment(apiKey,videoNum,npt,2).then(()=>{ | 127 | + loadcomment(apiKey,videoNum,npt,2, response); |
88 | - setTimeout(()=>{ //딜레이를 주어 강제로 댓글을 여러번 불러오도록 구현, async화 필요. | ||
89 | - let commentDisplay = ""; | ||
90 | - console.log(commentNum); | ||
91 | - for(let iterArr = 0; iterArr < commentNum; iterArr++){ | ||
92 | - commentDisplay += `<br>${commentList[iterArr].name}<br>${commentList[iterArr].text}<br><br>` | ||
93 | - } | ||
94 | - body = ` | ||
95 | - <!doctype html> | ||
96 | - <html> | ||
97 | - <head> | ||
98 | - <title>Youtube Comment</title> | ||
99 | - <meta charset="utf-8"> | ||
100 | - </head> | ||
101 | - <body> | ||
102 | - <form action="http://localhost:3000/search" method="get"> | ||
103 | - <p> | ||
104 | - <textarea name="videourl" placeholder="Write your video Url" >${videoNum}</textarea> | ||
105 | - </p> | ||
106 | - <p> | ||
107 | - <input type="submit"> | ||
108 | - </p> | ||
109 | - </form> | ||
110 | - <br> | ||
111 | - <br> | ||
112 | - <iframe width="560" height="315" src="https://www.youtube.com/embed/${videoNum}" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> | ||
113 | - | ||
114 | - <br> | ||
115 | - <br> | ||
116 | - ${commentDisplay} | ||
117 | - </body> | ||
118 | - </html> | ||
119 | - `; | ||
120 | - response.writeHead(200); | ||
121 | - response.end(body); | ||
122 | - },1000); | ||
123 | - | ||
124 | - }) | ||
125 | } | 128 | } |
126 | }); | 129 | }); |
127 | app.listen(3000); | 130 | app.listen(3000); |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
-
Please register or login to post a comment