Проблема при попытке реализовать прямую загрузку методом перетаскивания с помощью shrine direct_upload для aws rails 5.2
Код:
image_upload.js
function uploadAttachment(attachment) {
var file = attachment.file;
var form = new FormData;
form.append("Content-Type", file.type);
form.append("forum_post_photo[image]", file);
var xhr = new XMLHttpRequest;
xhr.open("POST", "/forum_post_photos.json", true);
xhr.setRequestHeader("X-CSRF-Token", Rails.csrfToken());
xhr.upload.onprogress = function(event){
var progress = event.loaded / event.total * 100;
attachment.setUploadProgress(progress);
}
xhr.onload = function(){
if (xhr.status == 201){
var data = JSON.parse(xhr.responseText);
return attachment.setAttributes({
url: data.image_url,
href: data.image_url
})
}
}
return xhr.send(form);
}
document.addEventListener("trix-attachment-add", function(event){
var attachment = event.attachment;
if (attachment.file){
console.log('new',attachment);
return uploadAttachment(attachment);
}
});
shrine.rb
require "shrine/storage/s3"
s3_options = {
bucket: Rails.application.credentials.aws[:bucket_name], # required
access_key_id: Rails.application.credentials.aws[:access_key_id],
secret_access_key: Rails.application.credentials.aws[:secret_access_key],
region: Rails.application.credentials.aws[:bucket_region],
}
Shrine.storages = {
cache: Shrine::Storage::S3.new(prefix: "cache",upload_options: { acl: "public-read" } , **s3_options),
store: Shrine::Storage::S3.new(prefix: "store",upload_options: { acl: "public-read" } ,**s3_options),
}
Shrine.plugin :activerecord
Shrine.plugin :presign_endpoint, presign_options: -> (request) {
filename = request.params["filename"]
type = request.params["type"]
{
content_disposition: "inline; filename=\"#{filename}\"", # set download filename
content_type: type, # set content type (required if using DigitalOcean Spaces)
content_length_range: 0..(10*1024*1024), # limit upload size to 10 MB
}
}
Shrine.plugin :restore_cached_data
Трикс-загрузка
require "shrine/storage/s3"
s3_options = {
bucket: Rails.application.credentials.aws[:bucket_name], # required
access_key_id: Rails.application.credentials.aws[:access_key_id],
secret_access_key: Rails.application.credentials.aws[:secret_access_key],
region: Rails.application.credentials.aws[:bucket_region],
}
Shrine.storages = {
cache: Shrine::Storage::S3.new(prefix: "cache",upload_options: { acl: "public-read" } , **s3_options),
store: Shrine::Storage::S3.new(prefix: "store",upload_options: { acl: "public-read" } ,**s3_options),
}
Shrine.plugin :activerecord
Shrine.plugin :presign_endpoint, presign_options: -> (request) {
filename = request.params["filename"]
type = request.params["type"]
{
content_disposition: "inline; filename=\"#{filename}\"", # set download filename
content_type: type, # set content type (required if using DigitalOcean Spaces)
content_length_range: 0..(10*1024*1024), # limit upload size to 10 MB
}
}
Shrine.plugin :restore_cached_data
trix-upload
function uploadAttachment(attachment) {
var file = attachment.file;
var form = new FormData;
form.append("Content-Type", file.type);
form.append("forum_post_photo[image]", file);
var xhr = new XMLHttpRequest;
xhr.open("POST", "/forum_post_photos.json", true);
xhr.setRequestHeader("X-CSRF-Token", Rails.csrfToken());
xhr.upload.onprogress = function(event){
var progress = event.loaded / event.total * 100;
attachment.setUploadProgress(progress);
}
xhr.onload = function(){
if (xhr.status == 201){
var data = JSON.parse(xhr.responseText);
return attachment.setAttributes({
url: data.image_url,
href: data.image_url
})
}
}
return xhr.send(form);
}
document.addEventListener("trix-attachment-add", function(event){
var attachment = event.attachment;
if (attachment.file){
console.log('new',attachment);
return uploadAttachment(attachment);
}
});
Короче говоря, я использую trix для форматированного текста на форуме, все модели и контроллеры работают, я пытаюсь выполнить direct_upload с помощью перетаскивания в редактор, как показано здесь, но не могу правильно понять js.
все остальные конфиги устанавливаются прямо из документации
Фотографии загружаются в мои aws, но все истекает через несколько минут
даже с моим ведром, установленным для публичного чтения
любая помощь была бы велика, я потерян!
Это текущий сайт в прямом эфире и вот мой полный мерзавец
0 ответов
Пережил эту проблему и сегодня.
Также используется Shrine с AWS S3 и Trix в старом приложении rails.
Что я заметил, так это то, что изображения присутствуют на сервере S3, это просто URL-адреса, которые использует Трикс, которые не работают.
После поиска некоторых других подобных вопросов, столкнулся с этим: /questions/4184197/heroku-shrine-i-amazon-s3-zapis-bloga-izobrazheniya-ischezayut-cherez-nekotoroe-vremya/4184207#4184207
Ответ от одного из хранителей драгоценного камня. Все, что вам нужно сделать, это применить общедоступные настройки в инициализаторе храма в config/initializers/shrine.rb
,
Моя проблема исправлена, изображения, используемые редактором Trix, не устарели.