Servlets racketservlet提供静态文件_Servlets_Racket_Static Files

Servlets racketservlet提供静态文件

servlets racket

Servlets racketservlet提供静态文件,servlets,racket,static-files,Servlets,Racket,Static Files,我想尝试和代码一些博客或个人网站或当地的网络服务在球拍。我已经完成了教程，然后找到了邮件列表条目。除此之外，我还使用了。基于URL的分派似乎比教程简单得多，因此我尝试了这一点，并获得了以下代码： #lang racket (provide/contract (start (-> request? response?))) (require web-server/templates web-server/servlet-env web-server/servlet w

我想尝试和代码一些博客或个人网站或当地的网络服务在球拍。我已经完成了教程，然后找到了邮件列表条目。除此之外，我还使用了。基于URL的分派似乎比教程简单得多，因此我尝试了这一点，并获得了以下代码：

#lang racket

(provide/contract
  (start (-> request? response?)))

(require
  web-server/templates
  web-server/servlet-env
  web-server/servlet
  web-server/dispatch)

;; =====
;; STATE
;; =====
(define (get-vocabulary-for-topic topic)
  ;; for now always returns the same
  (list
    (list "sich fuer eine Person entscheiden" "xuǎnzé" "32" "选择")
    (list "teilnehmen" "cānyù" "14" "参与")
    (list "die Wahl" "dàxuǎn" "43" "大选")))

;; ======================
;; APPS HANDLING REQUESTS
;; ======================

(define (vocabulary-app request topic)
  (response/full
    200 #"OK"
    (current-seconds) TEXT/HTML-MIME-TYPE
    empty
    (list (string->bytes/utf-8 (render-vocabulary-page topic)))))

(define (vocabulary-overview-app request)
  (response/xexpr
    `(html
       (head (title "Vocabulary Overview")
             (link ((rel "stylesheet") (href "css/general.css") (type "text/css"))))
       (body (p "This is an overview of vocabulary pages.")))))

(define (overview-app request)
  (response/full
    200 #"OK"
    (current-seconds) TEXT/HTML-MIME-TYPE
    empty
    (list (string->bytes/utf-8 (render-overview-page)))))

;; ===============
;; RENDERING STUFF
;; ===============

(define (render-vocabulary-page topic)
  (let
    ([vocabulary (get-vocabulary-for-topic topic)])
    (let
      ([content (render-vocabulary-table vocabulary)]
        [page-title "Vocabulary"]
        [special-css-imports
          (render-css-include "css/vocabulary-table.css")]
        [special-js-imports ""]
        [header ""]
        [footer ""]
        [navigation ""])
      (include-template
        "templates/base.html"))))

(define (render-vocabulary-table vocabulary)
  (let
    ([table-headers (list "German" "Pinyin" "Tones" "Chinese")]
      [word-list vocabulary])
    (include-template "templates/vocabulary-table.html")))

(define (render-overview-page)
  (let
    ([content
       (let
         ([subpage-titles (list "vocabulary")])
         (include-template "templates/overview.html"))]
      [page-title "Overview"]
      [special-css-imports ""]
      [special-js-imports ""]
      [header ""]
      [footer ""]
      [navigation ""])
    (include-template
      "templates/base.html")))

(define (render-css-include path)
  (let
    ([path path])
    (include-template "templates/css-link.html")))


;; ====================
;; ROUTES MANAGING CODE
;; ====================
(define (start request)
  ;; for now only calling the dispatch
  ;; we could put some action here, which shall happen before dispatch
  (blog-dispatch request))

(define-values (blog-dispatch blug-url)
  (dispatch-rules
    [("index") overview-app]
    [("vocabulary") vocabulary-overview-app]
    [("vocabulary" (string-arg)) vocabulary-app]))

(define (respond-unknown-file req)
  (let
    ([content (include-template "templates/unknown-file.html")]
      [page-title "unknown file"]
      [special-css-imports ""]
      [special-js-imports ""]
      [header ""]
      [footer ""]
      [navigation ""])
    (response/full
      404 #"ERROR"
      (current-seconds) TEXT/HTML-MIME-TYPE
      empty
      (list
        (string->bytes/utf-8
          (include-template "templates/base.html"))))))

;; ===========================
;; ADDED FOR RUNNING A SERVLET
;; ===========================
(serve/servlet
  start
  #:servlet-path "/index"  ; default URL
  #:extra-files-paths (list (build-path (current-directory) "static"))  ; directory for static files
  #:port 8000 ; the port on which the servlet is running
  #:servlet-regexp #rx""
  #:launch-browser? true  ; should racket show the servlet running in a browser upon startup?
  ;; #:quit? false  ; ???
  #:listen-ip false  ; the server will listen on ALL available IP addresses, not only on one specified
  #:server-root-path (current-directory)
  #:file-not-found-responder respond-unknown-file)

到目前为止，这一切都很好，只是当我导航到任何“子页面”时，都找不到静态目录中的任何文件，实际上是

static

css

我的意思是，“主页”是类似于

localhost:8000/index

或

localhost:8000/wordary

的页面，子页面是类似于

localhost:8000/wordary/something

的页面

模板呈现似乎出错了，它并不总是从应用程序目录的根目录访问静态目录，而是只查看

localhost:8000/词汇表/css/general.css

，而当我转到任何“主页”时，它应该查看

localhost:8000/css/general.css

以下是主页上的屏幕截图：

这是一个子页面：

因此，静态目录似乎会根据访问的URL而改变。起初我以为我终于明白了如何为静态文件服务，但似乎我还没有，我不知道如何以最佳方式解决这个问题

以下是我的目录结构：

/home/xiaolong/development/Racket/blog2
  - static/
    - css/
      general.css
      vocabulary-table.css
    + img/
    + js/
  - templates/
    base.html
    css-link.html
    js-link.html
    overview.html
    unknown-file.html
    vocabulary-table.html
  blog-demo.rkt
  blog.rkt

如何修复静态文件的路径

我希望能够简单地在代码中键入

css/something.css

，无论是哪个应用程序或路径，它都应该为文件提供服务，我不想根据我在代码中处理的路径更改包含路径

我用于运行服务器的命令很简单：

racket blog.rkt

从项目的根目录。

在我看来，这确实是一个HTML问题，而不是敲诈问题。具体来说，您需要将这些路径指定为绝对路径，而不是相对路径。因此，在代码中，您可能需要更改

(define (vocabulary-overview-app request)
  (response/xexpr
    `(html
       (head (title "Vocabulary Overview")
             (link ((rel "stylesheet") (href "css/general.css") (type "text/css"))))
       (body (p "This is an overview of vocabulary pages.")))))

