将 Python 代码合并到 JavaScript Web 应用程序中

Incorporating Python code in a JavaScript web application

本文关键字：Web 应用程序 JavaScript Python 代码 合并      更新时间：2023-09-26

我主要是一名Java和Python开发人员，我最近拿起JavaScript来设计我目前正在开发的应用程序。为了设计应用程序，我想将一些必要的Python代码合并到JavaScript框架中。但是，我不太确定如何做到这一点。我想实现的特定脚本是 Python 中的文件编写脚本，它采用从 JavaScript 生成的一些变量并编写一个包含信息并以某种方式格式化以适应特定文本文件格式的文件。下面的代码。我还在应用程序中使用了PHP。是否可以使用 Django 来合并 Python 代码（我以前从未使用过 Django）或其他方式？谢谢。

蟒： 

 newfile = open(newfile.txt, "w")
 newfile.write("New File")
 newfile.close()

好的，对于Web应用程序，对Python的支持将基于浏览器是否具有作为插件提供或内置于浏览器中的Python支持。 对于大多数查看应用程序的人来说，依靠这种情况可能不是一个好主意。如果您这样做，只需将脚本包含在 html 的 <SCRIPT type="text/x-python" src="path-to-your-pyfile.py"> 标记中即可。作为替代方案，由于html5，javascript现在支持写入包含文本和二进制数据的文件。在此处查看文件 api。

如果使用文件 API 时出现问题，您可以随时创建指向文件的链接，以便用户使用数据 URI 从 JavaScript 保存，如下所示：

data：text/plain;base64，aGVsbG8gZnJvbSBhIGRhdGEgdXJpISEh

这是一个从 JavaScript 动态生成文件的 HTML 文件示例 注意我推出了自己的 base64 编码器，但有许多 JS 库可用于此。

<!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>

注意：有关完全客户端解决方案，请参阅 Aaron 的答案。

您可以调用服务器端脚本以生成文件。

这是使用 ajax 完成的（从客户端到服务器的异步调用）

你可以用 Django 做到这一点

这是Django Ajax资源的列表

或者你可以单独做，网上有很多关于Ajax的资源

关于Javascript文件API

其他一些人建议使用Javascript的文件编写API，但假设我正确理解您并且您正在编写浏览器代码（而不是Node.js），我建议您不要使用它。 这些 API 尚未得到广泛支持。 以下是该 API 支持的浏览器列表：http://caniuse.com/#feat=filesystem

相关文章：