Cannot include js and css file in google cloud app - angularjs

I am using lamp deployment, using Cloud sql. After uploading my project to xxx.appspot.com. All the css and js files are not opening. It throws:
Error: Not Found The requested URL /public/js/admin/custom.js was not
found on this server.
I am adding the css file as below:
<link rel="stylesheet" href="http://syncspot-ds.appspot.com/public/css/admin/login.css">
<link rel="stylesheet" href="http://syncspot-ds.appspot.com/public/css/admin/bootstrap.css">
<link rel="stylesheet" href="http://syncspot-ds.appspot.com/public/css/admin/font-awesome.css">
My app.yaml file is as below:
application: xxx
version: 1
runtime: php55
api_version: 1
threadsafe: true
handlers:
- url: /public/css/admin
static_dir: /public/css/admin
- url: /public/css/front
static_dir: /public/css/front
- url: /public/css/front/images
static_dir: /public/css/front/images
- url: /public/fonts
static_dir: /public/fonts
- url: /public/images
static_dir: /public/images
- url: /public/images/00-ICON LOGO
static_dir: /public/images/00-ICON LOGO
- url: /public/images/admin
static_dir: /public/images/admin
- url: /public/images/background
static_dir: /public/images/background
- url: /public/images/icons
static_dir: /public/images/icons
- url: /public/images/logo
static_dir: /public/images/logo
- url: /public/js/admin
static_dir: /public/js/admin
- url: /public/js/front
static_dir: /public/js/front
- url: /public/js/gmap
static_dir: /public/js/gmap
- url: /public/swf
static_dir: /public/swf
- url: /public/uploads/channel_content
static_dir: /public/uploads/channel_content
- url: /public/uploads/profile_img
static_dir: /public/uploads/profile_img
- url: /.*
script: index.php
My .htaccess file is as below:
DirectoryIndex index.php
RewriteEngine on
RewriteCond $1 !^(index\.php|public|robots\.txt|favicon\.ico)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ ./index.php/$1 [L,QSA]
I am using Code Igniter, AngularJS and MySql. If I use an external css say:
<link rel="stylesheet" href="http://1223.123.123.123/xxx/public/css/admin/login.css">
It is working properly.
Please help me so that I can make a link to css or js file.

For the static directories, the documentation does not have the leading "/" in the static_dir section.
Try to use this format:
- url: /public/css/admin
static_dir: public/css/admin

Related

why {app-url}/reset-password/{token} url showing page not found in react app deployed on google cloud where it working in local?

Token: {app-url}/reset-password/eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE2MTI3OTUxNjksInVzZXJJZCI6NjB9.YS1seObMs45hcTDH4nSbTNh1W4fTTqPcpF4TUamfFFk
Error: Error: Not Found
The requested URL /reset-password/eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE2MTI3OTUxNjksInVzZXJJZCI6NjB9.YS1seObMs45hcTDH4nSbTNh1W4fTTqPcpF4TUamfFFk was not found on this server.
Code:
<Route exact path="/reset-password/:token" component={ResetPassword} />
Does this issue bcs app deployed in GCloud or any thing needs to change in react code (project is create react app not webpack) ?
app.yaml
runtime: nodejs12
handlers:
- url: /(.*\..+)$
static_files: build/\1
upload: build/(.*\..+)$
- url: /.*
static_files: build/index.html
upload: build/index.html
Needs to change app.yaml
runtime: nodejs12
handlers:
- url: /static
static_dir: build/static
- url: /(.*\.(json|ico|js|png))$
static_files: build/\1
upload: build/.*\.(json|ico|js|png)$
- url: .*
static_files: build/index.html
upload: build/index.html
thanks to https://stackoverflow.com/a/55831186

Config Yaml for folders inside folders in App Engine

I have this app engine project structure:
and the this yaml file:
but only chicken.jpg will appear in index.html and not the images inside img/cats or img/puppys.
/img intercepts the others. Put your url handlers in this order:
- url: /img/puppys
static_dir: img/puppys
- url: /img/cats
static_dir: img/cats
- url: /img
static_dir: img

How to configure the app.yaml for using images?

