在JavaScript网页应用中嵌入Python代码
我主要是做Java和Python开发的，最近开始学习JavaScript，因为我正在设计一个应用程序。为了设计这个应用，我想把一些必要的Python代码放进JavaScript的框架里。但是，我不太确定该怎么做。我想实现的具体脚本是一个Python的文件写入脚本，它会接收一些从JavaScript生成的变量，然后写入一个包含这些信息的文件，并且按照特定的文本文件格式进行排版。下面是代码。我在这个应用中也用过PHP。请问有没有可能用Django来整合这段Python代码（我之前从没用过Django）或者其他什么方法？谢谢。
Python:
newfile = open(newfile.txt, "w")
newfile.write("New File")
newfile.close()
2 个回答
注意：如果你想要一个完全在客户端解决方案，可以看看Aaron的回答。
你可以调用一个服务器端的脚本来生成文件。
这可以通过ajax来实现，也就是让客户端和服务器之间进行异步调用。
你可以通过Django来做到这一点。
这里有一份Django Ajax 资源的列表。
或者你也可以单独进行，有很多关于Ajax的在线资源。
关于JavaScript的文件API
有些人建议使用JavaScript的文件写入API，但如果我理解得没错，你是在写浏览器代码（而不是Node.js），我建议你不要这样做。因为这些API目前还没有被广泛支持。这里有一个支持该API的浏览器列表：http://caniuse.com/#feat=filesystem
好的，对于网页应用来说，Python的支持主要取决于浏览器是否有Python的支持，这要么是通过插件提供的，要么是浏览器自带的。不过，依赖大多数用户的浏览器都支持Python并不是个好主意。如果你决定这么做，只需在HTML中加入一段代码，像这样：<SCRIPT type="text/x-python" src="path-to-your-pyfile.py">。
另外，JavaScript现在在HTML5的支持下，可以写入文本和二进制数据到文件中。你可以查看文件API，了解更多信息，链接在这里：这里。
如果使用文件API有问题，你可以通过JavaScript创建一个链接，让用户保存文件，使用数据URI，像这样：
data:text/plain;base64,aGVsbG8gZnJvbSBhIGRhdGEgdXJpISEh
这里有一个HTML文件的例子，它可以通过JavaScript动态生成文件。注意，我自己写了一个base64编码器，但其实有很多现成的JavaScript库可以用。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<SCRIPT type="text/javascript" >
var BASE_64_ALPHABET =//for encoding base64
[
'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z',
'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z',
'0','1','2','3','4','5','6','7','8','9','+','/'
];
var BASE_64_PAD = '=';
function valueAt(source,index)
{
var result = null;
if(source.charAt)
result = source.charAt(index);
else
result = source[index];
if(result.charCodeAt)
result = result.charCodeAt(0);
if(result === null | result === undefined)
return 0;
return result;
}
function toBase64(data, offset, length)
{
var padSize = (3-(length % 3));
if(padSize == 3 && length != 0)
padSize = 0;
var bufferSize = ((4*(length-(length%3)))/3); + padSize;
var buffer = new Array(bufferSize);
var iterationLimit = length + (length % 3) - 1;
var octetMask = 0xFF;
var sextetMask = 0x3F;
for(var sourceIndex=0,destinationIndex=0;sourceIndex<iterationLimit;sourceIndex+=3,destinationIndex+=4)
{
var readBlock =
(
((valueAt(data, offset+sourceIndex) & octetMask) << 16) |
((valueAt(data, offset+sourceIndex+1) & octetMask) << 8) |
(valueAt(data, offset+sourceIndex+2) & octetMask)
);
buffer[destinationIndex] = BASE_64_ALPHABET[(readBlock >>> 18) & sextetMask];
buffer[destinationIndex+1] = BASE_64_ALPHABET[(readBlock >>> 12) & sextetMask];
buffer[destinationIndex+2] = BASE_64_ALPHABET[(readBlock >>> 6) & sextetMask];
buffer[destinationIndex+3] = BASE_64_ALPHABET[readBlock & sextetMask];
}
for(var i = 0; i < padSize; i++)
buffer[buffer.length - 1 - i] = BASE_64_PAD;
return buffer.join("");
}
function makeDataURI()
{
var data = document.getElementById("datasource").value;
var mime = document.getElementById("mimesource").value;
alert("data:"+mime+";base64,"+toBase64(data,0,data.length));
}
</SCRIPT>
</head>
<body>
<INPUT id="datasource" type="text" value="enter your file data here"></INPUT>
<INPUT id="mimesource" type="text" value="enter your mime type here"></INPUT>
<INPUT type="button" onclick="makeDataURI();" value="Generate URI"></INPUT>
</body>
</html>