Nano Hash - криптовалюты, майнинг, программирование

Как обслуживать веб-страницу HTML при рендеринге стилей CSS из внешней таблицы стилей — стили игнорируются

Я пытаюсь написать очень простой веб-сервер, который обслуживает одну статическую веб-страницу с базовым стилем CSS.

Итак, запрос сделан в /, затем отображается страница index.html - С ее стилем.

Проблема: страница index.html отображается, но стиль не применяется... кажется, что он просто игнорирует его.

Я видел 3-5 других подобных вопросов здесь, ни один из которых не помог. Все они предлагают использовать FileServer, который никогда не объяснялся. Я просто хочу отобразить html-страницу с ее стилем. Я не понимаю, зачем нам нужен файловый сервер для рендеринга HTML-страницы с каким-то стилем.

Я могу добиться этого в Python, используя flask, очень просто, сказав return render_template().

сервер.го:

package main

import (
    "log"
    "net/http"
)

func main() {
    http.HandleFunc("/", indexHandler)

    log.Fatal(http.ListenAndServe(":8081", nil))
}

func indexHandler(w http.ResponseWriter, r *http.Request) {
    http.ServeFile(w, r, "index.html")
    return
}

индекс.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sam Wood | Simple Go Web Server</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h1>Simple Go Web Server</h1>
</body>
</html>
* {
    margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;
}

body {
    background-color: coral;
    color: cadetblue;
}
12.02.2021

  • Вы отвечаете на каждый запрос содержимым index.html. Это включает в себя запрос на style.css. 12.02.2021

Ответы:


1

Вам нужно убедиться, что вы обслуживаете файл css, чтобы браузер загружал его с вашего сервера при отображении HTML-страницы.

В коде вам нужно иметь два вызова http.Handle*. Честно говоря, я не знаю, как это сделать, если файлы не находятся в каталогах.

/html/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sam Wood | Simple Go Web Server v1.1 </title>
    <link rel="stylesheet" href="/css/style.css"> <!-- Emphasis here /css/style.css -->
</head>
<body>
    <h1>Simple Go Web Server v1.1</h1>
</body>
</html>

/static/css/style.css

(То же, что и ваш код выше)

/main.go

package main

import (
    "log"
    "net/http"
)

func main() {
    http.HandleFunc("/", indexHandler)
    http.Handle("/css/", http.FileServer(http.Dir("static"))) // This is where we can tell go to serve the files in the static/css/ directory

    log.Fatal(http.ListenAndServe(":8081", nil))
}

func indexHandler(w http.ResponseWriter, r *http.Request) {
    http.ServeFile(w, r, "./html/index.html")
    return
}
12.02.2021
  • Спасибо. Теперь это имеет больше смысла для меня. В файле index.html я ссылаюсь на таблицу стилей css/style.css, но если не существует файлового сервера, который фактически размещает/обслуживает этот файл, его нельзя использовать. 12.02.2021
  • Новые материалы

    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..

    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..

    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..

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

    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..

    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..

    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..