我正在使用包react-dropzone(https://github.com/okonet/react-dropzone)从用户获取图像。用户上传了他们的图像,一切都很好,但是我只能从中得到“ blob:http // blahblah”之类的东西,我需要将图像设置为base64 png。
我的dropzone组件:
<Dropzone ref="dropzone" multiple={false} onDrop={this.onDrop.bind(this)} >
{this.state.files ?<img className="img-responsive" src={this.state.files[0].preview}></img>
: <div>Upload Photo</div> }
</Dropzone>
Run Code Online (Sandbox Code Playgroud)
以及获取blob网址的drop函数:
onDrop (files ) {
if ( files.length === 0 ) {
alert("upload img please")
return;
}
console.log('Received files: ', files);
this.setState({files:files})
var blobURL = files[0].preview
var reader = new FileReader();
reader.readAsDataURL(blobURL)
}
Run Code Online (Sandbox Code Playgroud)
我会得到一个错误:Uncaught TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'.
我认为这是因为即时通讯试图传递指向blob的object-url,但是我在哪里可以获取blob以便转换为base64?
我正在尝试使用下拉菜单项作为复选框输入进行简单的下拉菜单。目前我有这个:
import React, { Component } from 'react'
export default class Sort extends Component {
constructor() {
super()
this.state= { expanded : false}
}
showCheckboxes() {
var checkboxes = document.getElementById("checkboxes");
if (!expanded) {
checkboxes.style.display = "block";
this.state.expanded = true;
} else {
checkboxes.style.display = "none";
this.state.expanded = false;
}
}
render() {
return (
<form>
<div class="multiselect">
<div class="selectBox" onclick="showCheckboxes()">
<select>
<option>Select an option</option>
</select>
<div class="overSelect"></div>
</div>
<div id="checkboxes">
<label for="one"><input type="checkbox" id="one"/>First checkbox</label>
<label for="two"><input type="checkbox" id="two"/>Second checkbox …Run Code Online (Sandbox Code Playgroud) 是否有一个键或什么东西可以用来设置视频即时转码中缩略图的高度和宽度?
transcodeVideo = (fileName, cb) ->
elastictranscoder = new (AWS.ElasticTranscoder)(apiVersion: '2012-09-25')
elastictranscoder.createJob {
PipelineId: process.env.PIPELINE_ID
OutputKeyPrefix: fileName + '/'
Input:
Key: fileName
FrameRate: 'auto'
Resolution: 'auto'
AspectRatio: 'auto'
Interlaced: 'auto'
Container: 'auto'
Output:
Key: 'video.mp4'
Resolution: 'auto'
ThumbnailPattern: 'thumbs-{count}'
PresetId: process.env.PRESET_ID
Rotate: 'auto'
}, cb
Run Code Online (Sandbox Code Playgroud)