使用 JavaScript 從自定義 ASPX/HTML 網頁上傳.TXT 文件到 SharePoint

Question

我在 SharePoint 站點中托管了一個自定義 ASPX/HTML 網頁，需要使用 Z686155AF75A60A0F6E9D80C1F7EDD3E 將生成的 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-文檔庫

Answer 1

這是一個示例代碼供您參考，您可以創建一個 SharePoint 站點頁面並使用 Script Editor Web Part 嵌入它：

<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()"/>