Cloud Compute through APIs via deployed flask app on AWS EC2

Hi

It was my first attempt to do this job which actually intended json responses of python programs for my web app. I was even fortunate to be an AWS educate.

To see the procedure from start you may see:

How to Deploy A Flask App On AWS EC2

His content is accurate and sufficient. However I will like to discuss some of the problems I had to face with a hope that it might help you.

:)

Well firstly I did this task on Windows Machine so had to use putty.

Secondly my server wasn’t the same as used in example. It was a ubuntu-focal-20.04-amd64-server-20201026. For this actually it took almost a day to figure out what was happening.

And herein I will start this guide, there are few modifications in the procedure

The latest python-version : py-3.8 [if it changes you could do the things below]

1. While installing mod_wsgi you may use:

$ sudo apt-get install libapache2-mod-wsgi-py3

for resolving compatibility issues(Remove py3 to see what happens)

2. This one is way general:

$ sudo apt-get install python3

$ sudo apt-get install python3-pip3

$ sudo pip3 install flask

“sudo” is important [It shows that you are the root user]

3. Enabling the mod_wsgi:

to edit “000-default.conf” move to the root using “cd” command and type

$ sudo vim /etc/apache2/sites-enabled/000-default.conf

It will open the editor for you. (Please note that I am discussing the problems in reference to the post linked above. Please go through it once if you haven’t)

So this much is actually sufficient for you to successfully host a flask app on AWS EC2.

Since my job was to use my flask app as an API, I returned JSON responses from the “flaskapp.py” as mentioned in former post. This wasn’t any problem. But when you will try to receive the JSON responses onto any app or postman, they won’t allow it.

This actually happened due to the absence of “Access-Control-Allow-Origin” header in the response of the apache server. Due to its absence browser doesn’t allow to read the returned info.

For greater detailed you may refer the answers at https://stackoverflow.com/questions/43871637/no-access-control-allow-origin-header-is-present-on-the-requested-resource-whe

However I removed the issue by the use of a proxy URL which appended the “Access-Control-Allow-Origin” header to the response of apache server then passed it to the browser.

An example of the same:

const proxyurl = "https://cors-anywhere.herokuapp.com/";
const url = "https://example.com"; // site that doesn’t send Access-Control-*
fetch(proxyurl + url) // https://cors-anywhere.herokuapp.com/https://example.com
.then(response => response.text())
.then(contents => console.log(contents))
.catch(() => console.log("Can’t access " + url + " response. Blocked by browser?"))

where URL is the Public IPV4 address or DNS of your EC2 instance.

Now this worked for me well enough.

However if you face any issue try to find it in the error.log file located at:

/var/log/apache2/error.log

Thanks For Reading.

Happy to Help :)