OrgmodeからのHTMLエクスポートにBase64として画像を埋め込む


8

目標は、orgmodeからエクスポートするときに自己完結型のhtmlファイルを作成して、画像がファイルに固有であり、単一のhtmlファイルを配布できるようにすることです(私が教えており、学生に提供したいクラスに対してこれを試みています)ブラウザで開くことができる単一のhtml)。

私が欲しいもののアイデアを与えるコードのスニペットをオンラインで見つけました:

#+BEGIN_SRC python :results output html :exports results
with open('/home/britt/Pictures/Britt0001.jpg', 'rb') as image:
    data = image.read()
    print '<img src="data:image/jpg;base64,%s">' % data.encode("base64")
#+END_SRC

そして、私はそれをelispに入れて、Pythonへの依存を取り除こうとしています。そして、より詳細な独自のelisp関数を作成するためのステップとして。

これが私が得たものです。アドバイスありがとうございます。

#+BEGIN_src elisp :results output html :exports results
    (setq myim (concat "<img src=\\"data:image/jpg;base64," (tob64 "/home/britt/Pictures/Britt0001.jpg") ">"))
     (print myim)
#+END_SRC

そしてどこtob64

(defun tob64 (filename)
  (base64-encode-string
   (with-temp-buffer
     (insert-file-contents filename)
     (buffer-string))))

これは正しいフォーマットと引用を与えません。

目指すべき目標org-html-export-to-htmlは、elisp関数を実行して、などのオプションが呼び出されたときに呼び出すことができる場所の バリアントです#+OPTIONS: embed-images-on-html-export:t

余談ですが、なぜ画像が埋め込まれたhtmlにエクスポートする機能がorg-modeに存在しないのですか?私がこれから取り組むことに問題を引き起こす大きな問題はありますか?

回答:


3

http://kitchingroup.cheme.cmu.edu/blog/2015/05/09/Another-approach-to-embedding-org-source-in-html/を参照してください。

これを見つけることもできます:https : //github.com/KitchinHUB/kitchingroup-66/blob/master/manuscript.org#the-custom-export-code-labelexport-code htmlでbase64データをエンコードする興味深い方法。

あなたのコードは私のために働きます:

#+BEGIN_SRC emacs-lisp :results html :exports both
(defun tob64 (filename)
  (base64-encode-string
   (with-temp-buffer
     (insert-file-contents filename)
     (buffer-string))))

(format "<img src=\"data:image/png;base64,%s\">"
    (tob64 "/Users/jkitchin/t.png"))
#+END_SRC

エクスポートで確認できるbase64エンコード画像を出力します。

これをエクスポートで自動的に機能させるには、おそらくorg-export-before-processing-hookの関数を使用して、ファイルリンクを通過させ、上記のような関数の出力を含むhtmlブロックに置き換える必要があります。


お時間をいただきありがとうございます。私にとっての問題は、私がしようとして保たれていることでしたprintinsert。今すぐ読みますformat。物事の名前がわからないときに何を探すべきかわからない。フックの使用に関するアドバイスを探ります。これは何か価値のあるもののように聞こえませんか?
brittAnderson 2016

これは、電子メールで送信したり、単に転送したりできるスタンドアロンのhtmlファイルを作成する良い方法です。
John Kitchin、2016

2

redditスレッドからhttps://www.reddit.com/r/orgmode/comments/7dyywu/creating_a_selfcontained_html/

(defun replace-in-string (what with in)
  (replace-regexp-in-string (regexp-quote what) with in nil 'literal))

(defun org-html--format-image (source attributes info)
  (progn
    (setq source (replace-in-string "%20" " " source))
    (format "<img src=\"data:image/%s;base64,%s\"%s />"
            (or (file-name-extension source) "")
            (base64-encode-string
             (with-temp-buffer
               (insert-file-contents-literally source)
              (buffer-string)))
            (file-name-nondirectory source))))
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.