Steem 글을 HTML 및 HTML 소스로 보여주는 페이지를 만들었습니다.(Steem to HTML page, source code)

View this thread on: d.buzz | hive.blog | peakd.com | ecency.com
·@junn·
0.000 HBD
Steem 글을 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 이용하시는 분들은 크게 어렵지 않은 내용이라 소스도 그냥 풀어둡니다.

&nbsp;

사용하는 주소는 : <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 버튼을 누르시면 됩니다.

&nbsp;

몇군데만 설명하면

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>

필요하신 분들은 유용하게 사용하시기 바랍니다.
👍 , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ,