Is there a way to get the qqfilename and qquuid that was given to the server?

Question

Right now I'm using react-fine-uploader to send chunked files to the server. I was wondering if I could get the filename and uuid I uploaded as I needed them on another part of the component. I believe they are at the uploader object I created but I'm not sure how to get them.

I tried checking the uploader object but it seems to not be shown there.

const uploader = new FineUploaderTraditional({
    options: {
        chunking: {
            enabled: true
        },
        deleteFile: {
            enabled: true,
            endpoint: `http://app.client.local/upload_delete`
        },
        request: {
            endpoint: `http://app.client.local/upload_chunk`
        },
        retry: {
            enableAuto: false
        }
    }
})

const isFileGone = status => {
    return [
        'canceled',
        'deleted',
    ].indexOf(status) >= 0
}

class SVFineUploaderComponent extends Component {
    constructor() {
        super()

        this.state = {
            submittedFiles: []
        }
    }

    componentDidMount() {
        uploader.on('statusChange', (id, oldStatus, newStatus) => {
            if (newStatus === 'submitted') {
                const submittedFiles = this.state.submittedFiles

                submittedFiles.push(id)
                this.setState({ submittedFiles })
            }
            else if (isFileGone(newStatus)) {
                const submittedFiles = this.state.submittedFiles
                const indexToRemove = submittedFiles.indexOf(id)

                submittedFiles.splice(indexToRemove, 1)
                this.setState({ submittedFiles })
            }
        })
    }

    renderFileInput = () => {
        return (
            <Container style={{border: "3px dotted"}}>
                <FileInput uploader={ uploader }>
                    <Dropzone uploader={ uploader }>
                        <span class="icon ion-upload">Attach or Drop Files Here</span>
                    </Dropzone>
                </FileInput>
            </Container>
        );
    }

    renderFile = () => {
        console.log(uploader)
        return (
            <Container style={{border: "3px dotted"}}>
                {
                    this.state.submittedFiles.map(id => (
                        <React.Fragment>
                            <Filename key={ id } id={ id } uploader={ uploader } />
                            <DeleteButton key={ id } id={ id } uploader={ uploader } />
                        </React.Fragment>
                    ))
                }
            </Container>
        );
    }

    render() {
        if (this.state.submittedFiles.length === 0)
            return this.renderFileInput();

        return this.renderFile();
    }
}

export default SVFineUploaderComponent;

Answer 1

Apparently, you can use the methods given here by putting suffixing .methods to uploader before the method itself.

Examples

{console.log(uploader.methods.getName(id))}
{console.log(uploader.methods.getFile(id))}
{console.log(uploader.methods.getUuid(id))}