{"id":19529338,"url":"https://github.com/davepartner/ionic3-firebase-image-upload","last_synced_at":"2026-05-12T21:32:52.451Z","repository":{"id":110556900,"uuid":"77359593","full_name":"davepartner/ionic3-firebase-image-upload","owner":"davepartner","description":"A sample method to upload image with ionic2 and firebase","archived":false,"fork":false,"pushed_at":"2016-12-26T05:19:57.000Z","size":1,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-01-08T16:22:31.306Z","etag":null,"topics":["angular","firebase","firebase-image-upload","image-upload","ionic3"],"latest_commit_sha":null,"homepage":null,"language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/davepartner.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-12-26T05:18:50.000Z","updated_at":"2017-08-20T12:36:12.000Z","dependencies_parsed_at":null,"dependency_job_id":"94f23a82-e15f-41f3-9318-40fce9735cb1","html_url":"https://github.com/davepartner/ionic3-firebase-image-upload","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davepartner%2Fionic3-firebase-image-upload","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davepartner%2Fionic3-firebase-image-upload/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davepartner%2Fionic3-firebase-image-upload/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davepartner%2Fionic3-firebase-image-upload/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/davepartner","download_url":"https://codeload.github.com/davepartner/ionic3-firebase-image-upload/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240783111,"owners_count":19856776,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","firebase","firebase-image-upload","image-upload","ionic3"],"created_at":"2024-11-11T01:24:06.538Z","updated_at":"2026-05-12T21:32:52.406Z","avatar_url":"https://github.com/davepartner.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"# ionic2-firebase-image-upload\nA sample method to upload image with ionic2 and firebase\n\n\n````\n\naddPicture(path : any, photoData : any) {\n\nconsole.log(\"Photo Data : \"+photoData);\n\tvar postDataDetails = {\n\t\tquestion_description : this.question_description,\n\t\tquestion_title : this.question_title,\n\t\tright_answer : this.right_answer\n\t}\n  /*\n\t  let toast = this.toastCtrl.create({\n      message: 'Image upload started in the background',\n      duration: 3000,\n      position: 'top'\n    });\n    toast.present();\n */\n\n/*\n      let loader = this.loadingCtrl.create({\n           content: \"Uploading Image, Please Wait...\",\n         });\n         loader.present();\n\n  if (photoData != null) {\n\n\n  \tvar that = this;\n     var newDetailsKey = firebase.database().ref().child(path).push(postDataDetails);\n\n        that.profilePictureRef.child(that.categoryId+'/questions/'+newDetailsKey.key).child('gamePicture.png')\n      .putString(photoData, 'base64', {contentType: 'image/png'})\n        .then(savedPicture =\u003e {\n\n\n        // Get task progress, including the number of bytes uploaded and the total number of bytes to be uploaded\n     that.uploadProgress = (savedPicture.bytesTransferred / savedPicture.totalBytes) * 100;\n\n\n    if(that.uploadProgress == 100){\n      loader.dismiss();\n    }\n\n\n            \t//update the question with photo url\n             firebase.database().ref().child(path+'/'+newDetailsKey.key)\n              .update({photoUrl : savedPicture.downloadURL});\n\n\n      // console.log('Upload is ' + that.uploadProgress + '% done');\n\n       let toast = that.toastCtrl.create({\n         message: 'Upload is ' + that.uploadProgress + '% done',\n         duration: 3000,\n         position: 'top'\n       });\n       toast.present();\n\n      return  that.uploadProgress;\n\n        });\n      }\n\n\n\n*/\n\n\n\n  // Create the file metadata\n  var metadata = {\n    contentType: 'image/jpeg'\n  };\n var file = photoData;\n var that = this;\n\n var loader = that.loadingCtrl.create({\n      content: \"Uploading Image, \"+ that.progress +\" Please Wait...\",\n    });\n\n\n  // Upload file and metadata to the object 'images/mountains.jpg'\n  var uploadTask = that.profilePictureRef.child('images/' + 'imageUploadPicture.png').putString(photoData);\n\n  // Listen for state changes, errors, and completion of the upload.\n  uploadTask.on(firebase.storage.TaskEvent.STATE_CHANGED, function(snapshot) {\n      // Get task progress, including the number of bytes uploaded and the total number of bytes to be uploaded\n      that.progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;\n      console.log('Upload is ' + that.progress + '% done');\n\n\n         loader.present();\n\n      switch (snapshot.state) {\n        case firebase.storage.TaskState.PAUSED: // or 'paused'\n          console.log('Upload is paused');\n          break;\n        case firebase.storage.TaskState.RUNNING: // or 'running'\n          console.log('Upload is running');\n          break;\n      }\n    }, error =\u003e {\n    switch (error.code) {\n      case 'storage/unauthorized':\n        // User doesn't have permission to access the object\n        break;\n\n      case 'storage/canceled':\n        // User canceled the upload\n        break;\n      case 'storage/unknown':\n        // Unknown error occurred, inspect error.serverResponse\n        break;\n    }\n  }, savedPicture =\u003e{\n    // Upload completed successfully, now we can get the download URL\n\n     loader.dismiss();\n    var downloadURL = uploadTask.snapshot.downloadURL;\n\n    var postDataDetails = {\n  \t\tquestion_description : that.question_description,\n  \t\tquestion_title : that.question_title,\n  \t\tright_answer : that.right_answer\n  \t}\n     var newDetailsKey = firebase.database().ref().child(path).push(postDataDetails);\n    //update the question with photo url\n   firebase.database().ref().child(path+'/'+newDetailsKey.key)\n    .update({photoUrl : savedPicture.downloadURL});\n  });\n\n\n\n\n\n  }\n\n````\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdavepartner%2Fionic3-firebase-image-upload","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdavepartner%2Fionic3-firebase-image-upload","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdavepartner%2Fionic3-firebase-image-upload/lists"}