CS5331 Submission

Dockerfile

@@ -1,12 +1,27 @@
 FROM ubuntu:latest
-RUN apt-get update
+RUN apt-get update 
 RUN apt-get install -y python-pip
 RUN apt-get install -y apache2
-RUN pip install -U pip
-RUN pip install -U flask
-RUN pip install -U flask-cors
+RUN apt-get install -y gunicorn
+COPY requirements.txt /requirements.txt
+RUN pip install --upgrade pip
+RUN pip install -U setuptools pip wheel && pip install -r /requirements.txt
+
+# RUN pip install -U bcrypt
+# RUN pip install -U jinja2
+# RUN pip install -U Flask
+# RUN pip install -U pip
+# RUN pip install -U flask_sqlalchemy
+# RUN pip install -U flask-cors
+# RUN pip install -U flask_wtf
+# RUN pip install -U SQLAlchemy
+
+
+RUN apt-get install -y sqlite3
 RUN echo "ServerName localhost  " >> /etc/apache2/apache2.conf
 RUN echo "$user     hard    nproc       20" >> /etc/security/limits.conf
+WORKDIR ./src
+
 ADD ./src/service /service
 ADD ./src/html /var/www/html
 EXPOSE 80

README.md

@@ -2,142 +2,93 @@
 
 CS5331 Assignment 1 Project Reference Repository
 
-## Instructions
+## Team Members
 
-Your objective is to implement a web application that provides the endpoints
-specified here: https://cs5331-assignments.github.io/rest-api-development/.
+1. LAU Wee You
+2. LEE Zi Shan
+3. SIA Wei Kiat Jason
+4. ZHOU Zhi Zhong
 
-The project has been packaged in an easy to set-up docker container with the
-skeleton code implemented in Python Flask. You are not restricted in terms of
-which language, web stack, or database you desire to use. However, please note
-that very limited support can be given to those who decide to veer off the
-beaten path.
+## Short Answer Questions
 
-You may be required to modify the following files/directories:
+### Question 1: Briefly describe the web technology stack used in your implementation.
 
-- Dockerfile - contains the environment setup scripts to ensure a homogenous
-  development environment
-- src/ - contains the front-end code in `html` and the skeleton Flask API code
-  in `service`
-- img/ - contains images used for this README
+The application uses Python-Flask to handle requests to the back-end. The code in the Python-Flask will then modify our database using SQLite3. 
 
-Assuming you're developing on an Ubuntu 16.04 machine, the quick instructions
-to get up and running are:
+On the UI, we use javascript to asynchronously call our RESTful API and modify our HTML accordingly.
 
-```
-# Install Docker
+*****
+### Question 2: Are there any security considerations your team thought about?
 
-sudo apt-get update
-sudo apt-get install \
-    apt-transport-https \
-    ca-certificates \
-    curl \
-    software-properties-common
-curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo apt-key add -
-sudo add-apt-repository \
-   "deb [arch=amd64] https://download.docker.com/linux/ubuntu \
-   $(lsb_release -cs) \
-   stable"
-sudo apt-get update
-sudo apt-get install docker-ce
+Yes. However, given that it is not part of the requirements, we have not implemented them. 
 
-# Verify Docker Works
+Sanitization of inputs should be implemented so that user cannot conduct injection attacks such as SQL-Injection and XSS. For example, without sanitisation, user can write a simple script in a public entry
 
-sudo docker run hello-world
+Password protection considerations such as limiting the number of login attempts, password checkers to check for weak passwords. 
 
-# Run the skeleton implementation
+Enforcing same origin policy to prevent script from another page to obatain data from the current page.
 
-sudo ./run.sh
-```
+Looked into the possibility of using prepared statements to prevent SQL injection by only allowing specified queries to run. 
 
