【发布时间】:2021-07-09 23:49:41
【问题描述】:
我正在 Heroku 中部署一个 django 应用程序,其中我有一些要在模板中执行的 ajax。在我的本地机器上一切正常。但是 ajax 部分在 Heroku 中不起作用。我在这里包含一个模板以供参考。在这里,我使用 Skulpt(在浏览器中运行 python 的选项)。如果有人知道如何解决这个问题以及这背后的原因是什么,请帮忙。感谢您的反馈。
{% load static %}
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Assessment</title>
<style>
.question, .code-area {
display: table-cell;
}
.question {
width:50%;
left: 0;
overflow-y:auto;
overflow-x: auto;
background-color: white;
}
.code-area {
border-left: 2px solid navy;
width:50%;
right: 0;
background-color: white;
}
</style>
<script src="{% static '/codemirror-5.58.3/lib/codemirror.js' %}"></script>
<link href="{% static '/codemirror-5.58.3/lib/codemirror.css' %}" rel="stylesheet">
<link href="{% static '/codemirror-5.58.3/theme/dracula.css' %}" rel="stylesheet">
<script src="{% static '/codemirror-5.58.3/mode/python/python.js' %}"></script>
<script src="https://skulpt.org/static/skulpt.min.js" type="text/javascript"></script>
<script src="https://skulpt.org/static/skulpt-stdlib.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" type="text/javascript"></script>
<script src="https://www.skulpt.org/js/skulpt.min.js" type="text/javascript"></script>
<script src="https://www.skulpt.org/js/skulpt-stdlib.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
// output functions are configurable. This one just appends some text
// to a pre element.
function outf(text) {
var mypre = document.getElementById("output");
mypre.innerHTML = mypre.innerHTML + text;
}
// Here's everything you need to run a python program in skulpt
// grab the code from your textarea
// get a reference to your pre element for output
// configure the output function
// call Sk.importMainWithBody()
function runit() {
<!-- var prog = document.getElementById("editor").value;-->
var prog = editor.getDoc().getValue("\n")
console.log(prog);
var mypre = document.getElementById("output");
mypre.innerHTML = '';
Sk.pre = "output";
Sk.configure({output:outf});
var myPromise = Sk.misceval.asyncToPromise(function() {
return Sk.importMainWithBody("<stdin>", false, prog, true);
});
myPromise.then(function(mod){
console.log('success');
},function(err) {
console.log(err.toString());
alert(err.toString());
});
}
</script>
<div class="container">
<div class="question">
<h2><strong>QUESTION</strong></h2>
<span id="questionText">{{question_to_solve.question | safe}}</span>
</div>
<div class="code-area">
<form id="answer_form" method="post">
{% csrf_token %}
<div class="input">
<textarea rows="30" id="editor" name="code" autofocus>{{question_to_solve.hint | safe}}</textarea></div>
<br/><br/>
<button type="button" onclick="runit()">Run</button>
<input type="submit" value="Submit" class="button">
</form>
<br/><br/>
<div align="left">
<pre id="output" ></pre>
{{message}}
{{output}}
{{error}}
</div>
</div>
</div>
<script type="text/javascript">
$(document).on('submit','#answer_form',function(e){
e.preventDefault();
$.ajax({
type:'POST',
url:"{%url 'question' question_to_solve.id %}",
data:{
code: $('#editor').val(),
csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val(),
action:'post'
},
success:function(json){
<!-- alert(json.message);-->
$('#output').html(json.message);
}
});
});
</script>
<script>
// Convert text area to code mirror python editor
var editor = CodeMirror.fromTextArea(document.getElementById("editor"), {
lineNumbers: true,
mode: "python",
});
</script>
</body>
</html>
【问题讨论】:
标签: javascript jquery django ajax heroku