在Froala编辑器中上传图片时,如何替换默认图片URL火灾基准URL?

时间:2018-09-18 07:57:47

标签: javascript jquery firebase froala

我是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.
})

请帮助我摆脱这个问题。我花了很多时间来搜索和解决此问题。

0 个答案:

没有答案