-(Docker CE installation instructions are from this
-[link](https://docs.docker.com/install/linux/docker-ce/ubuntu/#install-using-the-repository).)
+Filtering all calls to the api first by checking if they are currently login, this will create another layer of barrier from the front end.
 
-**Please consult your assignment hand-out for detailed setup information.**
+Implement web certificates so that users can trust that they are heading to the correct site.
 
-## Grading
+Session ID might be stolen, as such if possible we would like to tie the session id to the source IP adress and user agent as well. 
+
+*****
+### Question 3: Are there any improvements you would make to the API specification to improve the security of the web application?
 
-The implementation will be graded in an automated fashion on an Ubuntu 16.04
-virtual machine by building the docker container found in your repository and
-running it. The grading script will interact with your API.
+Use port 80 for both backend and front end so that CORS can be disabled.
 
-The following ports are expected to be accessible:
+****
+### Question 4: Are there any additional features you would like to highlight?
 
-1. 80, on which static HTML content, including the front-end, is served.
-2. 8080, on which the API is exposed.
+1) We provide a friendly way to show the diary page, `read more` has a card window to display this diary. modify diary permission and delete personal diaries. Inside `Read My Diary Entries`, we can switch the permission between `public` and `private` through `eye` icon, and delete the page from `delete` icon.
 
-To verify this, please run the following commands:
+****
+### Question 5: Is your web application vulnerable? If yes, how and why? If not, what measures did you take to secure it?
 
-```
-sudo ./run.sh
-```
 
-On a different window:
+Yes, the web application is vulnerable. 
+1) There is a chance of leaked session ID. Hence to be more defensive, We store session data such as token on the server side in our Users table. Every login, we will generate a new token and this token will be tagged to the current user for the particular session. For every re-login, we will generate a new token.
+
+2) There is a chance of XSS attack. In our create diary entry page, we placed a script within the Text field such as "<Script>Alert('hello')</ Script>" and we created the diary post, the script was also run.  One possible measure is to do a sanity check on what are the inputs being passed from the user to ensure that there are no scripts. Enabling content security policy might help by using a HTTP header to provide a whitelist of sources of trusted content and allow rendering of resources from these sources. In addition there is a possibility of token being stolen due to XSS attacks.
 
-```
-curl http://localhost:80
-curl http://localhost:8080
-```
+3) There is a possibility of CSRF attack where the attacker send a forged request on behalf of the victim. In the case of the diary application, a possibile scenario would be the attacker send a request to see the victim's private diary requests or do a public post on behalf of the victim. To increase defense against this, we can do a HTTP referrer validation. By checking the header, we will be able to see if the request is from the same site or cross site, giving the server a better understanding of which site is making the request. 
 
-If a response is received, you're good to go.
+4) The current application is also susceptible to eavesdropping, as such we can implement HTTPS to prevent man in the middle attack.
 
-**Please replace the details below with information relevant to your team.**
+5) Prone to DOS attack, we can implement some services to hold any request from the particlar IP if there is an unusual amount of request from them.
 
-## Screenshots
-
-Please replace the example screenshots with screenshots of your completed
-project. Feel free to include more than one.
-
-![Sample Screenshot](./img/samplescreenshot.png)
-
-## Administration and Evaluation
-
-Please fill out this section with details relevant to your team.
-
-### Team Members
+6) Brute force attack, we should deny the user from logging in if they have key in more than 3 times of wrong password combination.
 
-1. Member 1 Name
-2. Member 2 Name
-3. Member 3 Name
-4. Member 4 Name
 
-### Short Answer Questions
 
-#### Question 1: Briefly describe the web technology stack used in your implementation.
+### Feedback: Is there any other feedback you would like to give?
+- Assignment could have been more security focused (For example, given a existing secret diary, implement XXX security features).
 
-Answer: Please replace this sentence with your answer.
+## Declaration
 
-#### Question 2: Are there any security considerations your team thought about?
+### Please declare your individual contributions to the assignment:
 
-Answer: Please replace this sentence with your answer.
+1. LAU Wee You
+    - Docker requirements, implementing database, skeleton codes, debugging
+2. LEE Zi Shan
+    - Linking front-end and back-end (diary), back-end (diary)
+3. SIA Wei Kiat Jason
+    - Front-end design and implementation, Database Design
+4. ZHOU Zhi Zhong
+    - Linking front-end and back-end (users), back-end (users)
 
-#### Question 3: Are there any improvements you would make to the API specification to improve the security of the web application?
 
-Answer: Please replace this sentence with your answer.
-
-#### Question 4: Are there any additional features you would like to highlight?
-
-Answer: Please replace this sentence with your answer.
-
-#### Question 5: Is your web application vulnerable? If yes, how and why? If not, what measures did you take to secure it?
-
-Answer: Please replace this sentence with your answer.
-
-#### Feedback: Is there any other feedback you would like to give?
+## Screenshots
 
-Answer: Please replace this sentence with your answer.
+![Create Diary](./img/Create_diary.png)
 
-### Declaration
+![Personal Diary Entries](./img/Personal_diary.png)
 
-#### Please declare your individual contributions to the assignment:
+![Profile Page](./img/Profile.png)
 
-1. Member 1 Name
-    - Integrated feature x into component y
-    - Implemented z
-2. Member 2 Name
-    - Wrote the front-end code
-3. Member 3 Name
-    - Designed the database schema
-4. Member 4 Name
-    - Implemented x
+![Public Diary Enntries](./img/Public_diary.png)
 

kill-restart.sh

