javascript - 使用 JavaScript 从自定义 ASPX/HTML 网页将 .TXT 文件上传到 SharePoint

Question

我在 SharePoint 网站中托管了一个自定义 ASPX/HTML 网页，需要使用 JavaScript 将生成的 txt 上传到 SharePoint 网站中的特定文件夹。

流程：用户单击网页上的按钮 -> JavaScript 生成的文本文件 -> JavaScript 将文本文件上传到 SharePoint 站点文件夹

我不确定 SharePoint 文件上传方法，因为没有自定义后端可供使用。这将是正确的过程吗？

https://docs.microsoft.com/en-us/sharepoint/dev/sp-add-ins/complete-basic-operations-using-javascript-library-code-in-sharepoint#create-a-file-in-文档库

标签： javascripthtmlsharepointfile-upload

Answer 1

这是一个示例代码供您参考，您可以创建一个 SharePoint 网站页面并使用脚本编辑器 Web 部件来嵌入它：

<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.js"></script>
<script type="text/javascript">

function uploadDocument() {
    if (!window.FileReader) {
        alert("This browser does not support the HTML5 File APIs");
        return;
    }

    var element = document.getElementById("uploadInput");
    var file = element.files[0];
    var parts = element.value.split("\\");
    var fileName = parts[parts.length - 1];

    var reader = new FileReader();
    reader.onload = function (e) {
        addItem(e.target.result, fileName);
    }
    reader.onerror = function (e) {
        alert(e.target.error);
    }
    reader.readAsArrayBuffer(file);

    function addItem(buffer, fileName) {
        var call = uploadDocument(buffer, fileName);
        call.done(function (data, textStatus, jqXHR) {
            console.log(data);
            alert("File Upload Successfully");
        });
        call.fail(function (jqXHR, textStatus, errorThrown) {
            failHandler(jqXHR, textStatus, errorThrown);
        });
    }

    function uploadDocument(buffer, fileName) {
        var url = String.format(
            "{0}/_api/Web/Lists/getByTitle('Documents')/RootFolder/Files/Add(url='{1}', overwrite=true)",
            _spPageContextInfo.webAbsoluteUrl, fileName);
        var call = jQuery.ajax({
            url: url,
            type: "POST",
            data: buffer,
            processData: false,
            headers: {
                Accept: "application/json;odata=verbose",
                "X-RequestDigest": jQuery("#__REQUESTDIGEST").val()            
                }
        });

        return call;
    }


    function failHandler(jqXHR, textStatus, errorThrown) {
        var response = JSON.parse(jqXHR.responseText);
        var message = response ? response.error.message.value : textStatus;
        alert("Call failed. Error: " + message);
    }
}
</script>

<input type="file" id="uploadInput"/>
<input type="button" id="Upload" value="Upload" onclick="uploadDocument()"/>