Secure Flask API used for serving JSON files to a basic HTML, JavaScript, and CSS web application

I have developed a basic web application that will display data in a table and be updated on a weekly basis.

To perform this update, I utilize Python code in the backend to scrape and modify data before storing it in a SQLite database.

After some research, I discovered that in order to deliver this data to my web app, I need to create an API using Flask. This API will receive the data and send it to the JavaScript in my web app as JSON for populating the table. However, considering securing the API with a username and password may not be necessary since the frontend is in JS and the credentials could potentially be accessible to users.

Should I make my API accessible to everyone, or is there a better way to use SQLite data as a backend for my web application? I am open to keeping the API restricted to GET requests only.

javascriptflaskflask-restful

Answer №1

Your API security measures may be unnecessary in some cases, as securing an API is only crucial under specific circumstances.

If you are handling confidential data that should not be accessible to everyone, especially through backend calls, implementing security measures such as API keys or authorization tokens would be advisable.

On the other hand, if your frontend is making calls to a backend API and the user can already view and access the data being returned, adding extra security might not serve any purpose.

In situations where sensitive information on a webpage needs protection, focusing on securing the website itself (such as requiring a login with credentials) could be more effective. By ensuring that only authenticated users can access certain pages, you can update the API to limit responses to authorized requests.

Websites offering free data often have unsecured frontend API calls since the data is freely available. While some sites try to verify their own domain is accessing the API, this method can still be circumvented by web scrapers extracting data from the HTML.

Answer №2

For an in-depth guide on adding authentication headers to your Python Flask app, check out this helpful resource. One approach is to hard code the header information directly into Flask for added security. Alternatively, you can explore a more complex method of retrieving header data from your database. Below is a snippet of code that retrieves information from a PostgreSQL database, which can be adapted for use with SQLite:

def authenticate():
  headers = request.headers
  authorization_key = headers.get("X-Api-Key")
  authorized_user = User.query.filter_by(apikey=authorization_key).first_or_404()
  print('Retrieved from database: ', authorized_user,'', authorization_key)
  return str(authorized_user)

Answer №3

  1. If your intention is to display public data, there may not be a need for authentication. Implementing unnecessary security measures could result in wasted time.
  2. With only a simple database table, creating an API may be overkill. You can opt for generating an HTML template and populating it with the data instead. Check out some sample templates here and browse through a few more examples here.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Exploring the seamless integration of Material UI with React version 18

I am having an issue with my background not turning black in React version 18.2.0 when using makeStyles from Material UI version 4. Despite no errors in the code, the background remains unchanged. How can I fix this problem? import './App.css'; i ...

javascriptreactjsmaterial-ui

What is the best way to have various texts display after a certain number of clicks?

I am looking for a way to display different text based on the number of clicks within a certain class. For example, if the user clicks twice, the text displayed should be "You clicked two times", and this pattern continues until the fifth click, after whic ...

javascriptjqueryclick

The Functionality of Accordions

I have created a responsive accordion script that functions smoothly and allows for easy access to content within each drawer. Unlike many accordions, this one does not cause issues with positioning after opening. The code I am using includes a toggle acti ...

javascriptjqueryaccordionslidetoggle

Is there a way for me to choose all the classNames that conclude with a specific word within the MUI sx property?

I am currently working with MUI and I have a need to modify certain properties that are prefixed with random IDs. How can I target, for instance, the first one using: '& endsWith(MuiAccordionDetails-root)' I wish to achieve this because the ...

javascriptcssreactjsmaterial-ui

Angular 2 - Karma is having trouble locating the external template or style file

The file structure for this project (taken from the Angular 2 official site) is as follows: https://i.stack.imgur.com/A6u58.png Upon starting Karma, I encountered errors indicating that two files were not found under /@angular/... To resolve this issue, ...

javascriptangularunit-testing

What is the best way to extract a specific year and month from a date in a datatable using

My dataset includes performance scores of employees across various construction sites. For instance, on 2020-03-15, ALI TAHIRI was at the IHJAMN site. I need to filter this dataset by year and month. If I input 2020 for the year and 03 for the month, the d ...

javascriptjqueryhtmldatatabledatatables

Removing a single object from an array of objects using MongooseJS

