Steem 글을 HTML 및 HTML 소스로 보여주는 페이지를 만들었습니다.(Steem to HTML page, source code)
kr·@junn·
0.000 HBDSteem 글을 HTML 및 HTML 소스로 보여주는 페이지를 만들었습니다.(Steem to HTML page, source code)
<img class="alignnone size-large wp-image-2390" src="https://junn.in/wp-content/uploads/2018/02/스크린샷-2018-02-10-오후-6.27.43-1024x810.png" alt="" width="840" height="664" /> Mediteam.us의 댓글은 내부에 저장하지 않고 바로 steemit에서 불러와서 뿌려줍니다. 댓글에 마크다운을 쓰는 분들이 많아지다 보니, nodeJS에서 본문만 받아서 변환하던것을 어쩌다보니 브라우저 쪽에서도 작동시켜야해서, 이참에 그냥 페이지를 만들었습니다. <h2><strong>다른 사람이 쓴 글을 가져다 쓰는 것은 저작권 위반이 될 수 있으니, 본인이 쓰신 글을 외부 블로그에 옮기실 분들만 사용해주셨으면 합니다.</strong></h2> PHP, javascript 이용하시는 분들은 크게 어렵지 않은 내용이라 소스도 그냥 풀어둡니다. 사용하는 주소는 : <a href="https://junn.in/steem06_markdownToHTML.php">https://junn.in/steem06_markdownToHTML.php</a> Github : <a href="https://github.com/junn279/steemjs_example/blob/master/steem06_markdownToHTML.php">https://github.com/junn279/steemjs_example/blob/master/steem06_markdownToHTML.php</a> <img class="alignnone size-full wp-image-2391" src="https://junn.in/wp-content/uploads/2018/02/스크린샷-2018-02-10-오후-6.34.09.png" alt="" width="950" height="60" /> 이런 주소에서 ID는 junn, Permlink가 뒤에 steem-markdown....이 부분입니다. 넣고 Submit 버튼을 누르시면 됩니다. 몇군데만 설명하면 https://steemit.com/kr/@junn/steem-markdown-to-html-table-linebreak 에서 설명했던 Markdown Converter 사용과 SteemJS의 getContent 에 대한 예제가 되겠습니다. 깃헙예제와 아래에는 simplifiedAutoLink 를 추가했으나, 이경우 유튜브 동영상 바로 위에 링크(라이브러리가 알아서 추가해버린)에 의한 오타가 남아버려서 제 사이트의 소스에서는 빼놨습니다. ``` <script src="/jquery-3.3.1.min.js"></script> <script src="https://cdn.rawgit.com/showdownjs/showdown/1.8.6/dist/showdown.min.js"></script> <script src="//cdn.steemjs.com/lib/latest/steem.min.js"></script> //중략 jQuery(document).ready(function($) { var author = "<?=$id?>"; var permlink = "<?=$permlink?>"; steem.api.getContent(author,permlink, function(err, response) { console.log("Content", response); var converter = new showdown.Converter({ 'tables':true, 'strikethrough':true, 'simpleLineBreaks':true, 'simplifiedAutoLink':true }); var text = response.body, html_body = converter.makeHtml(text); html_body = changeYouTubeTag(imageSetting(html_body)); $('#contents').html(html_body); $('#source').html(html_body); }); }); ``` JQuery는 CDN으로 하려고 했더니 브라우져에서 막는 듯 해서 다운받아서 쓰셔야합니다. 아래 글을 참조해보니 PHP를 사용하지 않고 독립된 html 파일로도 만들 수 있는 것 같습니다. <a href="https://stackoverflow.com/questions/1961069/getting-value-get-or-post-variable-using-javascript">https://stackoverflow.com/questions/1961069/getting-value-get-or-post-variable-using-javascript</a> 필요하신 분들은 유용하게 사용하시기 바랍니다.
👍 junn, shin0288, nps0132, nhj12311, speedwg, cancerdoctor, chosungyun, raili, yangmok701, radiologist, verygoodsurgeon, hkmoon, kanser-memes, eyecontact, forhappywomen, doctorbme, vip, bramd, bien, hwan100, xinnong, feelingofwine, reggie031, chkim4431, toktok, olorin, tiny657, yahweh87, slowwalker, tmkor, pharmd, lylm, calist, millionfist, evegorilla, goodhello, public.domain, more.please.more, boradori86, forensicmon, seohj,