Моя цель - использовать Active Storage для загрузки файлов с:
1 - начинает загрузку в облако после того, как оно прикреплено на стороне клиента (перед нажатием кнопки «обновить»)
2 - Интеграция представления выгрузки с js-библиотекой другого стороннего производителя (как uppy )
Из документация по рельсам прямой загрузки
Если вы хотите использовать функцию прямой загрузки из среды JavaScript или интегрировать настраиваемые решения для перетаскивания, вы можете использовать для этого класс DirectUpload.Получив файл из выбранной вами библиотеки, создайте экземпляр DirectUpload и вызовите его метод create.Create принимает обратный вызов для вызова после завершения загрузки.
import { DirectUpload } from "@rails/activestorage"
const input = document.querySelector('input[type=file]')
// Bind to file drop - use the ondrop on a parent element or use a
// library like Dropzone
const onDrop = (event) => {
event.preventDefault()
const files = event.dataTransfer.files;
Array.from(files).forEach(file => uploadFile(file))
}
// Bind to normal file selection
input.addEventListener('change', (event) => {
Array.from(input.files).forEach(file => uploadFile(file))
// you might clear the selected files from the input
input.value = null
})
const uploadFile = (file) => {
// your form needs the file_field direct_upload: true, which
// provides data-direct-upload-url
const url = input.dataset.directUploadUrl
const upload = new DirectUpload(file, url)
upload.create((error, blob) => {
if (error) {
// Handle the error
} else {
// Add an appropriately-named hidden input to the form with a
// value of blob.signed_id so that the blob ids will be
// transmitted in the normal upload flow
const hiddenField = document.createElement('input')
hiddenField.setAttribute("type", "hidden");
hiddenField.setAttribute("value", blob.signed_id);
hiddenField.name = input.name
document.querySelector('form').appendChild(hiddenField)
}
})
}
Я получаю это сообщение об ошибке:
с "!"на этой линии:
var upload = new !(function webpackMissingModule() { var e = new Error("Cannot find module '@rails/activestorage'"); e.code = 'MODULE_NOT_FOUND'; throw e; }())(file, url);