Error when uploading to Firebase


#1

Hello! I am trying to upload a file (.mp3) using the Firebase upload button but when doing so and selecting the file a few seconds later it crashes. In the console, the log gives me an error saying…

code_: "storage/invalid-argument"
message_: "Firebase Storage: Invalid argument in `ref` at index 0: Expected child path but got a URL, use refFromURL instead."
serverResponse_: null
name_: "FirebaseError"
fa	   @	   react-dom.production.min.js:4408

name: "FirebaseError"
code_: "storage/invalid-argument"
message_: ""Firebase Storage: Invalid argument in `ref` at index 0: Expected child path but got a URL, use refFromURL instead."

The line the second one is pointing to is…

<div className="state0_elFirebaseUpload">
        <div style={style_state0_elFirebaseUpload}>
          <FileUploader
            accept="mp3/*"
            storageRef={firebase.storage().ref((this.props.appActions.dataSlots ? this.props.appActions.dataSlots['ds_filePathOfFolder'] : ''))}
            onUploadStart={() => {
              this.props.appActions.setState({loading: true});
            }}
            onUploadError={error => {
              this.props.appActions.setState({loading: false});
              console.error('** Firebase upload failed: ', error);
            }}
            onUploadSuccess={filename => {
              this.props.appActions.setState({loading: false});
              firebase.storage().ref((this.props.appActions.dataSlots ? this.props.appActions.dataSlots['ds_filePathOfFolder'] : '')).child(filename).getDownloadURL().then(url => {
                let setDataSlotValue = (v) => { this.props.appActions.updateDataSlot("ds_filePathOfFolder", v) };
                setDataSlotValue(url);
                let setfilenameDataSlotValue = (v) => { this.props.appActions.updateDataSlot("ds_filesFileName", v) };
                setfilenameDataSlotValue(filename);
              }).catch(function(error) {
                console.error('** Firebase upload failed: ', error);
              });
            }}
            />
        </div>
      </div>

Any ideas?


#2

Hi,

I tested Firebase upload plugin with mp3 and it worked and file was uploaded into Firebase Cloud storage. I simply changed the plugin code to accept mp3 files (see screenshot) and reloaded plugins (Plugins->Reload plugins) and exported the code.


#3

Well I also do not have the random file name part… as I have my own naming system set up. Would that still allow it to work fine? As with that I am still getting a crash. Would it be possible to send you the project files and have you take a quick look at them? Sorry I know you probably have better things to do.


#4

It’s hard to say how the naming setting affects but you should test your code without the setting and with the setting. Have you edited the plugin or simply the exported code?


#5

I just edited the plugin directly but when I tried it with the regular plugin setup it still crashed as well. This is the error that it shows when I click on the upload button and then select the file and click open. After about 3 seconds the screen goes white and shows this error.


#6

Hi,

Send use the zipped React Studio project file (hello@neonto.com). For me the plugin works just fine so I don’t quite understand what could be causing this issue.


#7

Ok I just sent an email!