мое приложение Flask должно читать URL-адреса с новостного сайта (URL-адреса статей) и анализировать свойства статей (индексы читаемости, свойства html и т. Д.).
У меня нет проблем с его локальным запуском. Я использую для сохранения URL-адресов это расширение Chrome (https://chrome.google.com/webstore/detail/tabstore-plugin/jngplpdonggccbjlmbphlbancacmpmpp?hl=en). После нажатия на кнопку Сохранить его - он сохраняет все URL-адреса открытых вкладок в json, и после этого я запускаю свою фляжку ЛОКАЛЬНО, и она читает эти URL-адреса из jsonсохранено на моем компьютере (и после этого я анализирую свойства текста ...).
Но через несколько недель я бы хотел развернуть свою фляжку (в Heroku / PythonEverywhere / я просто не решил, где .. .) и я понимаю, что так работать не будет, и мне нужно выяснить как я могу отправить POST-запрос (файл json с URL-адресами) в приложение Flask, работающее на сервере (не локально).
Я отредактировал немного плагин TABS store chrome - я добавил кнопку, чтобы запустить мое приложение фляги (просто чтобы открыть новый сайт == мое приложение фляги), и весь процесс должен выглядеть так, как я нажимаю, чтобыСохраните URL, после чего я нажимаю кнопку, открывающую новую вкладку с моим приложением Flask (которое уже получает URL из плагина Chrome).
EDITED ...
Я просто выясняю, как показатьчерез Flask выход (я имитировал POST через POSTMAN app) ... есть часть моего приложения фляги, где я показываю опубликованный URL.
@app.route('/jsonexample', methods=['POST'])
def jsonexample():
req_data = request.get_json()
#json is formatted as list, so we choose 1st element from list
url_n1 = req_data[0]
return '''
The 1st url is: {}
'''.format(url_n1)
Но может ли кто-нибудь помочь мне с запросом POST в JavaScript ??? Я довольно новичок в JS.
Вот мой manifest.json:
{
"update_url": "https://clients2.google.com/service/update2/crx",
"manifest_version": 2,
"name": "tabStore_MREVAK_version",
"description": "This extension will store the urls of all the tabs opened and launch the FLASK APP",
"version": "1.0",
"minimum_chrome_version": "23",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"activeTab",
"tabs",
"notifications",
"fontSettings"
]
}
Вот мой popup.html:
<!doctype html>
<html>
<head>
<title>tabStore</title>
<script src="popup.js"></script>
</head>
<body>
<!-- <input type="button" id="btnOpenNewTab" value="Click to open new tab"/> -->
<button id="saveActionId"> Save urls </button>
<button id="btnOpenNewTab"> Click to open App </button>
<button id="loadActionId"> Load </button>
<input type="file" id="files" name="files[]" style="visibility: hidden;" multiple />
<a id="downloadAnchorElem" style="display:none"></a>
</body>
</html>
И вот вся моя логика плагина -popup.js:
document.addEventListener('DOMContentLoaded', function() {
// Check for the various File API support.
if (window.File && window.FileReader && window.FileList && window.Blob) {
//
} else {
alert('The File APIs are not fully supported in this browser.');
}
// button to open stackoverflow-just placeholder, it will be link on my flask app
window.addEventListener('DOMContentLoaded', function() {
// your button here
var link = document.getElementById('btnOpenNewTab');
// onClick's logic below:
link.addEventListener('click', function() {
var newURL = "http://stackoverflow.com/";
chrome.tabs.create({ url: newURL });
});
});
var saveActionButton = document.getElementById('saveActionId');
saveActionButton.addEventListener('click', function() {
myArray = [];
chrome.tabs.query({"currentWindow": true}, //{"windowId": targetWindow.id, "index": tabPosition});
function (array_of_Tabs) { //Tab tab
arrayLength = array_of_Tabs.length;
//alert(arrayLength);
for (var i = 0; i < arrayLength; i++) {
myArray.push(array_of_Tabs[i].url);
}
obj = JSON.parse(JSON.stringify(myArray));
//alert(JSON.stringify(obj));
var dataStr = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(obj));
var dlAnchorElem = document.getElementById('downloadAnchorElem');
dlAnchorElem.setAttribute("href", dataStr );
dlAnchorElem.setAttribute("download", "tabs.json");
dlAnchorElem.click();
});
}, false);
var loadActionButton = document.getElementById('loadActionId');
loadActionButton.addEventListener('click', function() {
document.getElementById('files').click();
}, false);
function handleFileSelect(evt) {
var files = evt.target.files; // FileList object
// files is a FileList of File objects. List some properties.
for (var i = 0, f; f = files[i]; i++) {
var start = 0;
var stop = f.size - 1;
reader = new FileReader();
//alert(f.name);
// If we use onloadend, we need to check the readyState.
reader.onloadend = function(evt) {
if (evt.target.readyState == FileReader.DONE) { // DONE == 2
jsonObj = JSON.parse(evt.target.result);
for (var i=0; i<jsonObj.length; i++) {
chrome.tabs.create({"url": jsonObj[i]}); //chrome.tabs.create({"url": 'http://www.google.com'});
}
}
};
var blob = f.slice(start, stop + 1);
reader.readAsBinaryString(blob);
}
};
document.getElementById('files').addEventListener('change', handleFileSelect, false);
}, false);