Как создать каталог и добавить файлы в ipfs с помощью js-ipfs только с чистым javascript

Единственные ответы, которые я могу найти в своем исследовании, касаются загрузки нескольких файлов из каталога на ПК. Это не то, что я пытаюсь сделать. Я пытаюсь создать каталог в ipfs, а затем добавить новые файлы в этот каталог, используя js-ipfs только с чистым javascript, обычно по одному файлу за раз.

Я концептуально понимаю, что каталог в ipfs - это просто еще один файл. Но я не понимаю, как создать этот каталог (файл) и добавить в него другие файлы для последующего извлечения, особенно с помощью js-ipfs и чистого кода javascript.

Я неявно не использую node.js, поэтому ни реагирую, ни angular, ни vue.

Это работает для одного файла без каталога на ipfs:

<!DOCTYPE html>
<html>
<head>
  <script src="https://cdn.jsdelivr.net/npm/ipfs/dist/index.min.js"></script>
</head>
<script>
    document.addEventListener('DOMContentLoaded', async () => {
        const nodeId = 'ipfs-' + Math.random()
        const node = await Ipfs.create({ repo: nodeId })
        console.log("Your node: " + nodeId)
        window.node = node
        const status = node.isOnline() ? 'online' : 'offline'
        console.log(`Node status: ${status}`)
        async function addFile () {
            for await (const { cid } of node.add('Some file content!')) {
                console.log('successfully stored', cid)
                cidhash=cid.toBaseEncodedString()
                console.log(cidhash)
            }
        }
        addFile()
    })
</script>
<body>
</body>
</html>

Как заставить эту работу создать каталог и сначала добавить в него файл, а затем добавить еще один файл в созданный каталог (псевдокод)?

  async function addFile () {
    for await (const { directory, filename } of node.add('/someDirectory/someFilename','Some file content!')) {
      console.log('successfully stored', directory, filename)             
      console.log(directory, filename)
    }
  }

person Dshiz    schedule 30.06.2020    source источник
comment
Я думал, что нельзя добавлять или читать файлы с помощью javascript   -  person Thanveer Shah    schedule 30.06.2020
comment
@ThanveerShah ipfs - это распределенная файловая система. Вы правы, что вы не можете создать нормальный локальный файл в браузере JS.   -  person Jared Smith    schedule 30.06.2020
comment
@JaredSmith, я обязательно разберусь с этим, спасибо. Также это может быть не по теме, но можно ли с помощью этого прочитать zip-файл из каталога проекта?   -  person Thanveer Shah    schedule 30.06.2020
comment
@ThanveerShah нет.   -  person Jared Smith    schedule 30.06.2020
comment
@ThanveerShah Доступен CDN с исходным кодом сценария для переноса Buffer в браузер, но он очень нестабильный (wzrd.in/ автономный / буфер). В любом случае, я не пытаюсь этого сделать. Я хочу создать файл с текстовым содержимым, но хочу поместить этот файл в каталог, созданный в IPFS. Я не пытаюсь загрузить локальный каталог файлов.   -  person Dshiz    schedule 30.06.2020
comment
@Dshiz Спасибо, я посмотрю, я использую JSZip в React, и он отлично работает, когда я просматриваю zip-файл, он распаковывает и отображает все изображения внутри него. Но когда я помещаю тот же zip-файл в каталог своего проекта и попробуйте получить к нему доступ, используя путь, это не работает.   -  person Thanveer Shah    schedule 30.06.2020
comment
@ThanveerShah Я бы сказал, что сам скрипт работает, но хост часто не работает. Получите его, когда хост ответит, и укажите ссылку в вашей папке src напрямую. Для меня это не работает, потому что я создаю одно файловое приложение, которое работает без сервера и без веб-упаковщика.   -  person Dshiz    schedule 30.06.2020
comment
@Dshiz, я наконец смог прочитать zip-файл из пути к каталогу с помощью JsZip-utils: D, также рад, что вы нашли ответ, который искали, просто примите свой ответ, чтобы он тоже помог людям   -  person Thanveer Shah    schedule 01.07.2020


Ответы (1)


Чтение через js-ipfs документации, я наконец нашел ответ.

