I am trying to transfer data to python through ajax.. And the error comes like this..
Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
Here is my html code(js and ajax are included here itself) :
<html>
<head>
<style>
.html,
.css {
height: 175px;
border-bottom: 1px solid #cfd6d9;
overflow-y: scroll;
background-color: #f3f5f6;
padding-left: 20px;
}
</style>
</head>
<body>
<div class="container">
<div class="user-container user-html">
<h3>HTML</h3>
<div>(Don't put html, head and body tag)</div>
<div class="editor margin-top-20 html" contenteditable="true"></div>
</div>
<div class="user-container user-css">
<h3>CSS</h3>
<div>(Write css styles)</div>
<div class="editor margin-top-20 css" contenteditable="true"></div>
</div>
<div class="user-container">
<h3>Preview</h3>
<div>(Write css styles)</div>
<iframe class="user-preview margin-top-20" src="user-file.html"></iframe>
</div>
</div>
<div class="container text-center">
<button onclick="create_file();">Submit</button>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
function create_file() {
var userhtml = $(".user-html .editor").text();
var usercss = $(".user-css .editor").text();
var finalHTMl = "<!DOCTYPE html><html><head><style>"+usercss +"</style></head>" +
"<body>" + userhtml + "</body></html>";
//Ajax start
$.ajax({
url: "test1.py"
, type: 'POST'
, data: {
'htmldata': finalHTMl
, css: usercss
}
, success: function (result) {
$('.user-preview').attr('src', $('iframe').attr('src'));
}
});
//Ajax End
}
</script>
</body>
</html>
And this is my python code :
def index(req):
postData = req.form
json = str(postData['htmldata'].value)
print(json)
Can u guys please tell me where i am wrong