Hello fellow developers and data scientists. I have a question about a problem with accessing the API deployed on the google app engine from the javascript app deployed on Heroku.
When I access my API link on google chrome, it works properly. However, when I use my javascript app deployed on Heroku to call my API link, it sometimes does not work and return me the network error. CORS error
I have followed the instruction on "https://cloud.google.com/appengine/docs/standard/python3/config/appref" to enable the CORS access on my app API in the app.ymal file on google app engine as the following
runtime: python37instance_class: F4_1Ghandlers:
- url: /images
static_dir: static/images
http_headers:
Access-Control-Allow-Origin: ‘*’
Similarly, I have also enabled the CORS access on my javascript app (React) deployed on Heroku as shown in the picture attached. CORS enabled on Heroku However, the problem still persists. I am not sure if it has to do with the way we set up our code or the google app engine server itself. If there is anything I could do besides what I have done I would love to hear that as well. Thanks a lot!
The instructions listed on the google cloud documents (CORS Support) apply only to static assets (such as images). However if you want to call your API (which consists of dynamic pages like Python scripts) you have to do the configuration on the Python side, by sending the appropriate headers from your scripts. Here's an example on how to do it by using a Flask extension called Flask-CORS:
from flask import Flask
from flask_cors import CORS
app = Flask(__name__)
cors = CORS(app, resources={r"/api/*": {"origins": "*"}})
#app.route("/api/v1/users")
def list_users():
return "user example"
The way to do it on your own script really depends on your implementation.
Related
I'm trying to deploy an Angular app to a Google Cloud Storage bucket so that I can serve the app from there. The bucket has public access and is named so that I can serve it as a custom website via CNAME (let's say test.example.com). The bucket is also configured to map the main page to index.html and the 404 handler to index.html. When loading https://test.example.com, most of the app loads fine, but any of the assets that are loaded via XHR (GET from /assets/) get an HTTP 401 error. There are no preflight requests. I've tried setting various permutations of CORS settings on the bucket, but nothing seems to help.
I am getting this on loading on assets.
<?xml version='1.0' encoding='UTF-8'?><Error><Code>AuthenticationRequired</Code><Message>Authentication required.</Message></Error>
Can anyone help me out.
We are using Google Cloud Storage and Google DNS Hosting for this.
Any request your application sends to the Cloud Storage JSON API that requires authorization needs to identify your application to Google.
You can identify your application by 2 ways:
Using an OAuth 2.0 token (which also authorizes the request)
Using the application's API key
Please follow the steps in the Documentation linked above to use whether Oauth 2.0 token or API key.
Let me know if it works for you.
I have a Nginx webserver in front of a Node REST API delivering JSON formatted data.
I also have a web app which consumes the above API and works fine for a majority of the requests it makes but sometimes, for certain URLs, the client gets a CORs error aka an 'Access-Control-Allow-Origin' error.
When I call the data again from the server of the web app it works fine again.
Could anyone shed some light on this issue.
I am using axios to call the API from the web app
You need to add CORS headers in response so that api can be accessed from browser.
You can use npm cors package https://www.npmjs.com/package/cors
I'm using Ionic 3 to develop an app, but the problem is that all of the company's webservices is based in SOAP requests.
In the preview of the app, using ionic serve --lab, I tried to do ajax requests using Http Module, but every time that I do a request I get this error in the console:
XMLHttpRequest cannot load http://example.com/soapwebservice. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8100' is therefore not allowed access.
Tried to used jQuery Ajax and XMLHttpRequest directly in the console too, but still get the error.
-- Edit
Found that when using ionic cordova run android --device to test in the device, the problem goes away. In the device the origin don't exist, because the app is run on file:///, and in the ionic serve the origin is in localhost, so it shows the CORS error.
Personally, my preference would be to write the Android "SOAP Client" in Java.
But it's still possible to consume SOAP services from JavaScript.
Here is a good tutorial:
SOAP Web Services in Angular and Ionic
This example uses "JavaScript SOAP Client": http://javascriptsoapclient.codeplex.com/
Finally found how to make it.
When using ionic cordova run android --device to test in the device, the problem goes away. In the device the origin don't exist, because the app is run on file:///, and in the ionic serve the origin is in localhost, so it shows the CORS error.
To fix this in ionic serve, I followed this amazing tutorial, that shows how to easily create a proxy in Ionic, and access other websites through that proxy.
It basically creates a path inside your localhost, like http://localhost/api, that points to the URL you want to access, so you won't get any CORS error, because you're accessing the same origin now!
It is very ease to configure. As the tutorial says, you just need to add the proxy configuration inside ionic.config.json file, like in the example:
{
"name": "proxy-example",
"app_id": "",
"proxies": [
{
"path": "/api",
"proxyUrl": "http://cors.api.com/api"
}
]
}
And now you can make Ajax requests to http://localhost:8100/api!
I'm attempting to install the DrEdit sample app for Salesforce onto GAE. The app runs, but saving or opening a file results in an HTTP 403 "Access Not Configured Error".
I have also attempted to use the values for API Access>Client ID for web applications. The Google Drive SDK> OAuth Client ID has also been set variously to the Drive SDK and web app Client IDs.
but, After enabling both (Api, SDK) in Api access service i am still getting same error.
Please see duplicate post about this: Google Drive HTTP 403 “Access Not Configured” error
Copy of the answer given:
Can you make sure that you register your application on the Google APIs Console and enable the Drive API and SDK for it first?
It's all described here: https://developers.google.com/drive/register
Then make sure that you use your Client ID and Client Secret in DrEdit's configuration file.
I'm attempting to install the DrEdit sample app for Salesforce onto GAE. The app runs, but saving or opening a file results in an HTTP 403 "Access Not Configured Error".
I have also attempted to use the values for API Access>Client ID for web applications. The Google Drive SDK> OAuth Client ID has also been set variously to the Drive SDK and web app Client IDs. but, After enabling both (Api, SDK) in Api access service i am still getting same error.
Can you make sure that you register your application on the Google APIs Console and enable the Drive API and SDK for it first?
It's all described here: https://developers.google.com/drive/register
Then make sure that you use your Client ID and Client Secret in DrEdit's configuration file.