i have a big problem with images for my project with python (appspots.com).
How to configure the app.yaml for images?
My Images are in the directory /css/images/xy.png
The log say:
INFO 2012-04-22 17:29:42,601 dev_appserver.py:2884] "GET
/css/images/ui-bg_glass_75_e6e6e6_1x400.png HTTP/1.1" 404 -
My app.yaml (only handlers):
- url: /js
static_dir: js
- url: /css/main.css
static_files: css/main.css
upload: css/main.css
- url: /css/jquery-ui-1.8.19.custom.css
static_files: css/jquery-ui-1.8.19.custom.css
upload: css/jquery-ui-1.8.19.custom.css
- url: .*
script: main.py
- url: /css/images/.*
static_dir: css/images
I hope that you can help me :)
The problem is that you have .* before /css/images./* and that pattern matches everything. Rearrange it like this:
- url: /js
static_dir: js
- url: /css/main.css
static_files: css/main.css
upload: css/main.css
- url: /css/jquery-ui-1.8.19.custom.css
static_files: css/jquery-ui-1.8.19.custom.css
upload: css/jquery-ui-1.8.19.custom.css
- url: /css/images
static_dir: css/images
- url: .*
script: main.py
EDIT:
Try removing the /.* from the end of the pattern, as illustrated above.

Serve static file using App Engine

I created an App Engine application. Till now, I only have a few HTML files to serve. What can I do to make App Engine serve the index.html file whenever someone visits http://example.appengine.com/ ?
Currently, my app.yaml file looks like this:
application: appname
version: 1
runtime: python
api_version: 1
handlers:
- url: /
static_dir: static_files
This should do what you need:
https://gist.github.com/873098
Explanation: In App Engine Python it's possible to use regular expressions as URL handlers in app.yaml and redirect all URLs to a hierarchy of static files.
Example app.yaml:
application: your-app-name-here
version: 1
runtime: python
api_version: 1
handlers:
- url: /(.*\.css)
mime_type: text/css
static_files: static/\1
upload: static/(.*\.css)
- url: /(.*\.html)
mime_type: text/html
static_files: static/\1
upload: static/(.*\.html)
- url: /(.*\.js)
mime_type: text/javascript
static_files: static/\1
upload: static/(.*\.js)
- url: /(.*\.txt)
mime_type: text/plain
static_files: static/\1
upload: static/(.*\.txt)
- url: /(.*\.xml)
mime_type: application/xml
static_files: static/\1
upload: static/(.*\.xml)
# image files
- url: /(.*\.(bmp|gif|ico|jpeg|jpg|png))
static_files: static/\1
upload: static/(.*\.(bmp|gif|ico|jpeg|jpg|png))
# index files
- url: /(.+)/
static_files: static/\1/index.html
upload: static/(.+)/index.html
# redirect to 'url + /index.html' url.
- url: /(.+)
static_files: static/redirector.html
upload: static/redirector.html
# site root
- url: /
static_files: static/index.html
upload: static/index.html
In order to handle requests to URLs that don't end with a recognized type (.html, .png, etc.) or / you need to redirect those requests to URL + / so the index.html for that directory is served. I don't know of a way to do this inside the app.yaml, so I added a javascript redirector. This could also be done with a tiny python handler.
redirector.html:
<!DOCTYPE html>
<html lang="en">
<head>
<script language="JavaScript">
self.location=self.location + "/";
</script>
</head>
<body>
</body>
</html>
If you're trying to map / to index.html:
handlers:
- url: /
upload: folderpath/index.html
static_files: folderpath/index.html
the url: will match on a path and supports regex.
- url: /images
static_dir: static_files/images
So if your image file is stored at static_files/images/picture.jpg use this:
<img src="/images/picture.jpg" />
It could be done using (app.yaml):
handlers:
- url: /appurl
script: myapp.app
- url: /(.+)
static_files: staticdir/\1
upload: staticdir/(.*)
- url: /
static_files: staticdir/index.html
upload: staticdir/index.html
Here is app.yaml for how I got a site generated by Jekyll to work:
runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: /
static_files: _site/index.html
upload: _site/index.html
- url: /assets
static_dir: _site/assets
# index files
- url: /(.+)/
static_files: _site/\1/index.html
upload: _site/(.+)/index.html
- url: /(.*)
static_files: _site/\1
upload: _site/(.*)
- url: /.*
static_dir: _site
In WEB-INF/web.xml put:
<welcome-file-list>
<welcome-file>index.html</welcome-file>
</welcome-file-list>

How should I write my Google App Engine app.yaml file?

I registered a Google App Engine app and I have some files below:
/index.html
/css/index.css
/js/index.js
/feedbacks/index.html
/feedbacks/css/index.css
/feedbacks/js/index.js
How should I write the app.yaml file?
Thank you!
application: appname
version: 1
runtime: python
api_version: 1
handlers:
- url: /favicon.ico
static_files: img/favicon.ico
upload: img/favicon.ico
mime_type: image/x-icon
- url: /css #your css folder
static_dir: css
- url: /scripts #your javascript folder
static_dir: scripts
- url: /img #your image folder
static_dir: img
- url: /.*
script: your_script.py
Put your first 3 files into a folder name "static"
handlers:
- url: /feedbacks/
static_dir: feedbacks
- url: /css/
static_dir: static
- url: /js/
static_dir: static
- url: /.*
script: main.py
In your main.py
class IndexHandler(webapp.RequestHandler):
def get(self):
self.redirect('static/index.html')
def main():
application = webapp.WSGIApplication([
('/index.html', IndexHandler),
], debug=True)
run_wsgi_app(application)
It's not good to write in this way,
but this will solve your problem.

Resources