Hosting pure angularjs app on google app engine - angularjs

I have an angular js app with following structure
app structure
my app folder look like
app folder
the app does use any back end interaction for now but in future its gonna interact with a separate app engine java project . I want to host this angularjs app to google app engine but I am not able to understand the right configuration . I am more confused how do I set up the app.yaml for google app engine ... and is it necessary to have a main.py file as at present I do not have any handler

If I understand correctly, you would like to host a static web page on app engine, specifically an AngularJS app.
You don't need any server side code and can configure your app.yaml as follows:
runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: /
static_files: www/index.html
upload: www/index.html
- url: /(.*)
static_files: www/\1
upload: www/(.*)
This is assuming you will host your client side code in a www folder and you use a index.html as your index file.
Also take a look at the following guide for hosting a static website [0].
[0] https://cloud.google.com/appengine/docs/standard/python/getting-started/hosting-a-static-website

Related

App Engine dispatch.yaml doesn't affect service versions without traffic

Hi we are using App engine with many new and legacy java services.
we have 1 new frontend angular app and multiple services in java8
we access the application directly using without custom domains
frontend-dot-project-id.appspot.com
legacyapp-dot-project-id.appspot.com
My issue is the dispatch file doesn't affect app URLs with version specified
which broke the apis in the applications if opened in version url
for example :
frontend-dot-project-id.appspot.com/api/v2 => works
ver-dot-frontend-dot-project-id.appspot.com/api/v2 => doesn't work and will take me to frontend application as if there is no dispatch routes deployed
my dispatch.yaml looks something like this:
dispatch:
- url: "*/api/v2/*"
service: api-back
- url: "*/api/v1/*"
service: legacy-back
my app.yaml for the angular app
service: frontend
runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: /(.*\.(css|eot|gz|html|ico|js|map|png|jpg|svg|ttf|woff|woff2|json)(|\.map))$
static_files: dist/app/\1
upload: dist/app/(.*)(|\.map)
- url: /.*
static_files: dist/app/index.html
upload: dist/app/.*
login: required
skip_files:
- e2e/
- node_modules/
- src/
- coverage
- ^(.*/)?\..*$
- ^(.*/)?.*\.md$
- ^(.*/)?.*\.yaml$
- ^LICENSE
thanks in advance

Can't deploy react app to google app engine

This is the error I'm getting when trying to deploy my fresh started react app (It runs well locally). And this is my app.yaml file.
runtime: nodejs
env: flex
manual_scaling:
instances: 1
resources:
cpu: 1
memory_gb: 0.5
disk_size_gb: 10
Any suggestions on what might be wrong?
The reactJS apps are managed as static websites by app engine as React runs on the front-end.
Therefore you would need to configure the app.yaml to use static files.
For this you would need to add the handlers for static files.
handlers:
- url: /favicon\.ico
static_files: favicon.ico
- url: /static
static_dir: public
If you need more guidance here is the official documentation for static files in App Engine.

Dynamic HTML Page not found in App Engine. Returns Cannot Get /index

I am trying to host my HTML page in App Engine. When I am trying to access the webpage with url/index it returns
Cannot GET /index
I have followed the steps mentioned in
https://cloud.google.com/appengine/docs/standard/python/getting-started/hosting-a-static-website
having same file structure as it expects according to the link above.
- my_project
|- app.js
|- app.yaml
|- www
|- index.html
The below is my app.yaml file
# [START app_yaml]
runtime: nodejs
env: flex
service: service_name
# Adding CORS Support
handlers:
- url: /index
static_files: www/index.html
upload: www/index.html
- url: /index
static_dir: www/
- url: /getEndPoint
script: app.js
# [END CORS Support]
# [END app_yaml]
Not sure what am I missing here.
You're following the python 1st generation standard environment documentation, but your app.yaml selects the nodejs flexible environment (and uses statements not supported/ignored in this environment's app.yaml)
Maybe of interest: How to tell if a Google App Engine documentation page applies to the standard or the flexible environment
So you either:
follow the nodejs flexible environment Serving Static Files documentation
switch to the nodejs standard environment (by dropping the env:flex statement and selecting the nodejs10 or nodejs8 runtime) and follow the corresponding Serving Static Files documentation.
If you're unsure which environment you want, go through the Choosing an App Engine Environment guide.

Google App Engine: Disable favicon.ico

I have a Google App Engine project running PHP 5.5. This is my app.yaml:
application: example
version: 1
runtime: php55
api_version: 1
threadsafe: true
handlers:
- url: .*
script: main.php
All requests go to main.php. My app only sends data for an Android application and thus doesn't need to display a favicon.ico. But if I call my application in my browser (Chrome) and consult the app logs afterwards there is a request to favicon.ico. How can I disable this or how can I tell App Engine to NOT SERVE a favicon?
EDIT: I can't just send some HTML to prevent the loading of the favicon, because I need to send JSON data to my application in which I can't include HTML.

sitemap.xml on Google App Engine

I have the following yaml file for my Google App Engine website.
application: <my-app-id>
version: 1
runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: /sitemap.xml
static_files: static/sitemap.xml
upload: static/sitemap.xml
- url: /
static_files: static/index.html
upload: static/index.html
- url: /
static_dir: static
When I test this app using the local server, the file sitemal.xml is accessible by navigating to.
http://localhost:8080/sitemap.xml
However, when I deploy the app, navigating to the following page just redirects me to index.html (it is impossible to download the xml file).
http://<my-domain>.net/sitemap.xml
http://www.<my-domain>.net/sitemap.xml
Why is the local version behaving differently from the deployed version? What can I do to make the file available in the deployed version?
Google App Engine doesn't support naked domains and most likely it's not being redirected correctly. Try accessing it via: http://www.<my-domain>.net/sitemap.xml to see if that works.
It turns out the problem was caused by domain redirection. If I access the application directly, via the following.
http://<app-id>.appspot.com/
Then everything is fine. Apparently something is broken in the way the domain hosting service handles the redirection.

Resources