簡體   English   中英

在沒有json解析的情況下在jade中輸出服務器生成的json對象

[英]Output a server generated json object in jade without json parse

我有一個不符合JSON標准的JSON對象,我無法更改對象的結構以使其符合JSON標准。

我需要在Jade模板中的javascript塊中間渲染此對象。 該對象實際上是一個配置對象,它位於模板的功能塊中。

這是對象。

{
  services: [],
  version: "1438276796258",
  country: "default",
  role: "User",
  Zack_Init: function () {

  },
  Zack_Global: function (event) {

  },
  Zack_PostRender: function () {

  }, 
  renderers: ['Renderer', 'NONE']
}

更新以下是我從JS文件中獲取該對象的方法。

function readJSFile(url, filename, callback) {
  fs.readFile(url, "utf-8", function (err, data) {
    if (err) {
      callback(err);
      return;
    }
    try {
      callback(filename, data);
    } catch (exception) {
      callback(exception);
    }
  });
}

當JSON.stringify處理對象時,它會在轉換過程中刪除三個函數。

我正在添加一個plunker來顯示當前解決方案的進度。 其中輸出如下。 唯一剩下的就是刪除格式化字符。

{"services":[],"version":"1438276796258","country":"default","role":"User","Zack_Init":function () {\n\n },"Zack_Global":function (event) {\n\n },"Zack_PostRender":function () {\n\n },"renderers":["Renderer","NONE"]}

 function convertToString(obj) { return JSON.stringify(obj, function(k, v) { return (typeof v === 'function' ? ['@@beginFunction@@', v.toString(), '@@endFunction@@'].join('') : v); }).replace(/"@@beginFunction@@|@@endFunction@@"/g, ''); } obj = { services: [], version: "1438276796258", country: "default", role: "User", Zack_Init: function() { }, Zack_Global: function(event) { }, Zack_PostRender: function() { }, renderers: ['Renderer', 'NONE'] }; $('#test').text(convertToString(obj)); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="test"></div> 

如果我正確理解您的請求(您想要獲取外部加載的文件的內容然后將其加載到<script>塊中),我認為到目前為止已經探索過的解決方案大部分都是過度設計的。

這就是我所擁有的:

// index.js
var express = require('express');
var router = express.Router();
var fs = require('fs');

router.get('/', function(req, res, next) {
  readJSFile('./whacky_obj.js', 'whacky_json_obj.js', render); // used .js because OP implies that as the file source in the extraction method
  function render(fname, obj) {
    res.render('index', { jsObj: obj });
  }
});

// OP's readJSFile method
function readJSFile(url, filename, callback) {
  fs.readFile(url, "utf-8", function (err, data) {
    if (err) {
      callback(err);
      return;
    }
    try {
      callback(filename, data);
    } catch (exception) {
      callback(exception);
    }
  });
}

module.exports = router;

然后在你的Jade文件中:

block content
  h1= title
  script!= jsObj

如果你為pre交換script ,你可以看到jsObj變量的輸出,但是script會做你要求的。

為了安全刪除新行字符,應首先刪除“注釋”:

 function convertToString(obj) { return JSON.stringify(obj, function(k, v) { return ( typeof v !== 'function' ? v : v.toString().replace(/\\/\\/.*?$/mg, '') // removes single line comments .replace(/\\/\\*[\\s\\S]*?\\*\\//g, '') // removes multi-line comments .replace(/[\\r\\n]/g, '') // removes new line ); }, 2).replace(/"(function.+)",?$/gm, '$1'); // removes quotes around functions } obj = { services: [], version: "1438276796258", country: "default", role: "User", Zack_Init: function() { // comment var a = 1;// comment // if(a === /*comment */ 3) {//comment /* comment comment*/ } /*end*/ }, Zack_Global: function(event) { }, Zack_PostRender: function() { }, renderers: ['Renderer', 'NONE'] }; $('#result').text(convertToString(obj)); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <pre id="result"></pre> 

編輯:配置對象是否需要動態選擇或修改? 你能用一個包括嗎? 如果沒有,那么未轉義的緩沖區代碼( http://jade-lang.com/reference/code/ )似乎就像使用readFile傳回的字符串一樣。


Stringify解決方案:

編輯:比我原來的提案更好的解決方案:

function funcyStringify(obj) {
    var funcMap = {};
    var sections = JSON.stringify(obj, function(k, v) {
        if (typeof v === 'function') {
            funcMap[k] = v;
            return ['@@function@@', k, '@@function@@'].join('');
        }
        return v;
    }).split(/"?@@function@@"?/g);
    for (var i = 1; i < sections.length-1; i+=2) {
        sections[i] = funcMap[sections[i]];
    }
    return sections.join('');
}

如果您需要在引用不同函數的嵌套對象中具有相同的屬性名稱,則需要更多工作。


最初寫道:

不熟悉Jade在其中鍵入此內容,但使用EJS,您可以執行以下操作:

<script>
var configObject = {
<% for (var key in configObject) {
     if (configObject.hasOwnProperty(key)) { %>
       <%- key %>:
       <% if (typeof configObject[key] === 'function') { %>
           <%- configObject[key].toString() %>
       <% } else { %>
           <%- JSON.stringify(configObject[key]) %>
       <% } %>
<% } } %>
};
</script>

如果你有頂級以下的函數,會變得更復雜。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM