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.
Related
I'm trying to deploy my web app on Google App Engine.
My project follows this structure
The app.yaml has this content:
runtime: nodejs14
handlers:
- url: /
static_files: www/index.html
upload: www/index.html
- url: /(.*)
static_files: \1
upload: (.*)
But, when I execute gcloud app deploy --project=MY PROJECT, and open my site, it looks like this:
I assume there is an error in the app.yaml file, but I don't understand what. Any ideas?
Update your second URL handler to:
- url: /(.*\.(svg|png))$
static_files: www/images/\1
upload: www/images/.*\.(svg|png)$
Then reference your img src like this:
<img src="/test.png" alt="oops" width="104" height="142">
One thing to add, you can also use static_dir as your second URL handler instead. This way it's easier organize static files per directory. Change your app.yaml to:
runtime: nodejs14
handlers:
- url: /
static_files: www/index.html
upload: www/index.html
- url: /static-img
static_dir: www/images
In that example, what happens is that images located at www/images are mapped on URLs beginning at /static-img. You can use that URL to reference your img src in your HTML. For example:
<img src="/static-img/test.png" alt="oops" width="104" height="142">
Learn more at: https://cloud.google.com/appengine/docs/standard/nodejs/config/appref#handlers_static_dir
We are trying to access .json file inside our python code in Google App Engine.
Here is our app.yaml
service: worker
instance_class: F2
runtime: python27
api_version: 1
threadsafe: true
automatic_scaling:
max_instances: 100
min_pending_latency: 200ms # default value
max_pending_latency: automatic
handlers:
- url: /stylesheets
static_dir: stylesheets
- url: /images
static_dir: images
- url: /javascripts
static_dir: javascripts
- url: /(.*\.(gif|png|jpg|json))$
static_files: static/\1
upload: static/.*\.(gif|png|jpg|json)$
application_readable: true
- url: /static
static_dir: static
application_readable: true
- url: /favicon\.ico
static_files: favicon.ico
upload: favicon\.ico
- url: /.*
script: worker.app
login: admin
libraries:
- name: webapp2
version: "2.5.2"
- name: jinja2
version: latest
We are using it in our application like this.
path = os.path.join(os.path.dirname(__file__)[0], '/static/google_web_app_script_credentials.json')
flow = InstalledAppFlow.from_client_secrets_file(path,self.GOOGLESHEETS_SCOPES )
But we are receiving the error.
IOError(2, 'No such file or directory')
We have tried various options of changing path including path = os.path.join(os.path.dirname(file)[0], '../static/google_web_app_script_credentials.json')
When we go to the GCP console -> Debug and review the current code we are able to see the .json file under static folder. This means that the file is there, we are not able to get the application to read it. This service is as "worker".
From your App Engine app, you don't have access to your static files. Move the file to another location within your project, and you will then be able to access it.
Even more importantly, you don't want to store credentials in your static folder! Anyone on the web will be able to access them via the URL!
My site has 8 pages and it is written in php: https://intercultural.appspot.com After deploying in GAE, it can load and dislpay the index.php page. However, does not display the other pages when I click on other links: Error: No Found The requested URL /file.php was not found on this server.
Here is the directory of my file: hightlighted in blue are the pages of my site.
enter image description here
Here is my app.yaml file:
runtime: php72 </b>
handlers:
# Serve a directory as a static resource.
- url: /styles
static_dir: styles
# Serve images as static resources.
- url: /(.+\.(gif|png|jpg))$
static_files: \1
upload: .+\.(gif|png|jpg)$
# Serve your app through a front controller at index.php or public/index.php.
- url: /(.+\.php)$
static_files: static/\1
upload: /(.+\.php)$
# I add the "/" to url bellow as suggested but still get same error
- url: /.*
script: auto
secure: always
Although it displays the site address in the browser, it says: Error: No Found The requested URL /file.php was not found on this server.
What is missing in the app.yaml file to route properly to the other pages of my site?
The URL for your final entry in the app.yaml should be url: /.* (with slash). This is necessary to match URLs of https://intercultural.appspot.com/*. You can see an example in the app.yaml reference.
I already fixed it.
The main problem was in the php version. I thought my code was written in php7.2 but actually it was php5.5, hence, the app.yaml didn't work properly.
Here is the app.yaml file:
This is my app.yaml file
runtime: php55
api_version: 1
handlers:
- url: /styles
static_dir: styles
- url: /(.+\.(gif|png|jpg))$
static_files: \1
upload: .+\.(gif|png|jpg)$
application_readable: true
- url: /
script: index.php
secure: always
- url: /(.+\.php)$
script: \1
secure: always
I've uploaded a create-react-app build (with an app.yaml file) to a GCP bucket. The app has then been deployed on a App Engine instance using the cloud shell.
Going to the app's root URL works fine. But going to example.com/anything returns the following error:
Error: Not Found
The requested URL /anything was not found on this server.
App.yaml file looks like this:
runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: /(.*\.(html|css|js))
static_files: build/\1
upload: build/(.*\.(html|css|js))
- url: /
static_files: build/index.html
upload: build/index.html
You don't have a handler for /anything. If you want a catch-all url, use regex type handler:
- url: /.*
static_files: build/index.html
upload: build/index.html
or, if you want to serve them anything.html as a static file, put it in your build dir, and navigate to /anything.html. Your first handler is set up to map that url.
I was trying to use google app engine cloud space. My program is running without any problem in localhost, but when I tries to host it in google app engine, static files are not served. The app.yaml is as follows:
application: myTestApp-nn34322
version: 1
runtime: go
threadsafe: true
api_version: go1
handlers:
- url: /static/css
static_dir: ../static/css
mime_type: "text/css"
- url: /static/js
static_dir: ../static/js
mime_type: "text/javascript"
- url: /static/images
static_dir: ../static/images
- url: /.*
script: _go_app
You should put every static resources under the same folder where you put your app.yaml file, else they won't get uploaded to AppEngine.
So you should put your static folder next to app.yaml, and then of course the correct path is simply static/xxx, e.g.:
- url: /static/css
static_dir: static/css
mime_type: "text/css"
- url: /static/js
static_dir: static/js
mime_type: "text/javascript"
- url: /static/images
static_dir: static/images
Note:
If you intend to use these static files from your Go app too (e.g. you want to read their content), that requires special handling because resources matched by static file patterns will not be copied to the application after uploading (static files are served by separate servers). For details, see Google App Engine Golang no such file or directory. Basically you either have to duplicate the static files, or provide the application_readable option to the static file handler.