将 JSON 对象从 rails 控制器发送到 Javascript

Posted 2023-04-15

【中文标题】将 JSON 对象从 rails 控制器发送到 Javascript

【英文标题】：Send JSON object from rails controller to Javascript

【发布时间】：2016-01-09 10:43:33

【问题描述】：

所以我有一个我构建的哈希，看起来像这样：

Track_list = :track1=>:url=>"https://open.spotify.com/track/2Oehrcv4Kov0SuIgWyQY9e", :name=>"Demons",
 :track2=>:url=>"https://open.spotify.com/track/0z8yrlXSjnI29Rv30RssNI", :name=>"Shots - Broiler Remix",
 :track3=>:url=>"https://open.spotify.com/track/6Ep6BzIOB9tz3P4sWqiiAB", :name=>"Radioactive",
 :track4=>:url=>"https://open.spotify.com/track/3I05foFixB2sSZvV5Ppty8", :name=>"Blank Space/Stand By Me - Medley / Live From Spotify London",
 :track5=>:url=>"https://open.spotify.com/track/4G8gkOterJn0Ywt6uhqbhp", :name=>"Radioactive"

我正在尝试将该哈希转换为 JSON，以便可以在我的 JS 文件中使用它，这就是我在控制器中所做的：

@tl = track_list.as_json
# and it produces a result like this:
# "track1"=>"url"=>"https://open.spotify.com/track /2Oehrcv4Kov0SuIgWyQY9e", "name"=>"Demons",
# "track2"=>"url"=>"https://open.spotify.com/track/0z8yrlXSjnI29Rv30RssNI", "name"=>"Shots - Broiler Remix",
# "track3"=>"url"=>"https://open.spotify.com/track/6Ep6BzIOB9tz3P4sWqiiAB", "name"=>"Radioactive",
# "track4"=>"url"=>"https://open.spotify.com/track/3I05foFixB2sSZvV5Ppty8", "name"=>"Blank Space/Stand By Me - Medley / Live From Spotify London",
# "track5"=>"url"=>"https://open.spotify.com/track/4G8gkOterJn0Ywt6uhqbhp", "name"=>"Radioactive"

但是，当我转到我的 JS 文件并尝试打印出该文件时，这就是我得到的：

console.log("<%= @tl %>");
"&quot;track1&quot;:&quot;url&quot;:&quot;https://open.spotify.com/track/2Oehrcv4Kov0SuIgWyQY9e&quot;,&quot;name&quot;:&quot;Demons&quot;,&quot;track2&quot;:&quot;url&quot;:&quot;https://open.spotify.com/track/0z8yrlXSjnI29Rv30RssNI&quot;,&quot;name&quot;:&quot;Shots - Broiler Remix&quot;,&quot;track3&quot;:&quot;url&quot;:&quot;https://open.spotify.com/track/6Ep6BzIOB9tz3P4sWqiiAB&quot;,&quot;name&quot;:&quot;Radioactive&quot;,&quot;track4&quot;:&quot;url&quot;:&quot;https://open.spotify.com/track/3I05foFixB2sSZvV5Ppty8&quot;,&quot;name&quot;:&quot;Blank Space/Stand By Me - Medley / Live From Spotify London&quot;,&quot;track5&quot;:&quot;url&quot;:&quot;https://open.spotify.com/track/4G8gkOterJn0Ywt6uhqbhp&quot;,&quot;name&quot;:&quot;Radioactive&quot;"

当我尝试这样做时：

console.log(JSON.parse("<%= @tl %>");

它不起作用。我还尝试将j 放在@tl 前面，它给了我一个错误，说哈希不能与gsub 一起使用。

另外，当我尝试这样做时：

@track_list = JSON.generate(@tl) # from above

我明白了：

"\"track1\":\"url\":\"https://open.spotify.com/track/2Oehrcv4Kov0SuIgWyQY9e\",\"name\":\"Demons\",\"track2\":\"url\":\"https://open.spotify.com/track/0z8yrlXSjnI29Rv30RssNI\",\"name\":\"Shots - Broiler Remix\",\"track3\":\"url\":\"https://open.spotify.com/track/6Ep6BzIOB9tz3P4sWqiiAB\",\"name\":\"Radioactive\",\"track4\":\"url\":\"https://open.spotify.com/track/3I05foFixB2sSZvV5Ppty8\",\"name\":\"Blank Space/Stand By Me - Medley / Live From Spotify London\",\"track5\":\"url\":\"https://open.spotify.com/track/4G8gkOterJn0Ywt6uhqbhp\",\"name\":\"Radioactive\""

所以它实际上正确地转义了所有内容......我不知道为什么当我在我的 JS 文件中使用相同的变量时，它并没有转义引号或任何东西。

谢谢！

【参考方案1】：

您可以通过这样做将 JSON 对象从 Rails 控制器发送到 javascript：

console.log("<%= @tl.to_json.html_safe %>");

【讨论】：

天哪，你太棒了。为什么 html_safe 工作？这实际上是做什么的>

有时，ERB 可能会转义 JSON，因为它认为它不是 html 安全的。所以，当你像这样使用html_safe 时它会起作用。

【参考方案2】：

试试这个：

var my_obj = <%= j @tl %>;
console.log(my_obj);

您只有几个小问题。您确实需要在您的视图中使用escape_javascript（或其别名j）。但是您也将 json 对象粘贴在引号之间，这将导致浏览器将其视为字符串而不是 json 对象。