Hello to all the MongooseJS experts out there! I'm a newcomer to MongooseJS, and I've been trying to solve this problem for the past two days but haven't found a solution yet. Thank you in advance for any help! The Issue with My Delete me ...

javascriptnode.jsmongodbexpressmongoose

Content update failed due to an error

Why is an error occurring when attempting to update the content? The edited value is retrieved in the componentDidMount function without any issues. Posting the content works fine, but updating it using reactjs and django tastypie api throws an error as fo ...

javascriptpythonajaxdjangoreactjs

Invoke custom_function on every individual element in the array

I have an array with a list of IDs [1,2,3,4,5]; and I want to apply the function custom_function to each element. Once all instances of the custom_function have completed their work, I want to get the result of the function. How can I achieve this using ...

javascriptnode.jsasync.js

Dealing with redirecting to the login page in Angular

I recently started working with Angular and I feel completely lost. My initial task involves making a simple Rest-GET request, but the destination is located behind an external login page. This results in my request being redirected to the external page a ...

javascriptangularjshttp-redirectauthentication

Challenges arise when integrating ng-model with Angular Chosen

I'm working with a table that lists users, each row ending with a button that triggers a popup form. Inside the popup, I'm using a multiple select feature with Angular Chosen to display each user's 'interests'. However, despite fet ...

javascriptangularjsjquery-chosenangular-chosen

How to Update a Nested Document in Mongoose

I am currently working on a polls application using angular, express, and mongoose. Here is an overview of my data structure: var mongoose = require('mongoose'); var responseSchema = new mongoose.Schema({ responseText: String, votes: { ...

javascriptangularjsmongodbexpressmongoose

Exploring new options to deduct time from Kendo UI timepickers without relying on Javascript

My current project involves an Asp.net MVC 4 application that includes a Time entry screen. This screen utilizes various Kendo controls and Razor Html helpers to enhance the user experience, such as: @(Html.Kendo().TimePickerFor(m => m.StartTime).Name( ...

javascriptjqueryasp.net-mvcrazorkendo-asp.net-mvc

Learn the process of dynamically populating an HTML table with data using JavaScript and JSON

I have developed a code snippet to dynamically add an HTML table without using jQuery. The code serves as an application from the server to the client, where the client receives a JSON object to parse into a string. Here is how you can add an HTML table ...

javascripthtmljson

Using Flexbox to ensure two elements do not appear next to each other

When viewing on large screens, I want all elements to be on one row. On smaller screens, I want them to be on three rows. Specifically, I don't want to see the button next to the H1 element on the same row. How can flexbox help solve this problem? Tha ...

javascripthtmlcsslayoutflexbox

Learning to transform EST time data into local time within JavaScript utilizing moment.js and Date objects

The recorded date and time is "03/19/2020 13:15:00" in Eastern Standard Time (EST). When attempting to convert it to the local timezone, I have tried various methods, such as using moment.js to change the format from 'MM/DD/YYYY HH:mm:ss' to UT ...

javascriptjquerynode.jsdatemomentjs

Local email.js functionality successful, but fails upon deployment alongside React

I have implemented Email.js to create a contact form for a Next.js website. It functions perfectly when tested locally, but encounters issues once deployed. Upon clicking the submit button, the form fails to reset as intended within the sendEmail function. ...

javascriptreactjsemailnext.jsenvironment-variables

Choosing an ID along with a numerical value in jQuery

Being new to both stackoverflow and jQuery, I'm facing a challenge in creating a basic function. In my website, there are multiple links with IDs such as "filtro1", "filtro2", and so on. My goal is to write a single piece of code that will be trigger ...

javascriptjquerystringjquery-selectors

What is the most effective way to display a star rating determined by the average score?

Currently, I am working on a project using Django and Jquery. The task at hand is to display hotel ratings with stars colored in orange based on an average score obtained from user votes. Let me provide you with an example: score = 8 vote= 2 average = 4 T ...

javascripthtmljquerydjangorating-system

The TypeScript Promise error codes TS2304 and TS2529 are causing confusion among

I came across the code below: function asyncTask(): Promise<string> { return new Promise<string>(resolve => resolve); } This code resulted in the following error: TS2304: cannot find name 'Promise' To address this issue, ...

javascripttypescriptpromise