@@ -0,0 +1,5 @@
+#/bin/bash
+
+lsof -n -iTCP:80  -sTCP:LISTEN -n -l -P | grep 'LISTEN' | awk '{print $2}' | xargs kill -9
+lsof -n -iTCP:8080  -sTCP:LISTEN -n -l -P | grep 'LISTEN' | awk '{print $2}' | xargs kill -9
+# sudo ./run.sh

requirements.txt

@@ -0,0 +1,13 @@
+Flask
+Flask-SQLAlchemy
+Jinja2
+SQLAlchemy
+Werkzeug
+wsgiref
+Flask-WTF
+alembic
+itsdangerous
+bcrypt
+jinja2
+flask-cors
+flask_wtf

run.sh

@@ -5,8 +5,10 @@ if [ "$EUID" -ne 0 ]
   exit
 fi
 
+
 TEAMID=`md5sum README.md | cut -d' ' -f 1`
 docker kill $(docker ps -q)
 docker rm $(docker ps -a -q)
 docker build . -t $TEAMID
-docker run -p 80:80 -p 8080:8080 -t $TEAMID
+docker run -v $(pwd)/src/service/flaskr.db:/service/flaskr.db -p 80:80 -p 8080:8080 -t $TEAMID 
+

src/html/createPost.html

@@ -0,0 +1,98 @@
+<html>
+   <head>
+      <link href="./css/bootstrap.min.css" rel="stylesheet">
+      <link href="./css/stylesheet.css" rel="stylesheet">
+      <link rel="stylesheet" href="../css/bootstrap.min.css">
+         <script src="./js/demo.js"></script>
+         <script src="./js/jquery-3.3.1.min.js"></script>
+         <script src="./js/bootstrap.min.js"></script>
+         <script src="./js/login.js"></script>
+   </head>
+   <body  onload="userIsLoggedIn();">
+
+       <nav class="navbar navbar-expand-lg navbar-light bg-light">
+  			<a class="navbar-brand" href="./index.html">My Secret Diary</a>
+  			<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+    <span class="navbar-toggler-icon"></span>
+  </button>
+  <div class="collapse navbar-collapse" id="navbarNav">
+    <ul class="navbar-nav mr-auto">
+
+	<div id="userNavLeft"></div>
+    </ul>
+    <ul class="nav navbar-nav"> 
+	<div id="userNavRight"></div>
+     </ul>
+
+  </div>
+</nav>
+<div class='container jumbo-container'>
+	<form id ="f" style:"display:hidden">
+			<label>Title</label> 
+			<input type="text" id="title" class="form-control" style="margin-bottom:10px"></input>
+
+				<input type="radio" id="public" name="privacy" value="1"><label for="publicType1"> Public</label>
+				<input type="radio" id="privacyType2" name="privacy" value="0"><label for="publicType1"> Private</label>			
+
+ 				<br>
+				<label>Text</label> 
+				<textarea type="text" id="text"row="20", style="width:100%; height:300px", class="form-control"></textarea>
+				<br>
+				<button class ="btn float-right btn-primary" type="button" id="submitCreate">Create</button>
+				</div>
+
+</form>
+
+</div>
+<script>
+  $(document).ready(function(){
+         // click on button submit
+        $("#submitCreate").on('click', function(e){
+          console.log('create button clicked')
+          var title = $("#title").val()
+          var pub = $("input[name='privacy']:checked").val()
+	  pub = pub==1? true:false
+          var text = $("#text").val()
+          tokencookie = getCookie("token");
+
+          $.ajax({
+            url: 'http://localhost:8080/diary/create', // url where to submit the request
+            type : "POST", // type of action POST || GET
+            dataType : 'json', // data type
+            data : JSON.stringify({title:title,public:pub,text:text, token:tokencookie}),
+            contentType: "application/json",
+            success : function(data) {
+
+                console.log(data.status);
+                if (data.status == true)
+                {
+                  alert("Post created!");
+              window.location= "./privateDiary.html"
+                }
+                else
+                {
+                   alert(data.error);
+                   console.log(data.error)
+                  //window.location= "./login.html";
+                }
+
+            },
+            error: function(xhr, resp, text) {
+                console.log(xhr, resp, text);
+            }
+          });
+
+        });
+  });
+
+</script>
+
+
+
+         <script src="./js/jquery-3.3.1.min.js"></script>
+         <script src="./js/bootstrap.min.js"></script>
+	<script src="./js/login.js"></script>
+
+
+   </body>
+</html>

src/html/css/privateDiary.css

@@ -0,0 +1,14 @@
+.canClick {
+	cursor: pointer;
+}
+
+
+.iconsPlacement{
+	float:right;
+}
+
+
+.eyeMargin{
+
+	margin-right: 10px;
+}