我正在尝试使用 dropzone js 和 Flask 作为后端。拖放区配置:
<form method="POST" action='/process_chunk' class="dropzone dz-clickable"
id="dropper" enctype="multipart/form-data">
</form>
<script type="application/javascript">
Dropzone.options.dropper = {
{# https://gitlab.com/meno/dropzone/wikis/faq#chunked-uploads #}
paramName: 'file',
acceptedFiles: '.csv',
chunking: true,
forceChunking: true,
chunkSize: 100000, // bytes
parallelChunkUploads: true,
maxFilesize: 1025, // megabytes
</script>
Run Code Online (Sandbox Code Playgroud)
我的烧瓶后端如下所示
@app.route('/process_chunk', methods=['POST'])
def process_chunk():
current_chunk = int(request.form['dzchunkindex'])
file = request.files['file']
save_path = os.path.join(app.config['DATA_DIR'], file.filename)
try:
with open(save_path, 'ab+') as f:
# Goto the offset, aka after the chunks we already wrote
f.seek(int(request.form['dzchunkbyteoffset']))
f.write(file.stream.read())
except OSError:
# log.exception will …Run Code Online (Sandbox Code Playgroud) 我想对开关选项卡进行编程(使用 bootstrap 5)。Bootsrap 文档说:
作为最佳实践,我们建议使用选项卡元素,因为这些是触发动态更改的控件,而不是导航到新页面或位置的链接。
所以我想使用按钮而不是链接。代码:
$("#mybut").click(function() {
var sel = document.querySelector('#nav-tab-manager')
bootstrap.Tab.getInstance(sel).show()
})Run Code Online (Sandbox Code Playgroud)
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<nav>
<div class="nav nav-tabs" id="nav-tab" role="tablist">
<button class="nav-link active" id="nav-tabs-order" data-bs-toggle="tab" data-bs-target="#tabs-1" type="button" role="tab" aria-controls="tabs-1" aria-selected="true">Orders
</button>
<button class="nav-link" id="nav-tab-manager" data-bs-toggle="tab" data-bs-target="#tabs-2" type="button" role="tab" aria-controls="tabs-2" aria-selected="false">Managers
</button>
</div>
</nav>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="tabs-1" role="tabpanel" aria-labelledby="tabs-tab1">
Orders
</div>
<div class="tab-pane fade" id="tabs-2" role="tabpanel" aria-labelledby="tabs-2">
Managers
</div>
</div>
<button type="button" class="btn btn-primary" id="mybut">Want switch to manager</button> …Run Code Online (Sandbox Code Playgroud)bootstrap-5 ×1
button ×1
chunked ×1
dropzone.js ×1
flask ×1
javascript ×1
python ×1
tabs ×1
upload ×1