Uploading images along with Google app engine?

Question

I'm working on a google app engine project.

My app is working and looking correct locally, but when I try to upload images in an image directory, they're not being displayed at appspot.

as a little trouble-shoot, I put an html page in "/images/page2.html" and I can load that page at the appspot, but my pages don't display my images. So, it's not a problem with my path.

As another sanity check, I'm also uploading a stylesheet directory with .css code in it, and that's being read properly.

I have a suspicion that the problem lies in my yaml file.

Any ideas?

I don't want to paste all the code here, but here are some of the key lines. the first two work fine. the third does not work.

<link type="text/css" rel="stylesheet" href="/stylesheets/style.css" />
<a href="/images/Page2.html">Page 2</a>
<img src="/images/img.gif">

This is my app.yaml file

application: myApp
version: 1
runtime: python
api_version: 1

handlers:
- url: /stylesheets
  static_dir: stylesheets

- url: /images
  static_dir: images

- url: /.*
  script: helloworld.py

Answer 1

What do you get if you go to the URL directly, instead of trying to load it in a page? And does it work on the dev_appserver?

Answer 2

I'll bet your problem is that you're using Windows.

If that's the case, I believe you need a preceding slash for your static_dir value.

Answer 3

@jamtoday The preceding slash didn't make a difference, but it did get me started figuring out what each app needs to be told what about my directory structure.

So, I have nothing very conclusive to add, but I wanted to follow up, because I got it working, but I didn't explore all the issues after I got it working.

One change that helped was to stop working from a HwlloWorld/src/ directory and start working in the HelloWorld/ directory. It seems like the dev_appserver picked up all the dependencies, but the remote server didn't. Essentially, the relative path of my local links didn't match the relative path of the links after uploading.

I also realized that the dev-appserver relies on the .yaml file, as well as the appcfg script. That is. . .if you add a directory to your project, and then try to link to files in that directory, you need to add the directory to the .yaml file, and then restart the dev-appserver to pick up on this.

So, there are probably ways to handle what I was originally trying to do if you give the .yaml file the right info, but changing to a different directory structure locally handled it for me.

Answer 4

<img src="/images/img.gif">

this line can't show you the image. Try this one:

1-Create a class to handle "image request"

class GetImage(webapp.RequestHandler):
      def get(self):
       self.response.headers['Content-Type'] = 'image/jpg'
       self.response.out.write(image_object)

2-In your page.html:

<img src="/image"

3-At the main function in your code.py:

application = webapp.WSGIApplication(('/image', GetImage), debug=True)

have fun

Answer 5

You have to configure app.yaml for static content such as images and css files

Example:

 url: /(.*\.(gif|png|jpg))
  static_files: static/\1
  upload: static/(.*\.(gif|png|jpg))

For more info check out: http://code.google.com/appengine/docs/configuringanapp.html

Answer 6

I am using the Java version of App engine, and I faced a similar issues with the server not able to serve static images.

What worked ultimately was to change the AppEngine config file "appengine-web.xml" in my case to contain

<static-files>
<include path="**.*"/>
    <include path="/images/**.*" />
</static-files>

My images are in the /images directory and HTML and CSS are in . directory which is at the WEB-INF level