flask keep blocking post request sent with "fetch" in js [closed] - flask

Question

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 4 days ago.
Improve this question
i'am trying to make a chrome extension to send back DOM content to the flask server written below. but i am facing this error POST http://localhost:5000/api/json net::ERR_BLOCKED_BY_CLIENT content.js:10 and then afterwards : Uncaught (in promise) TypeError: Failed to fetch.
here is the code:
server.py:
from flask import Flask, request
from flask_cors import CORS
app = Flask(__name__)
cors = CORS(app, resources={r"/api/*": {"origins": "*"}})
app.config['WTF_CSRF_CHECK_DEFAULT'] = False
#app.route('/api/json', methods=['POST'])
def json():
request_data = request.get_json()
language = None
framework = None
python_version = None
example = None
boolean_test = None
if request_data:
if 'language' in request_data:
language = request_data['language']
if 'framework' in request_data:
framework = request_data['framework']
if 'version_info' in request_data:
if 'python' in request_data['version_info']:
python_version = request_data['version_info']['python']
if 'examples' in request_data:
if (type(request_data['examples']) == list) and (len(request_data['examples']) > 0):
example = request_data['examples'][0]
if 'boolean_test' in request_data:
boolean_test = request_data['boolean_test']
return '''
The language value is: {}
The framework value is: {}
The Python version is: {}
The item at index 0 in the example list is: {}
The boolean value is: {}'''.format(language, framework, python_version, example, boolean_test)
if __name__ == '__main__':
app.run(host="0.0.0.0",port=5000,debug=True)
content.js:
fetch('http://localhost:5000/api/json', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify({
"language" : "Python",
"framework" : "Flask",
"website" : "Scotch",
"version_info" : {
"python" : "3.9.0",
"flask" : "1.1.2"
},
"examples" : ["query", "form", "json"],
"boolean_test" : true
})
})
.then(response => response.json())
.then(response => console.log(JSON.stringify(response)))
and finally manifest.json:
{
"manifest_version": 3,
"name": "test extension",
"version": "1.0",
"content_scripts": [{
"matches":["*://*.google.com/*"],
"js": ["content.js"]
}],
"action": {
"default_title": "Click",
"default_popup": "popup.html"
},
"background":{
"service_worker":"background.js"
},
"permissions":["activeTab"]
}
i tried disabling CORS and CSRF protection, but none of them worked. i couldnt send a post request with postman neither.with these attirbutes set:
changed type to "POST" ,On the body tab, change to raw and selected JSON from the drop-down.
body:
{
"language" : "Python",
"framework" : "Flask",
"website" : "Scotch",
"version_info" : {
"python" : "3.9.0",
"flask" : "1.1.2"
},
"examples" : ["query", "form", "json"],
"boolean_test" : true
}

Answer 1

You are trying to parse a response in JSON format within your fetch call. But the server doesn't send any JSON. Use jsonify inside your endpoint. You can find documentation here.
from flask import jsonify
#app.post('/api/json')
def json():
request_data = request.get_json()
language = None
framework = None
python_version = None
example = None
boolean_test = None
if request_data:
if 'language' in request_data:
language = request_data['language']
if 'framework' in request_data:
framework = request_data['framework']
if 'version_info' in request_data \
and 'python' in request_data['version_info']:
python_version = request_data['version_info']['python']
if 'examples' in request_data \
and (type(request_data['examples']) == list) \
and (len(request_data['examples']) > 0):
example = request_data['examples'][0]
if 'boolean_test' in request_data:
boolean_test = request_data['boolean_test']
return jsonify(
language=language,
framework=framework,
python_version=python_version,
boolean_test=boolean_test
)