Почему мой CSS файл не загружается на Node-RED? - PullRequest
1 голос
/ 12 января 2020

Я создал очень простой поток Node-RED:

enter image description here

[{"id":"f2550b94.38775","type":"http in","z":"92cd7f6.acf58","name":"","url":"mypage","method":"get","upload":true,"swaggerDoc":"","x":150,"y":1820,"wires":[["d996137.45dc0f"]],"icon":"node-red/file-out.svg"},{"id":"34382576.899c32","type":"http response","z":"92cd7f6.acf58","name":"","statusCode":"","headers":{},"x":435,"y":1820,"wires":[],"l":false},{"id":"d996137.45dc0f","type":"template","z":"92cd7f6.acf58","name":"HTML","field":"payload","fieldType":"msg","format":"html","syntax":"mustache","template":"<!DOCTYPE html>\n<html>\n<head>\n    <link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\">\n</head>\n<body>\n    <h1>This is a heading</h1>\n    <p>This is a paragraph.</p>\n</body>\n</html>","output":"str","x":310,"y":1820,"wires":[["34382576.899c32"]],"icon":"node-red/parser-html.svg"},{"id":"d0acb79c.4200f8","type":"http in","z":"92cd7f6.acf58","name":"","url":"style.css","method":"get","upload":true,"swaggerDoc":"","x":150,"y":1860,"wires":[["7ff54806.73b928"]],"icon":"node-red/file-out.svg"},{"id":"750110.a3e6c6f","type":"http response","z":"92cd7f6.acf58","name":"","statusCode":"","headers":{"content-type":"text/css"},"x":435,"y":1860,"wires":[],"l":false},{"id":"7ff54806.73b928","type":"template","z":"92cd7f6.acf58","name":"CSS","field":"payload","fieldType":"msg","format":"css","syntax":"mustache","template":"body {\n    background-color: lightblue;\n}\n\nh1 {\n    color: navy;\n    margin-left: 20px;\n}","output":"str","x":310,"y":1860,"wires":[["750110.a3e6c6f"]],"icon":"node-red/parser-html.svg"}]

Код HTML внутри него: следующим образом:

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>
</body>
</html>

И код css внутри него:

body {
    background-color: lightblue;
}

h1 {
    color: navy;
    margin-left: 20px;
}

По какой-то причине код HTML на Node-RED не загружает css стиль на моей style.css странице. Я знаю, что этот пример прекрасно работает с отдельными файлами (без Node-RED), и я также знаю, что если я использую файл style.css с Nodejs вместо использования Node-RED, стиль будет загружаться правильно. Поэтому я считаю, что это специфическая c проблема с Node-RED ... Я что-то упустил из-за того, как это работает? Почему стиль css не загружается на mypage?


Страница должна быть такой:

enter image description here

Страница в виде Node-RED показывает:

enter image description here

1 Ответ

2 голосов
/ 12 января 2020

Вам необходимо установить заголовок Content-type в ответе на "text / css"

Как установить заголовки, описано в боковой панели для узла http-out:

Входы

  • полезная нагрузка строка Тело ответа.
  • statusCode число Если установить, это используется в качестве кода состояния ответа. По умолчанию: 200.
  • заголовки объект Если установлено, предоставляет заголовки HTTP для включения в ответ.
  • куки объект Если установлено, может использоваться для установки или удаления куки.

Подробности

Код состояния и заголовки также могут быть установлены внутри самого узла. Если свойство установлено в узле, оно не может быть переопределено соответствующим свойством сообщения.

enter image description here

...