2013-04-29 2 views
2

저는 python 및 jinja 프레임 워크와 함께 Google 애플리케이션 엔진을 사용하고 있습니다.양식에 이미지 업로드

사용자가 이미지를 업로드하여 미리보기 이미지에 사용하게하고 싶습니다.

이미지는 썸네일 및 10 개가 넘지 않으므로 데이터베이스를 사용하지 않아도됩니다. 나는이 코드를 실행하면

class ImgUpload(db.Model): 
    name = db.StringProperty() 
    description = db.StringProperty(multiline=True) 
    img_img = db.BlobProperty() 

class testhandler(BaseHandler): 

    def get(self): 
     self.render("test.html") 

    def post(self): 
     images = ImgUpload() 
     name = self.request.get('name') 
     description = self.request.get('description') 
     img_img = image = self.request.get("image") 
     images.img_img = db.Blob(img_img) 
     images.name = name 
     images.description = description 
     images.put() 
     u = ImgUpload.gql("WHERE name = '%s'"%name).get() 
     self.response.out.write("""<img src="/test?test=%s"></img>""" %u.key()) 


app = webapp2.WSGIApplication([("/test",testhandler) 

          ],debug=True) 

, 나는 손상된 이미지를 참조하십시오

은 여기 내 html로

<form class="reg-page" method="post" enctype="multipart/form-data" /> 
    <label>Name </label> 
    <input type="text" class="span12" name="name" value={{name}}> 
    <label>Description </label> 
    <textarea class="span12" name="description" value={{description}}></textarea> 
    <label>Photo </label> 
    <div class="fileupload fileupload-new" data-provides="fileupload"> 
    <div> 
     <span class="btn btn-file"><span class="fileupload-new">Select image</span> 
     <span class="fileupload-exists">Change</span><input name="image" type="file" /></span> 
     <a href="#" class="btn fileupload-exists" data-dismiss="fileupload">Remove</a> 
    </div> 
    </div> 
    <button class="btn-u pull-right" type="submit">Εγγραφή </button> 
</form> 
{{test}} 

백 엔드는 간단하다.

답변

2

당신이 게시물을받을 때 당신이

예를 들어, 이미지를 저장하기위한 모델을 만들어야합니다

class Image(ndb.Model): 

    file = ndb.BlobProperty() 
    filename = ndb.StringProperty() 
    mimetype = ndb.StringProperty() 
    size = ndb.IntegerProperty() 
    width = ndb.IntegerProperty() 
    height = ndb.IntegerProperty() 

는 그런 다음 데이터 저장소에서 이미지를 가져 오는 몇 가지 코드에 이미지의 URL을 매핑하고 데이터가 올바르게 콘텐츠 형식 헤더를 설정 반환하는 핸들러를 작성해야합니다. 또한 이제 매핑 할 필요가 당신이

"""<img src="/test?test=%s"></img>""" %u.key())

와 함께 img 태그를 렌더링하는, 폭, img 태그의 높이를 설정하기 위해 신사 코드에 코드에서

를 엔티티의 속성을 사용할 수 있습니다/test? test = get 핸들러에 넣은 다음 self.response.write(<the blobproperty>)을 수행해야하며 이미지/jpeg 또는 저장할 이미지 유형에 응답의 콘텐츠 유형을 설정해야합니다. 또한 이전 버전의 Internet Explorer에 이미지를 제공하는 경우 이미지 확장명을 사용하여 파일 이름을 설정해야합니다.

그리고 당신의 <img> 태그를 구성하는 이미지의 GQL 쿼리를하지 않는다, 당신은 이미 바로 당신이 images.put을하는 것처럼) images.key와 객체의 키를 (이()

+0

예 . 나는 이미 이것을했다. 데이터베이스를 사용하는 방법을 알고 있지만 내 코드는 HTML로 표시하는 테스트입니다. 내가 오해를 피하기 위해 내 게시물을 업데이 트 :) – Tasos

+0

GIven이 상당히 기본적인 기능입니다 내가 어디로 이미지를 저장 가정 수 없습니다. 내 대답의 나머지 부분은 이미지 URL을 get 요청에 매핑하여 이미지를 가져 와서 반환하는 처리기입니다. –

+0

테스트 메소드가 html을 렌더링합니다. 그 안에는 img 태그가 있어야하며 해당 이미지 태그의 URL은 데이터 저장소에서 이미지를 가져 오는 GET 핸들러에 매핑됩니다. –