I am using the sample react-file upload sample and upon and upload am changing the metadata of the file. The catch is it is working when am testing and when the app is deployed it no more works.The file get uploaded but not the metadata.i get error 404 that the file cannot be found.

sending: function (file, xhr) {
    let _send = xhr.send;
    xhr.send = function () {
      _send.call(xhr, file);

      console.log("entering metadata");
      pnp.sp.web.getFolderByServerRelativeUrl(_parent.props.folder).files.getByName(file.name).getItem().then(item => {

            OData__x0074_ag1: _parent.props.Tag1,

      console.log("entering metadata done");


I guess you're using this project, and I tested in my online environment.

The issue seems caused by pnp.sp.web, if I get web as let web:Web=new Web(_context.pageContext.web.absoluteUrl);, it works, if I use pnp.sp.web, it will raise 404 error.

          console.log("error check");
          let web:Web=new Web(_context.pageContext.web.absoluteUrl);  
          web.lists.getById(_parent.props.listName).rootFolder.files.getByName(file.name).getItem().then(item => {
          console.log("entering metadata done");

enter image description here

| improve this answer | |
  • hi but now when i try uploading 4 files only one get uploaded. i get a series of error 404 for the others – Keshav Taurah Dec 18 '18 at 10:35
  • i figured out if i add 2 files it works fine,but if i try to upload more it give 404 error – Keshav Taurah Dec 18 '18 at 10:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.