ラケットを使ってWebアプリで画像を描くには？

Question

私は単純なweb-appで写真を描く方法を探しています。基本的に私は標準的なスライドショーライブラリを使って円の画像を提出しようとしていますが、それはうまくいかず、理由もわかりません。ここで

サンプルです：

#lang web-server/insta 

(require slideshow) 

(define (start request) 
    (response/xexpr '(html 
        (body (circle 10)) 
        ) 
) 
) 

あなたは私に私が私のHTMLページで標準utilsのを使って絵を描くことができる方法のヒントを教えてもらえますか？

Answer 1

イメージのHTML IMGタグを生成し、適切な内容を提供する必要があります。一つの方法は、直接data uriソースとしてWebページでイメージソースを置くことです：

#lang web-server/insta 
(require pict 
     net/base64 
     file/convertible) 

;; pict->data-uri : Pict -> String 
(define (pict->data-uri pict) 
    (format "data:image/png;base64,~a" 
      (base64-encode (convert pict 'png-bytes)))) 

;; start : Request -> Response 
(define (start request) 
    (send/suspend/dispatch 
    (lambda (make-url) 
    (response/xexpr 
     `(html 
     (body 
     (p "hello, here's a circle:") 
     (img ([src ,(pict->data-uri (circle 10))])))))))) 

もう一つの方法は、画像ソースにその応答として画像を送信するURLを作ることです。

#lang web-server/insta 
(require pict 
     file/convertible) 

;; pict-response : Pict -> Response 
(define (pict-response pict) 
    (response/full 200 #"Ok" 
       (current-seconds) #"image/png" 
       (list) 
       (list (convert pict 'png-bytes)))) 

;; start : Request -> Response 
(define (start request) 
    (send/suspend/dispatch 
    (lambda (make-url) 
    (response/xexpr 
     `(html 
     (body 
     (p "hello, here's a circle:") 
     (img ([src ,(make-url 
         (lambda (req) 
         (pict-response (circle 10))))]))))))))