1

I have created a spfx-angular-element demo with reference to the below link:

https://gonadn.medium.com/spfx-with-angular-element-crud-operations-using-pnpjs-5a8a18ed6e43

It is working correctly in the SharePoint workbench. Kindly refer to the below image,

enter image description here

When I create the package and add an app in to the SharePoint page, it is throwing the below error in the SharePoint list API call (added SitePages in API call)

GET https://xyzsharepoint.sharepoint.com/sites/devsite/SitePages/_api/web/lists/getByTitle('TestList')/items?$top=2000 404

Kindly refer to the below image:

enter image description here

Can anyone please assist me with the same?

1

You are facing this issue because either you missed establishing context in PnP setup or you are passing blank context to setup.

You can establishing context in PnP setup like:

public onInit(): Promise<void> {

  return super.onInit().then(_ => {

    pnp.setup({
      spfxContext: this.context
    });
    
  });
}

OR

public onInit(): Promise<void> {

  return super.onInit().then(_ => {

    sp.setup({
      spfxContext: this.context
    });
    
  });
}

Documentation: Using sp pnp js in SharePoint Framework - Establish Context

Similar Issue: 404 error when generating REST queries

4
  • Thanks for your quick response. I have created spfx project and angular project in the same solution. So, can you please suggest to me where I need to put this code?
    – BhattMeet
    Apr 9 at 13:19
  • 1
    Try adding 2nd code snippet in my answer to your PnPBaseService class. Apr 9 at 13:24
  • I got an error while add that code please refer below link of screenshot, ibb.co/Db5r3fd
    – BhattMeet
    Apr 9 at 13:46
  • 1
    I am not sure about angular part. But, the way to solve this is you need to establish the PnP context by passing web part context where you are using PnP calls like sp.web/lists/..... You can refer the PnP documentation or other community SPFx samples. Apr 9 at 14:11

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.