contenteditable 到 javascript 中 Azure 存储中的文本文件答案

【问题标题】：contenteditable to textfile in azure storage in javascriptcontenteditable 到 javascript 中 Azure 存储中的文本文件
【发布时间】：2020-07-08 11:36:16
【问题描述】：

我正在尝试将可编辑 div 的内容转换为文本文件并将其存储在 azure 中。它实际上是一个 css 文件（格式），但我猜该文本将具有相同的输出。这是我到目前为止得到的：\

var sasKey = "xxxxxxxxxxxxxxx";
var blobUri = xxxxx.blob.core.windows.net";
var blobService = AzureStorage.Blob.createBlobServiceWithSas(blobUri, sasKey);

function Save() {

    var blobData = document.getElementById("CONTENT").innerText;
    var myBlob = new Blob(blobData, "plain/text");

    blobService.createBlockBlobFromBrowserFile('style',
        "test.txt",
        myBlob,
        (error, result) => {
            if (error) {
                // Handle blob error
            } else {    
                console.log('Upload is successful');
            }
        });
}

HTML：

<div id="CONTENT" contenteditable="true" spellcheck="false">so here we have text</div>

<input type="button" value="save" onclick="Save()"/>

我收到以下错误：

Uncaught TypeError: Failed to construct 'Blob': The provided value cannot be converted to a sequence.

【问题讨论】：

标签： javascript azure blob

【解决方案1】：

Blobobject 将列表作为其第一个参数。

试试这个：

var myBlob = new Blob([blobData], { type: "plain/text" });

https://developer.mozilla.org/en-US/docs/Web/API/Blob/Blob

【讨论】：

谢谢，这实际上转换了文件中的 blob。然而事实证明，我不需要转换。 Azure 使用只接受任何字符串的 createBlockBlobFromText 自动执行此操作。

【解决方案2】：

完整地说，这是我用来上传文本 (txt) 文件的文件

<script>azure-storage.blob.min.js</script>

var sasKey = "xxxxxxxxxxxxxxx";
var blobUri = xxxxx.blob.core.windows.net";
var blobService = AzureStorage.Blob.createBlobServiceWithSas(blobUri, sasKey);

function Save() {

    var blobData = document.getElementById("CONTENT").innerText;

    blobService.createContainerIfNotExists('container', (error, container) => {
        if (error) {
            // Handle create container error
        } else {
            console.log(container.name);
        }
    });

    blobService.createBlockBlobFromText('container', "test.txt", blobData,
        (error, result) => {
            if (error) {
                // Handle blob error
            } else {    
                console.log('Upload is successful');
            }
        });
}

HTML

<div id="CONTENT" contenteditable="true" spellcheck="false">so here we have text</div>

<input type="button" value="save" onclick="Save()"/>

【讨论】：