Это дополнительный вопрос этот .
Цель состоит в том, чтобы использовать некоторый пользовательский ввод, который преобразуется в документ HTML, который должен отображаться на новой вкладке (на который есть ответ по ссылке выше).
Однако проблема заключается в том, что - если документ HTML содержит теги <script> - они не выполняются, когда эта строка HTML передается в формате JSON. Ниже я использую простую строку:
'<!DOCTYPE html><title>External html</title><div>Externally created</div><script>alert("WORKING");</script>'
Это минимальный пример, иллюстрирующий проблему (вы увидите это в своем браузере при загрузке HTML-кода снизу):
Когда я нажимаю на кнопку, открывается новая вкладка, но сценарий не выполняется, т.е. предупреждение не отображается. При нажатии на ссылку alert строка html загружается напрямую и предупреждение отображается правильно.
У меня вопрос, как постобработать строку HTML, возвращаемую из .getJSON, чтобы правильно выполнить скрипт. В настоящее время я делаю это так (весь код можно найти ниже):
$.get('/_process_data', {
some_data: JSON.stringify('some data'),
}).success(function(data) {
var win = window.open("", "_blank");
win.document.body.innerHTML = data;
})
Это мой код:
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="header">
<h3 class="text-muted">Get new tab!</h3>
</div>
<button type="button" id="process_input">no alert</button>
<a href="/html_in_tab" class="button" target='_blank'>alert</a>
</div>
<script src="https://code.jquery.com/jquery-1.12.4.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#process_input').bind('click', function() {
$.get('/_process_data', {
some_data: JSON.stringify('some data'),
}).success(function(data) {
var win = window.open("", "_blank");
win.document.body.innerHTML = data;
})
return false;
});
});
</script>
</body>
</html>
и файл колбы:
from flask import Flask, render_template, request, jsonify
import json
# Initialize the Flask application
app = Flask(__name__)
@app.route('/html_in_tab')
def get_html():
# provided by an external tool
# takes the user input as argument (below mimicked by a simple string concatenation)
return '<!DOCTYPE html><title>External html</title><div>Externally created</div><script>alert("WORKING");</script>'
@app.route('/_process_data')
def data_collection_and_processing():
# here we collect some data and then create the html that should be displayed in the new tab
some_data = json.loads(request.args.get('some_data'))
# just to see whether data is retrieved
print(some_data)
# oversimplified version of what actually happens; get_html comes from an external tool
my_new_html = get_html() + '<br>' + some_data
print(my_new_html)
# this html should now be displyed in a new tab
return my_new_html
@app.route('/')
def index():
return render_template('index_new_tab.html')
if __name__ == '__main__':
app.run(debug=True)