dropzone.js - 为什么 dropzoneJS 调整大小选项没有影响?
问题描述
我在带有 ActiveStorage 和 Stimulus 的 rails 6 应用程序中有放置区。但是,resizeHeight 和 resizeQuality 似乎对上传的图像没有任何影响。
在下图所示的设置中,我希望最终图像小且质量低。但是,我得到了我最初附加的相同图像。根本没有压缩或大小变化。
另外,我很好奇 DropzoneJS 是否会变大?或者,如果默认情况下它不会升迁?此外,跳过非图像的调整大小选项是否足够聪明?文档没有指定。
我的 Dropzone_controller 看起来像这样:
import { Controller } from "stimulus"
import Dropzone from "dropzone"
import 'dropzone/dist/min/dropzone.min.css'
import 'dropzone/dist/min/basic.min.css'
import { DirectUpload } from "@rails/activestorage"
export default class extends Controller {
static targets = ["input"]
connect() {
Dropzone.autoDiscover = false
this.inputTarget.disable = true
this.inputTarget.style.display = "none"
const dropzone = new Dropzone(this.element, {
url: '/',
maxFiles: 10,
maxFilesize: 6,
addRemoveLinks: true,
resizeHeight: 50,
resizeQuality: 0.1,
autoQueue: false
})
dropzone.on("addedfile", file => {
setTimeout(() => {
if (file.accepted) {
const upload = new DirectUpload(file, this.url)
upload.create((error, blob) => {
this.hiddenInput = document.createElement("input")
this.hiddenInput.type = "hidden"
this.hiddenInput.name = this.inputTarget.name
this.hiddenInput.value = blob.signed_id
this.inputTarget.parentNode.insertBefore(this.hiddenInput, this.inputTarget.nextSibling)
dropzone.emit("success", file)
dropzone.emit("complete", file)
})
}
}, 500)
})
}
get url() {
return this.inputTarget.getAttribute('data-direct-upload-url')
}
}
谢谢!!!!
解决方案
resizeWidth
并且resizeHeight
没有效果,因为设置autoqueue: false
绕过了 Dropzone 源代码的这一部分。
推荐阅读
- drools - 流口水 | 重新加载规则而不重新启动服务器
- c# - C# 如何通过 TCP 为 HTTP 发送文件?
- xml - 如何在 Solr 中索引未按照 Solr 预期方式构建的 XML 文件?
- cassandra - 带有 TimeWindowCompactionStrategy 表的 nodetool compact
- python - Spyder:有没有办法自动打开多个控制台窗口并在每个控制台中运行不同的脚本?
- google-maps - GoogleMap API 为一张地图生成多个图像是否正常?
- react-native - 如何分组 - 反应原生的总和?
- angular - 尝试通过使用管理员保护并在其中调用和api来保护路由以验证数据
- excel - 有没有办法从两列中建立一列
- java - 为什么我得到“weka.attributeSelection.PrincipalComponents:没有属性!” 在 Java 中运行 WEKA PCA 时?