CSS 404 not found google app engine - python

i am using google app engine (python) to develop my web application, now i found a little problem. I would like to add bootstrap css file to google app engine, and here is my folder directory
project
app.yaml
favicon.ico
index.yaml
main.py
templates
css
bootstrap
css
bootstrap.css
images
js
header.html
signup.html
welcome.html
app.yaml code
application: project
version: 1
runtime: python27
api_version: 1
threadsafe: yes
handlers:
- url: /favicon\.ico
static_files: favicon.ico
upload: favicon\.ico
- url: /templates/css/boostrap/css/
static: boostrap.css
- url: /.*
script: main.app
libraries:
- name: webapp2
version: "2.5.2"
- name: jinja2
version: latest
in my header.html css link like this
<link type="text/css" rel="stylesheet" href="css/bootstrap/css/bootstrap.css" rel="stylesheet">
when i refresh my page, it only shows the plain text, css file is 404 not found. Any help?

Try
- url: /css/bootstrap/
static_dir: /templates/css/bootstrap/css
and reference it via
<link rel="stylesheet" type="text/css" href="/css/bootstrap/bootstrap.css" />

Related

CSS not loading on gcloud app engine?

So, I'm trying to host a website on the google cloud app engine, but css and other static files are not showing up.
Here is the relevant directory structure:
myapp
-app.yaml
-manage.py
subapp
-apps.py
-models.py
-urls.py
-views.py
static
-style.css
And the relevant portion of app.yaml:
runtime: python
env: flex
api_version: 1
threadsafe: yes
handlers:
- url: /static
static_dir: static
- url: .*
script: myapp.wsgi.application
I would expect that when I go to https://myapp.appspot.com/static/style.css, they see the style.css file, but instead I get the 404 page not found error, and I see that gcloud compares the 'static/style.css' against the list of urls found in urls.py instead of the static directory specified in app.yaml.
What could be going wrong?
Sadly, static handlers do not work on the flexible environment. You should just serve your CSS the way you normally would from your python application.
You can try this in your app.yaml
handlers:
- url: /static/style.css
static_files: static/style.css
upload: static/style.css

do i need to declare my index.html in app.yaml?

I am new to google app engine and have trouble configure my web app. I don't know what i do need to add to app.yaml and what i don't? for example i know that i have to add my static files like images, and style sheets , but what about scripts files like angular do i need to declare them as static as well.
NOTE: APP STRUCTURE
+ProjectName
app.yaml
main.py
resources
images
styles
scripts
index.html
handlers:
- url: /rescources/images/(.*)
static_files: /images/\1
upload: /rescources/images/.*
- url: /rescources/styles
static_dir: /rescources/styles
- url: /rescources/scripts/.*
static_dir: /rescources/scripts
- url: /.*
script: main.APP
libraries:
- name: webapp2
version: latest
- name: jinja2
version: latest
Yes, your angular script files (if they are defined in a .js file) are to be considered static files. My suggestion is to move your images, css and script files (all .js files) into a seperate folder called 'static' and then your app.yaml file can be like below
runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: /static
static_dir: static
- url: /.*
script: main.APP
libraries:
- name: webapp2
version: latest
- name: jinja2
version: latest
If there's the possibility that your static files might change more frequently (for e.g. you've deployed your code to production but you're still working and making changes, you might want to set an explicit but lower expiration date for your static files. The example sets an expiration of 2 hours for your static files
- url: /static
static_dir: static
expiration: "2h"
More details can be found here https://cloud.google.com/appengine/docs/python/config/appconfig#Python_app_yaml_Static_cache_expiration

Application Cache Manifest with Google App Engine

I am trying to make a basic application that would make my index.html file run offline - when no internet is available. I am using Google App Engine, Webapp2 and Jinja2. Would you suggest a better framework for an offline website / webapp.
When I run this application I get this console error:
Creating Application Cache with manifest http://localhost:9080/static/cache.manifest localhost/:1
Application Cache Checking event localhost/:1
Application Cache Downloading event localhost/:1
Application Cache Progress event (0 of 1) http://localhost:9080/index.html localhost/:1
Application Cache Error event: Resource fetch failed (404) http://localhost:9080/index.html
I used the following:
Files
static/cache.manifest
main.py
index.html
app.yaml
main.py
import os, webapp2, jinja2
JINJA_ENVIRONMENT = jinja2.Environment(
loader=jinja2.FileSystemLoader(os.path.dirname(__file__)))
class Home(webapp2.RequestHandler):
def get(self):
template = JINJA_ENVIRONMENT.get_template('index.html')
self.response.write(template.render())
app = webapp2.WSGIApplication([('/', Home),
], debug=True)
index.html
<!DOCTYPE html>
<html manifest="/static/cache.manifest">
<head>
</head>
<body>
Hello World
</body>
</html>
cache.manifest
CACHE MANIFEST
/index.html
app.yaml
application: formetoteston
version: 1
runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: /static/(.*\.(appcache|manifest))
mime_type: text/cache-manifest
static_files: static/\1
upload: /static/(.*\.(appcache|manifest))
expiration: "0m"
- url: .*
script: main.app
libraries:
- name: webapp2
version: "2.5.2"
- name: jinja2
version: "2.6"
I found it! I needed to add the proper URL handlers in app.yaml. Except I moved my index.html to /static.
application: formetoteston
version: 1
runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: static/(cache.manifest)
mime_type: text/cache-manifest
static_files: static/cache.manifest
upload: static/(cache.manifest)
- url: static/(.*)
static_files: static/index.html
upload: static/index.html
- url: .*
script: main.app
libraries:
- name: webapp2
version: "2.5.2"
- name: jinja2
version: "2.6"

Google App Engine add image to page with static folder

i have a problem to use image with static folder path in my page.
this is my app.yaml
application: something
version: 1
runtime: python27
api_version: 1
threadsafe: yes
handlers:
- url: /images
static_dir: static/images
- url: /favicon.ico
static_files: static/favicon.ico
upload: static/favicon.ico
- url: .*
script: main.app
libraries:
- name: webapp2
version: "2.5.2"
- name: jinja2
version: latest
I have templates, static/images, controllers (has MainHandler.py) folders and in my root i have main.py and app.yaml files. in my templeate folder i have index.html file that contain:
<div>
<img src="images/fig1.jpg">
</div>
my problem is when page was loaded i cant see my fig1.jpg picture.
What is the url of this page? If it looks like a subdirectory, then your using a relative path for your image is not pointing to the images path. Try changing to:
<div>
<img src="/images/fig1.jpg">
</div>
If using Windows, there is a known bug. See:
Google App Engine: Won't serve static assets with below error:
Try adding mime_type: "image/jpeg" to your image handler, to see if that is the cause.

Static files not working on GAE

I'm using the following yaml configuration:
application: xxxxxxxx
version: 1
runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: /bootstrap
static_dir: static/bootstrap
- url: /fonts
static_dir: static/fonts
- url: /js
static_dir: static/js
- url: /images
static_dir: static/images
- url: /css
static_dir: static/css
- url: /favicon\.ico
static_files: ./static/favicon.ico
upload: ./static/favicon\.ico
- url: /.*
script: main.app
libraries:
- name: django
version: "1.3"
And my folder structure is like this:
\
....static
..........bootstrap
...................css
...................js
...................img
..........css
..........fonts
..........images
..........js
In the development environment it works fine (using latest version available), but when I deploy the app it doesn't. I know the filenames are case sensitive on gae, but I've already checked that.
What else can be wrong?
Please Help.
Thanks
As stupid it may seems but removing the project from GAE Launcher and adding it back again and re-deploy it solved the issue.

Categories

Resources