This React website is served on Google Cloud Platform
I want to edit an existing handler
- url: /(.*)$
static_files: public/\1/index.html
upload: public/.*/index.html
to get rid of warnings like this Static file referenced by handler not found: public/_ah/start/index.html
I have seen this solution, but I'm not quite sure how to use it in my case. Any ideas?
I tried option below, but it didn't work, build fails.
- url: /(?!.*\/_ah).*$
static_files: public/\1/index.html
upload: public/.*/index.html
An error in an application's app.yaml frequently causes the error static file referenced by handler not found. It basically means that one of app.yaml's static file handlers is diverting to a file that does not exist or is named wrongly.
You might be able to come up with a strategy if you have a technique of differentiating files from directories. You can achieve something like this by stating that all filenames must have extensions (and folders most not. in their names):
/optional/path/folder/ - serve index.html inside
- url: /(.*)/
static_files: public/\1/index.html
upload: public/.*/index.html
/optional/path/name.extension => files - serve them
- url: /((.*\/)*[^\/]+\.[^\/]+)$
static_files: public/\1
upload: public/.*
anything else is a folder - serve index.html inside
- url: /(.*)$
static_files: public/\1/index.html
upload: public/.*/index.html
Remember that all this depends on your directory.
Here is also app.yaml and structuring web services documentation that could help.
Related
I created web app that consist with two separate parts: server and client. And I want to deploy it to google cloud with app engine.
I already did it, but the main problem is unworking env_variables that I need for correct work of application that I defined in .yaml files.
I don't understand why the env variables doesn't work, If I do it in accordance to docs.
I wrote .yaml file to each part. Here the file structure:
./
--client/
----source_files...
----client.yaml
--server/
----source_files...
----api.yaml
--dispatch.yaml
Here the content of each file.
client.yaml:
runtime: nodejs16
service: default
handlers:
- url: /(.*\..+)$
static_files: build/\1
upload: build/(.*\..+)$
- url: /.*
static_files: build/index.html
upload: build/index.html
env_variables:
API_LINK: "https://gcloudezample-11111.lm.r.appsport.com"
api.yaml:
runtime: nodejs16
service: api
env: standard
env_variables:
MONGO_DB_PWD: "db_password"
dispatch.yaml:
dispatch:
- url: '*/api'
service: api
Then I deployed this parts in .yaml files order above.
The result is working frontend but failed api requests, because the wrong request URL: http://localhost:3001/v1/my-route
Screenshot
It's a common misunderstanding of how a website works. Take 2 sec and think about it: What are doing your frontend part?
Let me help
handlers:
- url: /(.*\..+)$
static_files: build/\1
upload: build/(.*\..+)$
- url: /.*
static_files: build/index.html
upload: build/index.html
It serves only static files. Therefore, only static file means no processing, no instances, no variable definition in the runtime context because only static files are served.
The runtime is on the client browser that run the JS code.
Note: the counterpart great advantage, that the static page serving is free (in term of resource usage because there is no instance up and running to serve your files; the egress is billed)
So now, how to solve this?
Simply build your static files with the API_LINK value INSIDE the static code.
I have set up a website using docusaurus which works great, but when I check the indexing status of my website on google, I got a lot of 'Discovered - currently not indexed' problems, which appears to be a routing problem.
The compiled version of the docusaurus website generates an 'index.html' file for every page or md file in the docusauus project in a separate folder, but the generated links don't add the 'index.html' and instead end like this: https://cam-inspector.com/contact. The browser doesn't seem to go to 'https://cam-inspector.com/contact/index.html', instead it uses the root index.html page and appears to handle the routing locally. This works for viewing, but the google crawler only gets to see the root, so every page contains a canonical url of 'https://cam-inspector.com'. When you browse directly to 'https://cam-inspector.com/contact/index.html', the correct file is retrieved from the server and the canonical tag is correct to 'https://cam-inspector.com/contact'.
I tried to add a redirect to the yaml file of the google app engine deployment so that it would add 'index.hmtl' to all routes that don't end with a file extension, but that doesn't seem to work:
handlers:
# for url without extensions, needs to go to index.html to get seo correct
- url: /(?:/|^)[^./]+$
static_files: www/\1/index.html
upload: www/(.*)/index.html
# files with extension, needed to get all the files
- url: /(.*\..+)$
static_files: www/\1
upload: www/(.*\..+)$
# Catch all handler to index.html, needed to get the root
- url: /.*
static_files: www/index.html
upload: www/index.html
In this post: app.yaml : Redirect any URL ending with / to {url}/index.html they appear to say that you can't add a redirect like that to the yaml def.
So now I'm a little stuck, the only thing I can think of is to add '/index.html' to all the links in the docusaurus code, but that sort of creates something very difficult and tricky to maintain (especially with the auto generated side bar of the docs, where it's much harder to change the links).
Any ideas on how to fix this?
found the solution:
use the following config in docusaurs.config.js: trailingSlash: true,
use these handlers in app.yaml:
- url: /
static_files: www/index.html
upload: www/index.html
- url: /(.*)/$
static_files: www/\1/index.html
upload: www/(.*)
- url: /(.*)
static_files: www/\1
upload: www/(.*)
make certain you declare the links to your pages this way: \contacts\
then things start to behave as expected.
Here's my version of deploying a Docusaurus site to Google App Engine.
handlers:
# static files with a URL ending with a file extension
# (e.g. favicon.ico, manifest.json, jylade.png)
- url: /(.*\..+)$
static_files: build/\1
upload: build/(.*\..+)$
# index page
- url: /
static_files: build/index.html
upload: build/index.html
# anything that ends with a slash (e.g. /docs/)
- url: /(.*)/$
static_files: build/\1/index.html
upload: build/(.*)
# anything else (e.g. /docs)
- url: /(.*)
static_files: build/\1/index.html
upload: build/(.*)
Works for me with the default Docusaurus configuration.
It does not require trailingSlash: true.
I'm deploying a static site using AppEngine and after many attempts to get the order of handlers correct, my app.yaml file now removes file extensions from urls while also displaying all css, js, images and other static resources which it doesn't if you get the handler order wrong.
***However, for some reason, only some of my static pages work when browsing. The others return a 404.
File structure:
Root
app.yaml
www (directory)
index.html: WORKS
page2.html: WORKS
page3.html: WORKS
(all others).html DON'T WORK
css
js
images
etc
My app.yaml is as follows:
runtime: python27
api_version: 1
threadsafe: true
#With the following handler order, .html is removed from urls and all static resources load fine.
#However, some static pages throw a 404, even though they're in same directory as those that work.
handlers:
- url: /(.*)
static_files: www/\1
upload: www/(.*)
secure: always
- url: /
static_files: www/index.html
upload: www/index.html
secure: always
- url: /(.+)
mime_type: text/html
static_files: www/\1.html
upload: www/(.+)
secure: always
I'm redirecting everything to a single file in my app.yaml like so
- url: /.*
script: frontcontroller.application
but I still have to use robots.txt, which causes an error when I do
- url: /robots.txt
static_files: robots.txt
- url: /.*
script: frontcontroller.application
the error is " missing "upload" attribute for URL robots.txt, I understand that it requires a third option like so
- url: robots.txt
static_files: robots.txt
upload: ??????
what would the proper value be for the upload attribute?
You should include the actual path to the file that you want to upload, which in your case is the robots.txt:
- url: robots.txt
static_files: robots.txt
upload: robots.txt
For more read the: Python Application Configuration.
Here's how I understand it:
static_file field let you specify the mapping used to serve the static file request.
upload field is used to distinguish between script file and a static file.
I am trying to develop on Google App Engine and in the list of the errors displayed in the admin console I always see the following:
/favicon.ico
i read the documentation , added a new folder called static and added this in my app.yaml:
- url: /favicon.ico
static_files: static/favicon.ico
upload: static/favicon.ico
but even now I'm getting the same error...
This entry should be placed before the entry for the main handler, like:
- url: /favicon.ico
static_files: media/img/favicon.ico
upload: media/img/favicon.ico
- url: /robots.txt
static_files: media/robots.txt
upload: media/robots.txt
- url: .*
script: main.py
The entries are processed in order of apperance and first one that matches wins.
If you are doing this in Java, I got rid of the error by putting a blank "favicon.ico" file in the "war" directory.
If you want to make your own quick and ugly "favicon.ico" file, this website was super easy to use: http://www.favicon.cc/
For your application, favicon.ico should be a static image. You can upload a favicon.ico file with your application, and in your app.yaml file configure your application to serve the image when the url /favicon.ico is requested. Below is an example entry in your app.yaml file for /favicon.ico. We assume you include the favicon.ico file in the directory path static/images:
- url: /favicon.ico
static_files: static/images/favicon.ico
upload: static/images/favicon.ico
is written here
I am using this snippet in a GAE app configuration:
handlers:
- url: /(.*\.(ico|png|webmanifest))$
static_files: faviconfiles/\1
upload: faviconfiles/.*\.(ico|png|webmanifest)$
I then put the corresponding set of files (these days if you seriously want to set a "favicon" it's a set of files incl. e.g. apple-touch-icon.png) into the ./faviconfiles directory next to my app.yaml.