我是Froala编辑器的新手,并且停留在图像部分。我想将所选图像上传到Firebase,而不是将默认图像URL替换为从Firebase获得的URL。到目前为止,我已成功将图像上传到Firebase并获得了URL。但现在只能使用如何将默认图片网址更改为新网址的方法。
这是我的代码
$('div#editor_flora').froalaEditor(
{
htmlAllowedAttrs: [
'title', 'href', 'alt', 'src', 'style', 'onclick', 'data-toggle',
'data-target', 'id', 'class'
],
// Set the image upload parameter.
imageMaxSize: 5 * 1024 * 1024,
// Allow to upload PNG and JPG.
imageAllowedTypes: ['jpeg', 'jpg', 'png']
})
.on('froalaEditor.image.beforeUpload', function (e, editor, images) {
// Return false if you want to stop the image upload.
console.log(images)
firebase.auth()
const ref = firebase.storage().ref();
const file =images[0]
console.log("file name")
console.log(file.name)
if (file !== undefined) {
const name = (+new Date()) + '-' + file.name;
const metadata = {
contentType: file.type
};
const task = ref.child("images/" + name).put(file, metadata);
task
.then(snapshot => snapshot.ref.getDownloadURL())
.then((url) => {
console.log(url)
// imageManagerLoadURL:url
// image.insert(url)
editor.popups.hideAll();
})
}
})
.on('froalaEditor.image.uploaded', function (e, editor, response) {
// Image was uploaded to the server.
alert('sdfasdfsdf')
console.log(editor)
console.log(response)
console.log('Image was uploaded to the server')
})
.on('froalaEditor.image.inserted', function (e, editor, $img, response) {
// Image was inserted in the editor.
console.log(e)
console.log(editor)
console.log($img)
console.log('Image was inserted in the editor')
})
.on('froalaEditor.image.replaced', function (e, editor, $img, response) {
// Image was replaced in the editor.
console.log('Image was replaced in the editor')
})
.on('froalaEditor.image.error', function (e, editor, error, response) {
// Bad link.
if (error.code == 1) {
console.log('Bad link')
}
// No link in upload response.
else if (error.code == 2) {
console.log('No link in upload response')
}
// Error during image upload.
else if (error.code == 3) {
console.log('Error during image upload')
}
// Parsing response failed.
else if (error.code == 4) {
console.log('Parsing response failed')
}
// Image too text-large.
else if (error.code == 5) {
console.log('age too text-la')
}
// Invalid image type.
else if (error.code == 6) {
console.log('Invalid image type')
}
// Image can be uploaded only to same domain in IE 8 and IE 9.
else if (error.code == 7) {
console.log('Image can be uploaded only to same domain in IE 8 and IE 9')
}
// Response contains the original server response to the request if available.
})
请帮助我摆脱这个问题。我花了很多时间来搜索和解决此问题。