到

（注意css文件路径中的前导斜杠）

这是否回答了您的问题？

这里的问题是不理解绝对路径与相对路径的概念，基本URL的概念，以及它们如何共同形成给定资源的完整限定URL

RFC3986是如何构造和处理URL的参考。注意，它实际上使用术语统一资源标识符URI而不是URL。它取代了以前使用旧的和不推荐的URL术语的文档

但为了与原始问题保持一致，我将继续使用URL术语

理解RFC 3986第4.1节中相对参考的概念很重要，它可以写成相对路径或绝对路径

在这里，解释URL的代理是您的浏览器，它只是处理您的服务器发送回它的URL，使用RFC 3986作为URL工作方式的基础

完全限定的URL包括协议和主机域以及端口号（如果需要），以及提供文档或资源相对于协议和主机域的位置的路径

因此，在您的情况下，CSS文件的正确完全限定URL应该是http://localhost:8000/css/general.css

http和localhost:8000分别称为协议方案和权限组件，构成网站的主要标识符，http://localhost:8000该标识符之后的任何内容都称为路径组件，它位于分别以“？”或“#”开头的查询或URL片段组件之前

path组件旨在模拟UNIX文件路径约定，并构造一个树层次结构，允许您表示某些给定资源相对于网站标识符的位置。你需要考虑一些规则

中给出了相对参考分辨率。关键概念是基本URL，它与相对引用一起用于构造完全限定的URL

当浏览器访问位于http://localhost:8000/vocabulary/something它会看到css/general.css，它是一个相对引用，写为相对路径。按照解析算法，基本URL被视为最初用于访问页面的URLhttp://localhost:8000/vocabulary/something

由于末尾没有尾随斜杠，因此最右边斜杠右侧的路径子组件将被删除，从而为您提供http://localhost:8000/vocabulary/。URL相对引用css/general.css随后附加在重写的基本URL路径的末尾，为您提供http://localhost:8000/vocabulary/css/general.css，当浏览器试图检索不存在的资源时，会导致404错误

如果相反，浏览器会看到/css/general.css，这是一个相对引用，写为绝对路径。基本URL再次为http://localhost:8000/vocabulary/something。由于相对引用是绝对路径，因此删除网站标识符右侧的整个路径给你http://localhost:8000。然后将相对引用附加到重写后的基本URL，从而为您提供http://localhost:8000/css/general.css这是正确的完全限定URL

注意，如果您碰巧访问了具有以下URL的页面http://localhost:8000/vocabulary/something/具有尾部斜杠的。然后将合并任何相对路径引用，如css/general.css，以构造完整的URLhttp:
(define (vocabulary-overview-app request) (response/xexpr `(html (head (title "Vocabulary Overview") (link ((rel "stylesheet") (href "/css/general.css") (type "text/css")))) (body (p "This is an overview of vocabulary pages.")))))