I am unable to deploy my Nuxt JS SSR app to Google Cloud App Engine.
The app is able to run locally both in dev and production mode.
The Nuxt JS documentation suggests using the app.yaml as follows:
runtime: nodejs10
instance_class: F2
handlers:
- url: /_nuxt
static_dir: .nuxt/dist/client
secure: always
- url: /(.*\.(gif|png|jpg|ico|txt))$
static_files: static/\1
upload: static/.*\.(gif|png|jpg|ico|txt)$
secure: always
- url: /.*
script: auto
secure: always
env_variables:
HOST: '0.0.0.0'
However, the Google Cloud documentation suggests using nodejs14 as well as the env_variables for the bucket name which I assume is the same name as the staging bucket automatically created by Google App Engine.
runtime: nodejs14 # or another supported version
instance_class: F2
env_variables:
BUCKET_NAME: "staging.myapp.appspot.com"
handlers:
- url: /_nuxt
static_dir: .nuxt/dist/client
secure: always
- url: /(.*\.(gif|png|jpg|ico|txt))$
static_files: static/\1
upload: static/.*\.(gif|png|jpg|ico|txt)$
secure: always
- url: /.*
script: auto
secure: always
When deploying with both of these app.yaml configurations it deploys successfully to Google App Engine however upon visiting the URL for the instance (myapp.uk.r.appspot.com) I am met with the error as follows:
Error: Server Error
The server encountered an error and could not complete your request.
Please try again in 30 seconds.
And when visiting staging.myapp.appspot.com I am met with a range of errors from a generic Google 404 error to a certificate error. Does anyone have any idea about the correct app.yaml configuration for deploying a Nuxt JS SSR app to Google Cloud App Engine?
Does anyone have any idea about the correct app.yaml configuration for deploying a Nuxt JS SSR app to Google Cloud App Engine?
I replicated your case and deployed the basic tutorial deploying of Nuxt JS app in App Engine using your provided app.yaml configuration. Both configuration are working even I reduced the the instance_class from F2 to F1, its still working well.
As of now, the recommended version of nodejs is nodejs14 but the app is still working in App Engine Standard even the version is nodejs10. The env_variables is optional, you can define environment variables in your app.yaml file to make them available or use it inside your app.
Error:
Error: Server Error
The server encountered an error and could not complete your request.
Please try again in 30 seconds.
The 500 error or server error is hard to find the cause. Look for the logs in Cloud Logging or click this link to direct go to console. Make sure that you are in GAE application > your service name > App Engine Version. Start looking for error appearing when accessing your application and look for error cause description. If you haven't find any try to switch to all logs.
Please note, it also requires the following API is already enabled:
App Engine API
Compute Engine API
Cloud Build API
Additional troubleshooting, double check the listening port on your application.
Please check the application logs to make sure whats happen on GAE
gcloud app logs tail
Then try my yaml file for nuxt SSR too:
runtime: nodejs14
service: nuxt
instance_class: F1
handlers:
- url: /_nuxt
static_dir: .nuxt/dist/client
secure: always
- url: /(.*\.(gif|png|jpg|ico|txt))$
static_files: static/\1
upload: static/.*\.(gif|png|jpg|ico|txt)$
secure: always
- url: /.*
script: auto
secure: always
Solved the issue it seems to have been an oversight regarding specifying a different server port in nuxt.config.js of 8000 rather than the default.
By looking at the logs using:
gcloud app logs tail
This error became apparent:
✖ Nuxt Fatal Error
Error: listen EADDRNOTAVAIL: address not available *.*.*.*:8000
Try this configuration:
runtime: nodejs12
instance_class: F2
handlers:
- url: /_nuxt
static_dir: .nuxt/dist/client
secure: always
- url: /(.*\.(gif|png|jpg|ico|txt))$
static_files: static/\1
upload: static/.*\.(gif|png|jpg|ico|txt)$
secure: always
- url: /.*
script: auto
secure: always
env_variables:
HOST: '0.0.0.0'
I have an nuxt app running in App Engine, and this is my Yaml config.
I suggest you to check if your application is Enabled in GCP/App Engine/Configurations=>Deactivate App field.
Related
I am trying to deploy the react app on gcloud. The app builds and starts normally when I do it locally.
If I npm start from gcloud console it's also available.
The problem is that when I build the app and deploy it to App Engine, the redirects does not work.
I have a google sign in added to the page but when I click Sign In, instead of redirecting, page says that the URL was not found and the url string after {app-url}/ consists of the contents of index.html.
I have tried different variations of the app.yaml file. The one I'm using right now looks like this.
runtime: nodejs16
handlers:
# Serve all static files with url ending with a file extension
- url: /(.*\..+)$
static_files: build/\1
upload: build/(.*\..+)$
# Catch all handler to index.html
- url: /.*
static_files: build/index.html
upload: build/index.html
I'm a noob to gcloud so would appreciate any help.
Thanks
I have a skeleton Google App Engine running on the URL provided by GAE in the format of "myproject.appspot.com". I have two services - one running a backend Node/Express server, and another for a React front-end. The backend service has url "api-dot-myproject.appspot.com" and the front end "client-dot-myproject.appspot.com". I have independently deployed each service along with the root-level dispatch.yaml, and have gotten these GAE-provided urls to work. When I go to the URLs provided by Google, my deployed services work as intended. However, I've also tried used a custom domain from Google Domains which is causing me trouble. I've followed the instructionss provided by Google - I first bought the domain from Google, then added it to Google App Engine. My GAE app then provided me with A, AAAA, and CNAME records to add to my Google Domains "Custom resource records" which I did.
I then waited over 24 hours before trying to access mydomain.app (the domain name I purchased). However, attempting to access the page results in a 404 error.
I've been trying to figure this out for a while now, and I've searched through every previous stackoverflow question on this topic but wasn't able to resolve it. Any help would be greatly appreciated.
dispatch.yaml:
dispatch:
- url: "*client-dot-myproject.appspot.com/*"
service: client
- url: "*mydomain.app/*"
service: client
- url: "*api-dot-myproject.appspot.com/*"
service: api
- url: "*/*"
service: client
api.yaml
runtime: nodejs12
service: api
handlers:
- url: /api/
script: auto
- url: /
script: auto
client.yaml
runtime: nodejs12
service: client
handlers:
- url: /static/js/(.*)
static_files: build/static/js/\1
upload: build/static/js/(.*)
- url: /static/css/(.*)
static_files: build/static/css/\1
upload: build/static/css/(.*)
- url: /static/media/(.*)
static_files: build/static/media/\1
upload: build/static/media/(.*)
- url: /(.*\.(json|ico|png))$
static_files: build/\1
upload: build/.*\.(json|ico|png)$
- url: /
static_files: build/index.html
upload: build/index.html
http_headers:
Access-Control-Allow-Origin: "*"
- url: /.*
static_files: build/index.html
upload: build/index.html
http_headers:
Access-Control-Allow-Origin: "*"
Truly one of the dumbest mistakes - I had switched over gcloud projects at some point and forgot to reinitialize with gcloud init.
I am trying to migrate a Google App Engine Standard Flask web app from Python 2.7 to Python 3. It works perfectly when deployed to appspot but I'm still experiencing issues while running a local dev server.
The issue is that when running on the local dev server my app is unable to find my static files. I get this error Uncaught SyntaxError: Unexpected token '<' and it's against my jquery-3.3.1.min.js: file. I'm reasonably sure that what's happening is that it's trying to find my JQuery file, fails, receives a 404 error html page, and throws a syntax error because it's expecting a JavaScript file and not HTML.
My JQuery file isn't the only static file affected. For example, my CSS isn't loading and my app can't find my local images.
Here are some code snippets:
app.yaml
runtime: python38
instance_class: F4
automatic_scaling:
max_concurrent_requests: 30
handlers:
- url: /_ah/start
script: auto
- url: /app_shared/app_setup/app_style/*
static_dir: app_shared/app_setup/app_style
- url: /app_shared/app_setup/app_images/*
static_dir: app_shared/app_setup/app_images
- url: /app_shared/app_static/jquery/v_3_3_1/*
static_dir: app_shared/app_static/jquery/v_3_3_1
- url: /app_shared/app_static/util/*
static_dir: app_shared/app_static/util
- url: .*
script: auto
error_handlers:
- file: app_code/templates/errors/default.htm
- error_code: timeout
file: app_code/templates/errors/408_timeout.htm
h_main_header_menu.htm (this is within the head tag)
<script src="/app_shared/app_static/jquery/v_3_3_1/jquery-3.3.1.min.js"></script>
Here is the hierarchy to the JQuery file from the root of the project: app_shared/app_static/jquery/v_3_3_1_jquery-3.3.1.min.js
To run the local dev server I follow Google's documentation here and here. So I run it with the commands venv\Scripts\activate followed by python main.py.
Does anybody know what's going wrong here? I'm at a loss. Any help here is appreciated. Thanks ahead of time.
I figured it out. I needed to rename my app_shared folder to static. You can find Flask documentation on it here
When I try to run my nodeJS dev_app server locally to test my app.yaml file, I am getting this error:
RuntimeError: Unknown runtime 'nodejs8'; supported runtimes are
'custom', 'go', 'java', 'java7', 'java8', 'php55', 'php72', 'python',
'python-compat', 'python27', 'python37'.
However Google announced that NodeJS is now supported with AppEngine standard environment. Here's my app.yaml file:
runtime: nodejs8
service: front
handlers:
- url: /.*\.[jpg|css|js|svg|ttf]
secure: always
redirect_http_response_code: 301
static_files: public/\1
upload: public/.*
- url: /.*
secure: always
script: bin/start
PS: I updated my google cloud SDK, the current version is 209.0.0
Unlike for other standard environment supported languages, for node.js local development doesn't appear to be using the SDK-supplied development server, which is probably why you see that error when trying to run that server. From Running locally:
To test your application's functionality before deploying, run your
application in your local environment with the development tools that
you usually use.
For example, npm start.
I recently set up a Node.js app in Google App Engine and it is running fine. I tried to add handlers so that all the requests to website can be redirected to https URLs. Below is my app.yaml file
# [START runtime]
runtime: nodejs
vm: true
# [END runtime]
# Temporary setting to keep gcloud from uploading node_modules
skip_files:
- ^node_modules$
# [START handlers]
handlers:
- url: /.*
secure: always
# [END handlers]
When I tried to run the upload script, gcloud preview app deploy app.yaml, it throws below exception:
ERROR: (gcloud.preview.app.deploy) An error occurred while parsing file: [/Users/rakesharidasan/BackwaterBreaks-UI-Release/app.yaml]
Unknown url handler type in line 14, column 17 (end of # [END handlers]).
I could see similar questions in StackOverflow, but many of them were related to indentation or white space issues. I believe my app.yaml got right indentation and I checked it through few online parsers eg - http://codebeautify.org/yaml-validator
The upload script will still run if I remove the handlers part from yaml.
Any ideas what goes wrong here?
The handler section must also specify a handler type, in this case a script or the main entry point to your app
Example:
- url: /.*
script: app.js
secure: always