From 84b934e8508bcc87c66a647409d9f9719cc6c605 Mon Sep 17 00:00:00 2001 From: Muhun Kim Date: Fri, 11 Sep 2020 13:30:17 +0900 Subject: [PATCH] =?UTF-8?q?=EC=9B=B9=20=ED=99=95=EC=9E=A5=20=EC=8B=A4?= =?UTF-8?q?=EC=8A=B5=20=EC=BD=94=EB=93=9C=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 정인님이 준비한 실습 코드에 오류가 있었네요. code.js 를 manifest의 content_script 와 app.js 에서 두번 불러옵니다. Co-authored-by: JeonginKim --- handson/just-news/extensions/app.js | 114 +++++++++++++++++++++ handson/just-news/extensions/icon.png | Bin 0 -> 4985 bytes handson/just-news/extensions/manifest.json | 19 ++++ 3 files changed, 133 insertions(+) create mode 100644 handson/just-news/extensions/app.js create mode 100644 handson/just-news/extensions/icon.png create mode 100644 handson/just-news/extensions/manifest.json diff --git a/handson/just-news/extensions/app.js b/handson/just-news/extensions/app.js new file mode 100644 index 0000000..e4f04eb --- /dev/null +++ b/handson/just-news/extensions/app.js @@ -0,0 +1,114 @@ +const optOutQueryKey = 'just_news' + +function optOutUrl() { + let query = window.location.search + if (query) { + query += `&${optOutQueryKey}=false` + } else { + query = `?${optOutQueryKey}=false` + } + return window.location.origin + window.location.pathname + query +} + +function reconstruct(articleInfo, adSelectors) { + const root = document.createElement('html') + document.replaceChild(root, document.documentElement) + root.innerHTML = [ + '', + '', + '', + `${articleInfo.title}`, + '', + '', + '
', + '
', + '', + ].join('') + + const style = document.createElement('style') + style.innerHTML = `@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic|Nanum+Myeongjo&display=swap'); + body { + display: flex; + flex-direction: column; + align-items: center; + margin-top: 10px; + margin-bottom: 60vh; + text-align: center; + font-family: 'Nanum Myeongjo', serif; + } + article { + width: 640px; + text-align: justify; + } + .time-stemp { + color: #888; + font-size: 10pt; + text-align: left; + } + ` + document.body.append(style) + + const article = root.querySelector('article') + + article.append(articleInfo.content) + + for (const adSelector of adSelectors) { + const element = article.querySelector(adSelector) + if (element === null) { + continue + } + element.remove() + } + article.insertAdjacentHTML( + 'afterbegin', + `

작성자: ${articleInfo.repoter}

` + ) + article.insertAdjacentHTML( + 'afterbegin', + `

작성일: ${articleInfo.timeStemp}

` + ) + article.insertAdjacentHTML('afterbegin', `

${articleInfo.title}

`) + article.insertAdjacentHTML( + 'afterbegin', + `원본 페이지 보기` + ) +} + +const sites = { + 'mediahub.seoul.go.kr': { + title: '#main > h1', + timeStemp: '.date', + repoter: '.user', + content: '.pf-content', + }, + 'www.bloter.net': { + title: '.headline', + timeStemp: '.publish', + repoter: '.author--name', + content: '.article--content', + }, +} + +const sitesAd = { + 'mediahub.seoul.go.kr': [], + 'www.bloter.net': [ + '.article--content-ad__container', + '.denim-shortcode--title', + '.bloter-plus--article', + '.related-post--article', + '.goog-te-banner', + '#goog-gt-tt', + ], +} + +const site = sites[location.hostname] +const adSelectors = sitesAd[location.hostname] + +const articleInfo = { + title: document.querySelector(site.title).innerText, + timeStemp: document.querySelector(site.timeStemp).innerText, + repoter: document.querySelector(site.repoter).innerText, + content: document.querySelector(site.content).cloneNode(true), +} + +reconstruct(articleInfo, adSelectors) diff --git a/handson/just-news/extensions/icon.png b/handson/just-news/extensions/icon.png new file mode 100644 index 0000000000000000000000000000000000000000..84ef3dc57ad92c915ff0b5b5ead9f4df5c52d12e GIT binary patch literal 4985 zcmcIoXIN9q*50940hJ=n2pCb2&_ohQKm;k$480RNQW8iYKq#RX5d>5~KoCJex>Tiu z^lqaH2m(qm6a^{54d<|AO$}8P z#gdLY10ChvjzsrS3+ZEFzyt4+$<@blKrP85C{^ko^CjMG}ci9WzzN842j!B_A5iM|xf+_{O?9;4_81Qdv;)S@ zQNqsydz=L*`oSr#ha(;h_VaM}#KHX#LVqCO6#qC36$1YO!Mh=ZOm+0Z*D>CX;42cc z5|TnlCNLPR=nC=j}Q_%Ci=VmHBS%h-$b6czf@85LH*EJ zsFZ{x^#4o3yE^?dz5kVU{N>NIKUDomrbt;D_;qhbG#=w^h{3oc|8s*Bq5p~aXQqnB zCE;? z&=0g`<=QV|#JTpJ_m;%n}Uq{oAXV{eZ&d($eo`OU5Vza^s5t z@)T~Up5iQH%uB|?LT$l340QhuW6VRn#u-)XTKDC-OwNc}rUefcsas-8*Xx_`a&$n1 zQ;he3=8R*R^ANJ&)9nzhE}gL;5!<1e6H9{TE|)VSe;AC}X9&|7k37^Z!nxLeFk7vi zKj3u2y$()Toq48n%P>%o|L7|2@RU6AoA2To+7oim;yfNzz+|Qaa9(k+?1Y_Lvlshj zkZivDULJz0h3$0PtH$-!*cV36Vsc);D?ZC@v7JJM)8|w9}gqa~fc#^pL;uBeoXu1@n5x zOf5dVfX5w1d$#9Er;}6@5#1qEv5d}>?1!T`L zy!%c+mxa$XCx)oG&9L)NbIYeiJ5BxPy*LIW;C{AE45$X$nHl$nS57@!*-P_vLB-be9X9$ zlBytvpdOCP>77vG20U^-c(u6D`{&EO2uq8vxWd@d6Yi3_z}V!cc0PT%ZwDo zXH`R^i*}x`C%ObZhV@O(9n^}9-vn+hSJucSF;5lx(~4a*I7;qxf?c;iJuNxyGZ^|g z@zI7zM556ab}|o;r6aTQ_l%qoL{G9P81s$1c4jAs(=Z0m{$Vt)g^kgv?d&DZ6iqAB0`PIQPYEJ*yH5qk10X|n~ zEr2^W6%MKDHzd9&(le+u(xz2dC=C#BYQE~2Ku!oRwTxI#>sCSNFn}wfvg?qSVgRL`5?gffUlLRs3+CkGM~%kR%-MniV8h}Vf5{jO0pc z(R_pa*_)R8WEVp>dA`nuWeG9Bt7SL(j>^T&RWfgpPp)Zn?iatP)e9A6oq3DWJYLLE zhgXG$x}Hxt-)ikiZy_?Rd-a`Nd8R0_Cpd^m$dVf#)bu=kVp3{)LOrx^lC;4mI?1d6 zgG8A}lJ;&)Fc?k_0=qEMr}(VfPEcPhT}RYzx&0{)FzoDXHg#r*Pa2};GzhCRUfo-C;tcGCF~KLm-LVo89iei|aM`k$?v>w%0HFa$!Po^1i&rB6)-kZ!ng_wIcqY?^0-rBJ?n1E9=a-jfosx- zM%scLwM~}H@KzVG{Av^co>#bL#GcODVXd zOHxsA2KBd}7_K{|80M7#^^BTN#M!3xYxE3$Of_PgVodv?qJ_ADxU2@q!g?o~nNSnr z(@B;;_uPZ8l(M^|W*Z)zX~q?_GJ7iSAQ*R_;iCA z>5xg%egoR-fRHi^?sx5Kmi%53Img{*KHKzOjb_&+XWl1>6O

uo3M4=DBa>vfoK) zvE{y!T~txmoxJ;9)hX8dr}V7&U^^V2)z$}02AbXq6|B~E81FNv`XO7156#*}Q;OA9 zEjIf3#Sgd-;I1aCfga0ii*DwNyVFP9W3KdlPC>#>(YO!6cS<@CV&TT3qW(X6_oyRU zF5I+^)E;`oo(xPqdhPrxnr`sQW&`5EuKR3M{QTU2U&6f7>z_ze#0oK@_Vo~G&-%Vq zJNBDq1DlGxKooIK`X1}>+j_>IKR&cHjIXZKTpXxAvNn$V{>^Ishn9@)JBtn*_>8#O zO#NnPa6X{g*1}9Q9J|i&tweB%Wu}P2Wr?WEW zj}|;~TS`pg$LtWYslU82~n6a)B93ji!Y8up7h5C5-CQIQ^)j9f2#-u?9 zre`T0@DBdoed)o*#6d9A=idgW!veORv_JxlA%djQ7U504PsN@SdPtkdwn_@e+o_Nu-tJB@h&P4+e<3_C1QQ7g`kg1guKd4L_;ze5KYP%szkekSiU`Js(hkfsU9-_Us>C*hII^?^b{1bUro)EGh zq(;%aaO*zIDS>RuAfZb;G|{ayr%t;&5}3O;|Ir;#ztYMetmD3c%HEGOYtqjiE8w=c$efo3+rM&|Iejz>2LLwFDy1{ zMcqeipKPNadC1)+DkKRa3|{fZWj@5XuaP~Jt8UI%PE$^2-_^h?NB-*tGe*N9O$IVH z0ezABJ8_|QJ(25RjXidDEr!P}(k<_P7ML`5j`%^*5D=J2Ze!YJ41II2Pn6HiSJ7i- zg1*baE>- zwPKrl5kXo2b+Im?+N7BD8lrdVyFWGw#y7mJKxNEZWnD~Xd?L@Kd|>V~6`LDxk2pB@ z1x^j_TJ+ltJb5voE!FP`m0Yt3%N)OJ{odbdelapVL^RoS8LQYHIM=z{z?l?}fmM$P zGU_>=g1wa=)%St}A70sk(WgmGmrtjM$KR^^1lmD5&@3P>FWk~Rw7AKqu`Bq7v;6{kwmBcxQ)0avCx}|f49?1hoYy%)F<-+6#(A$U1TJKl?h_{? zi)?7R1&+Y{M@SP8%s`;jZvpZ<&v7j7NgRM`OcSyCLafiPZ_FN|i-#xLC%gChH`2^T ziyj6aQ2`?Zg#5tLTIeR)YEJ|g64LZa*W6AHF8f9FqP7>J%kMn4tnF}TAy*Y z!ew$w`rLZgiL9B>xNBr8)hWTc?dHXGS-itH$mroT@gy)q+wyRZhak;Q?q1hShIA$8 z2^{o@dn7&G;=uV0P0y@PD21oJtZFTXOp3%?kKRa^0=K2DUG;qKy(7$ccgOtj{I#4V zftjbeVvl~c+V9BeG<^1VA${?uYSdX)3;3{nU5Pd)U2gO+PU!dY=1*NAM0bK_l}Vv) zytAEL(90}*bF$8P<^yi-Ans_LvGM)A50M6^KGBU!jYKU~d;k2h zHuCN#Ygj--TS#v>2{OGuBsL`DmU=heHD5V;Ywc_oac%FUAFta{`gxDXq