Невозможно отобразить JSON в html - node.js

Вероятно, это простое решение, однако я не могу понять, как перенести мой объект JSON на мой взгляд. Обычно вы бросаете JSON в res.render () внутри вашего app.get ... к сожалению, у меня проблемы. Проблема возникает из-за того, что мне нужно иметь возможность отправлять данные формы из html в мой запрос API, а затем захватывать этот объект JSON и отображать его в моем представлении. Я вижу это в своей консоли, но не могу перенести в HTML. Хотел бы получить помощь или руководство о том, как улучшить мой код или найти решение. Любая помощь приветствуется! - См. Код ниже:

Server.js

var path = require('path');
var express = require('express');
var exphbs  = require('express-handlebars');
var bodyParser = require('body-parser');
var Bls2 = require('bls2');

var app = express();

app.engine('html', exphbs({ extname: '.html' }));
app.set('view engine', 'html');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

var blsRequest = function(req, res, inputContent){
    const API_KEY = //bls API key here
    let bls = new Bls2(API_KEY);
    console.info('this is seriesID =', inputContent);

    let options = {
        'seriesid': [inputContent],
        'startyear': '2008',  
        'endyear': '2018',
        // ...
    };

    bls.fetch(options).then(function (response) {
        var data = JSON.stringify(response)
        console.info(data);
        console.info('API Call Complete')

        res.send({data : data}); //need to render home view and JSON HERE
    });
}

app.get('/', function (req, res) {

    res.render('home');
});

app.post('/', function(req, res){
    let inputContent = req.body.seriesID;
    blsRequest(req, res, inputContent);

});

app.listen(8000);

html

<!DOCTYPE html>
<html>
<head>
    <title>LBS</title>
    <meta charset = "utf-8">
    <script src = "https://code.jquery.com/jquery-3.3.1.js" integrity = "sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60 = "crossorigin = "anonymous"></script>
</head>
<body>
    <div class = "container-fluid">
        <form id = "seriesID">
            <div class = "form-group" method = "post" action='/'>
                <label for = "seriesID">Input Series ID</label>
                <input type = "text" class = "form-control" name = "seriesID" placeholder = "Series ID">
            </div>
            <button class = "btn btn-primary" type = "submit"  >Search</button>
        </form><br>

        uhh JSON should be here: {{data}}
    </div>
</body>
    <script type = "text/javascript">
        $("#seriesID").submit(function (event) {
            $.post('/', $("#seriesID").serialize(), function (data) {
                 //data is the response from the backend
            });
            event.preventDefault();
        });
    </script>
</html>

Там, где у вас есть res.send, замените его на res.render('home', {data})

— 29.09.2018 07:04

Отметьте это stackoverflow.com/questions/21843840/…

— 29.09.2018 07:08

Я пробовал как res.render('home', {data}), так и res.render('home', {data : data}), ни одна из них не работает

— 30.09.2018 01:28

javascript html json node.js express

29.09.2018 06:58

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

1 435

Ответы 1

использовать res.render('home',{data}); потому что ваш {{data}} не определен, поэтому он ничего не печатает даже лучше использовать {{JSON.stringify(data)}}

Я пробовал как res.render('home', {data}), так и res.render('home', {data : data}), ни одна из них не работает. Также я веду данные журнала консоли. я вижу объект в консоли, я просто не могу перенести его в html

— 30.09.2018 01:30

29.09.2018 10:56