0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

EJSで何が入ってるかわからない文字列をJavaScriptの変数に渡す

Last updated at Posted at 2021-08-27

はじめに

基本的なEJS構文についてはmiwashutaro0611様の記事を参考にしてください。

追記

できれば<%- %>を使いたくないので

<% var json_ejs = encodeURIComponent(JSON.stringify({markdown:markdown})) %>
<script language="javascript" type="text/javascript">
 const json = "<%= json_ejs%>";
 var markdown = JSON.parse(decodeURIComponent(json)).markdown;
</script>

の方がいいかもしれません。

変換

次のように変換します。

<%# markdown は何が入っているかわからない文字列です%>

<% var json_ejs = JSON.stringify({markdown:encodeURIComponent(markdown)}) %>
<script language="javascript" type="text/javascript">
 const json = <%-json_ejs%>;
 var markdown = decodeURIComponent(json.markdown);
</script>


以下 説明(試したこと)

普通の渡し方

普通にやると

var text = <%= markdown %>

ですが改行や"などに対応していません。

JSON.stringify と <%- %>

json形式に変換した後、<%- %>でオブジェクトとして出力します。

<%# markdown は何が入っているかわからない文字列です%>

<% var json_ejs = JSON.stringify({markdown:markdown}) %>
<script language="javascript" type="text/javascript">
 const json = <%-json_ejs%>;
 var markdown = json.markdown;
</script>

ですが<%- %>で出力するため

var markdown = 'console.log("💩");</script>';

のようにscriptタグを含まれると💩だけ残して強制終了します。

encodeURIComponentとdecodeURIComponent

一時的にencodeURIComponentを通してタグをエスケープします。
参考: https://shanabrian.com/web/javascript/escape-encode-uri-component.php

一番上のコード

おわりに

間違いやもっと良い方法がありましたらコメントをお願いします。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?