Добавление изображения с помощью веб-сокетов в файл pug

Question

Я создаю небольшое приложение с node.js и наткнулся на проблему. Я пытаюсь отправить img всем пользователям из моей учетной записи администратора. Проблема в том, что я не могу показать свое изображение через javascript, добавляя к div, который я сделал. Это из-за того, что я работаю с мопсом, он не отображает мое изображение?

Моя админская сторона

document.querySelector('#Function1').addEventListener("click", function (e) {
  alert('hi mom');

  primus.write({message: 'function1'});
  //console.log(id);
  e.preventDefault;
});

Моя клиентская сторона

var image = "images/logo.png";

primus.on("data", function (data) {
  if (data.message != undefined) {
    if (data.message == 'function1') {
      document.querySelector("#functionShow").append("<img src="+image+"/>");
    } else {
      console.log('something went wrong');
    }
  }
});

Это показанный конечный результат

welkom Hanna

<img src=images/logo.png/>

Answer 1

Нет, это не вина мопса, мопс невиновен в этом преступлении:)

Что вы упускаете, так это цитаты вокруг "images/logo.png", это должно быть

var image ="images/logo.png";

primus.on("data", function (data) {
  if (data.message != undefined) {
    if (data.message == 'function1') {
      document.querySelector("#functionShow").append('<img src="'+image+'"/>');
    } else {
      console.log('something went wrong');
    }
  }
});

Это потому, что браузеры пытаются получить доступ к "logo.png" в виде папки.

Answer 2

@aperçu К сожалению, это тоже не сработало:(

Но я нашел решение! Кажется, мне пришлось создать элемент img и сделать это таким образом, я точно не знаю, почему

var elem = document.createElement("img");
elem.setAttribute("src", "images/logo.png");
elem.setAttribute("alt", "logo");

var elem2 = document.createElement("img");
elem2.setAttribute("src", "images/header.png");
elem2.setAttribute("alt", "logo");

primus.on("data", function (data) {
    if(data.message != undefined) {
        if(data.message == 'function1') {
            document.querySelector("#functionShow").append(elem);
        }if(data.message == 'function2') {
            document.querySelector("#functionShow").append(elem2);
        }
        else {
            console.log('i fucked up');
        }
    }
});