Javascript running locally but not on heroku node js

Question

I have code which pulls a list of urls from a JSON file and then displays them. It is a node.js app. It works locally but then when I push to heroku it doesn't work.

// routing for the pages in question
app.get('/hottestlist', (req, res) => {
    res.sendFile(path.join(__dirname + '/hottestlist.html'));
});

app.get('/hottestListJSON', (req, res) => {
    let mysql = require('mysql');
    hottestListSQL = `SELECT url FROM pics ORDER BY score DESC; `;
    let con = mysql.createConnection({
        host    : '*****',
        user    : '*****',
        password: '*****',
        database: '*****'
      })
    con.query(hottestListSQL, (err, rows) => {
        if (err) {
            throw err;
        } else {
            res.send(rows);
        }
    });
    con.end();
});

Then in the hottestlist.html I have

<script>
            async function fetchAsync(url) {
                let response = await fetch(url);
                let data = await response.json();
                return data;
            }
            data = fetchAsync("/hottestListJSON");
            console.log(data);
            hottestJSON = data.rows;
            for (var i in hottestJSON) {
                var element = document.createElement('input');
                element.setAttribute("type", "image");
                element.setAttribute("style", "max-height:75%;max-width:75%;");
                element.setAttribute("class", "img-responsive");
                element.setAttribute("id", "one");
                element.setAttribute("src", `/${i}`);
                $("#imgDiv").append(element);
                console.log(hottestJSON);
            }
        </script>

JSON looks like this

[{"url":"8.jpg"},{"url":"42.jpg"},{"url":"56.jpg"},{"url":"81.jpg"},{"url":"107.jpg"},{"url":"113.jpg"},{"url":"118.jpg"},{"url":"124.jpg"},{"url":"125.jpg"},{"url":"140.jpg"},{"url":"145.jpg"},{"url":"157.jpg"},{"url":"182.jpg"},{"url":"201.jpg"},{"url":"220.jpg"},{"url":"225.jpg"},{"url":"228.jpg"},{"url":"236.jpg"},{"url":"254.jpg"},{"url":"261.jpg"},{"url":"296.jpg"},{"url":"305.jpg"},{"url":"345.jpg"},{"url":"348.jpg"},{"url":"381.jpg"},{"url":"396.jpg"},{"url":"485.jpg"},{"url":"505.jpg"},{"url":"507.jpg"},{"url":"553.jpg"},{"url":"555.jpg"},{"url":"614.jpg"},{"url":"624.jpg"},{"url":"666.jpg"},{"url":"673.jpg"},{"url":"729.jpg"},{"url":"737.jpg"},{"url":"767.jpg"},{"url":"792.jpg"},{"url":"796.jpg"},{"url":"801.jpg"},{"url":"818.jpg"},{"url":"824.jpg"},{"url":"832.jpg"},{"url":"833.jpg"},{"url":"855.jpg"},{"url":"875.jpg"},{"url":"879.jpg"},{"url":"883.jpg"},{"url":"908.jpg"},{"url":"912.jpg"},{"url":"916.jpg"},{"url":"1.jpg"},{"url":"2.jpg"},{"url":"4.jpg"},{"url":"5.jpg"},{"url":"6.jpg"},{"url":"7.jpg"},{"url":"9.jpg"},{"url":"11.jpg"},{"url":"13.jpg"}, ..... etc etc etc

The code runs locally but in heroku it no longer works. I would appreciate another eye to help my find a solution. Thanks in advance.