Чтобы только создать каталог:

await ipfs.files.mkdir('/my/beautiful/directory')

Полный рабочий пример для создания пути к каталогу и одновременного добавления к нему файла:

<!DOCTYPE html>
<html>
<head>
  <script src="https://cdn.jsdelivr.net/npm/ipfs/dist/index.min.js"></script>
</head>
<script>
    document.addEventListener('DOMContentLoaded', async () => {
        const nodeId = 'ipfs-' + Math.random()
        const node = await Ipfs.create({ repo: nodeId })
        console.log("Your node: " + nodeId)
        window.node = node
        const status = node.isOnline() ? 'online' : 'offline'
        console.log(`Node status: ${status}`)

        //create a variable with the directory path '/my/beautiful/directory' 
        // and a file 'awesomesause.txt' with the content 'ABC' 
        var files = [{
            path: '/my/beautiful/directory/firstfile.txt',
            content: 'ABC'
        }]

        addFile(files) //add the first file       

        //update the 'files' variable to add another file to the directory path '/mybeautiful/directory' in ipfs
        files = [{
            path: '/my/beautiful/directory/secondfile.txt',
            content: 'DEF'
        }]
        
        addFile(files) //add the sectond file

        //function to add the files
        async function addFile (files) {
            for await (const result of node.add(files)) {
                console.log(result)
            }
        }
    })
</script>
<body>
</body>
</html>

Результаты:

generating 2048-bit RSA keypair...
js-ipfs_dirs_and_files.html:10 Your node: ipfs-[my random node ID]
js-ipfs_dirs_and_files.html:13 Node status: online
js-ipfs_dirs_and_files.html:35 
Object
cid: i {version: 0, codec: "dag-pb", multihash: Uint8Array(34), multibaseName: "base58btc", _buffer: Uint8Array(34), …}
mode: 420
mtime: undefined
path: "my/beautiful/directory/firstfile.txt"
size: 11
__proto__: Object
js-ipfs_dirs_and_files.html:35 
Object
cid: i {version: 0, codec: "dag-pb", multihash: Uint8Array(34), multibaseName: "base58btc", _buffer: Uint8Array(34), …}
mode: 420
mtime: undefined
path: "my/beautiful/directory/secondfile.txt"
size: 11
__proto__: Object
js-ipfs_dirs_and_files.html:35 
Object
cid: i {version: 0, codec: "dag-pb", multihash: Uint8Array(34), multibaseName: "base58btc", _buffer: Uint8Array(34), …}
mode: 493
mtime: undefined
path: "my/beautiful/directory"
size: 70
__proto__: Object
js-ipfs_dirs_and_files.html:35 
Object
cid: i {version: 0, codec: "dag-pb", multihash: Uint8Array(34), multibaseName: "base58btc", _buffer: Uint8Array(34), …}
mode: 493
mtime: undefined
path: "my/beautiful/directory"
size: 71
__proto__: Object
js-ipfs_dirs_and_files.html:35 
Object
cid: i {version: 0, codec: "dag-pb", multihash: Uint8Array(34), multibaseName: "base58btc", _buffer: Uint8Array(34), …}
mode: 493
mtime: undefined
path: "my/beautiful"
size: 125
__proto__: Object
js-ipfs_dirs_and_files.html:35 
Object
cid: i {version: 0, codec: "dag-pb", multihash: Uint8Array(34), multibaseName: "base58btc", _buffer: Uint8Array(34), …}
mode: 493
mtime: undefined
path: "my/beautiful"
size: 126
__proto__: Object
js-ipfs_dirs_and_files.html:35 
Object
cid: i {version: 0, codec: "dag-pb", multihash: Uint8Array(34), multibaseName: "base58btc", _buffer: Uint8Array(34), …}
mode: 493
mtime: undefined
path: "my"
size: 180
__proto__: Object
js-ipfs_dirs_and_files.html:35 
Object
cid: i {version: 0, codec: "dag-pb", multihash: Uint8Array(34), multibaseName: "base58btc", _buffer: Uint8Array(34), …}
mode: 493
mtime: undefined
path: "my"
size: 181
__proto__: Object
person Dshiz    schedule 30.06.2020