如何將 JSON object 與 arrays 從 Z62A004B95946BB97541AFA471DCCA7

Question

出於測試目的，我在 demo.js 中創建了一個 JSON object，它應該集成在 ejs 模板中。

如果我這樣做，在 ejs 頁面中一切正常。 但我創建了 JSON object dyn。 來自 SQL 查詢（見下文）。

這是我的設置：

演示.js

function gameData() {

    return {
        id: 13,
        round: 1,
        user: [{
            id: 4711,
            player_id: 1,
            name: "John",
            value: 3,
            active: 1
        }, {
            id: 4712,
            player_id: 2,
            name: "Phil",
            value: 3,
            active: 0
        }]
    }
}

module.exports = {
    gameData: gameData
}

應用程序.js

let gameDemo = require('./demo');

app.get('/game', (req, res) => {
    res.render('pages/game', {
        utils: gameDemo
    });
})

ejs網站

<% utils.gameData().user.forEach(function(element, index, item){ %>
    <%= element.player_id %>
<% }); %>

在這里，我創建了一個 MySQL 數據庫（5.7）連接並得到 JSON object 作為結果。 不幸的是，它不適用於那個。

應用程序.js

app.get('/game', (req, res) => {

    ...

    db.getConnection((error, connection) => {
        
        let sqlQuery = `SELECT
                            CONCAT("{",
                            CONCAT("id:" , g.id, ","),
                            CONCAT("round:" , g.round, ","),
                            CONCAT("user:", "[",
                                GROUP_CONCAT(
                                CONCAT("{"),
                                    CONCAT("id:" , gd.id, ","),
                                    CONCAT("player_id:" , gd.player_id, ","),
                                    CONCAT("name:" , gd.name, ","),
                                    CONCAT("value:" , gd.value, ","),
                                    CONCAT("active:" , gd.active, ","),
                                CONCAT("}")
                                )
                            ,"]")
                            ,"}")
                        AS json FROM game_data gd
                            INNER JOIN games g
                            ON g.game_id = gd.game_id
                        WHERE gd.game_id = '235816ab-2ad8-41b2-8375-d980e207e43f'`

        connection.query(sqlQuery, (err,row, fields) => { 
        
            res.render('pages/game', {
                utils: row[0].json
            });

        })
        connection.release();

    })
     
 })

索引.ejs

<% utils.gameData().user.forEach(function(element, index, item){ %>
     <%= element.player_id %>
<% }); %>

我收到錯誤： “無法讀取未定義的屬性 'forEach'”

如果我在 ejs 中調用<% = utils %> ，我會得到 JSON object 作為字符串。

Then I tried JSON.parse(row[0].json) and got SyntaxError: Unexpected token t in JSON at position 1 at JSON.parse ()

JSON.parse(result)顯示錯誤undefined:1 [object Object]

然后我嘗試了

app.get('/game', (req, res) => {

    ...

    db.getConnection((error, connection) => {
        
        let sqlQuery = `SELECT
                            CONCAT("{",
                            CONCAT("id:" , g.id, ","),
                            CONCAT("round:" , g.round, ","),
                            CONCAT("user:", "[",
                                GROUP_CONCAT(
                                CONCAT("{"),
                                    CONCAT("id:" , gd.id, ","),
                                    CONCAT("player_id:" , gd.player_id, ","),
                                    CONCAT("name:" , gd.name, ","),
                                    CONCAT("value:" , gd.value, ","),
                                    CONCAT("active:" , gd.active, ","),
                                CONCAT("}")
                                )
                            ,"]")
                            ,"}")
                        AS json FROM game_data gd
                            INNER JOIN games g
                            ON g.game_id = gd.game_id
                        WHERE gd.game_id = '235816ab-2ad8-41b2-8375-d980e207e43f'`

        connection.query(sqlQuery, (err, result) => { 

            res.render('pages/game', {
                utils: result[0].json // JSON Object
            });

        })
        connection.release();

    })
     
 })

在 ejs 文件中，我會得到一個 json object

console.log(<%= utils %>) // JSON Object in console OK
console.log(typeof <%= utils %>) // Object

如果我在 javascript 區域創建一個變量let obj = <%= utils %>; 我可以完全訪問數據。

但是，我如何從 ejs 的數組中獲取任何值？

Answer 1

我發現，如果查詢有“大”結果（超過 10 個鍵/值），鍵/值對有時會有換行符。 請參閱用戶密鑰 9。 沒有可識別的錯誤模式。

結果的奇怪行為。 該錯誤僅在用戶數組中的對象中發生一次。 但並不是每個 object 都會受到影響。

從 sql 結果中提取：

{
    "id": 13,
    "round": 1,
    "user": [{
        "1": 8,
        "2": 9,
        "3": 10,
        "4": 0,
    "5": 8,
    "6": 9,
    "7": 10,
    "8": 0,
    "9": 
    8,
    "10": 9,
    "11": 10,
    "12": 0,
    "13": 8,
    "14": 9,
    "15": 10
    }]
}

解決方案

我將 SQL 查詢放在雙引號中並將其轉義。 將 SQL 結果（字符串類型）解析為 Object 就是這樣。

db.getConnection((error, connection) => {

    let sqlQuery = `SELECT
      CONCAT("{",
        CONCAT("\\"id\\":" , g.id, ","),
        CONCAT("\\"round\\":" , g.round, ","),
        CONCAT("\\"user\\":", "[",
            GROUP_CONCAT(
              CONCAT("{"),
                  CONCAT("\\"id\\":" , gd.id, ","),
                  CONCAT("\\"player_id\\":" , gd.player_id, ","),
                  CONCAT("\\"name\\":" , gd.name, ","),
                  CONCAT("\\"value\\":" , gd.value, ","),
                  CONCAT("\\"active\\":" , gd.active, ","),
              CONCAT("}")
            )
        ,"]")
      ,"}")
  AS json FROM game_data gd
  INNER JOIN games g ON g.game_id = gd.game_id
  WHERE gd.game_id = '235816ab-2ad8-41b2-8375-d980e207e43f'`

    connection.query(sqlQuery, (err, result) => {

        let stringRes = result[0].json
        let obj = JSON.parse(stringRes)

        res.render('pages/game', {
            gamedata: obj
        });

    })
    connection.release();

})

現在我可以完全訪問 ejs 文件中的 JSON-Object。

object 中的值： <%= gamedata.id %>

用戶數組中的值： <%= gamedata.user[0].player_id %>

用戶數組中每個 object 的值：

<% for (var i = 0, l = gamedata.user.length; i < l; i++) {
  var obj = gamedata.user[i];
%>
  <option value="<%= i %>"><%= obj.player_id %></option>
<% } %>