I am using sp-pnp-js for my spfx project. GetWebUrlFromPageUrl method is returning wrong URL that includes sitePages also. Please refer: my current page location is https://xxxx.sharepoint.com/sites/abc/SitePages/Search.aspx

The above method is returning web url as: https://xxxx.sharepoint.com/sites/abc/SitePages

rather it should return: https://xxxx.sharepoint.com/sites/abc/

 .then(res => {

Please note this issue is not appearing in workbench. This appears only when only when I deployed the code to SharePoint site

What am I missing?

Edit 1: Screen shot- see the current URL is having /SitePages/. But if I run the same from workbench it doesn't throw error

enter image description here

  • are you trying to get the current web in your code ? Sep 4 '17 at 11:05
  • Yes, Gautam. Please see my question edit
    – DvG
    Sep 4 '17 at 13:35

Not really sure why GetWebUrlFromPageUrl is not working. But as you mentioned in the comment that you want the current sp web url, you can use the this.context.pageContext object.

No need to make a REST api call to get the current sp web url.

For example, in the render method, using React, it is available as below:

public render(): void {
const element: React.ReactElement<any > = React.createElement(
     spWebUrl: this.context.pageContext.web.absoluteUrl     

 ReactDom.render(element, this.domElement);

Or, using it in a simple no-framework solution as below:

let spWebUrl = '';
public render(): void {
    spWebUrl = this.context.pageContext.web.absoluteUrl;

After that, you can use the spWebUrl anywhere in your code.

I believe that this will be a much faster and correct way to get the current web url. GetWebUrlFromPageUrl internally made a POST request to the _api/sp.web.getweburlfrompageurl(@v) endpoint and then gave you the data(in your case, incorrect data). However, this.context.pageContext object saves you this API call and provides the correct result.

  • hey @dvg, did you try this approach ? Sep 6 '17 at 16:20
  • This will not work for me as I am using Knockout.js and this.context.pageContext.web.absoluteUrl works on webpart.ts file only. However my core logic is written under webpartViewModel.ts file... Thanks nyway
    – DvG
    Sep 8 '17 at 16:09
  • ok kind-of understood, you can use import { PageContext } from '@microsoft/sp-page-context'; in your webpartViewModel.ts file and then use the context variable , or else pass the value from webpart.ts to webpartViewModel.ts file somehow, not sure how though :) Sep 11 '17 at 7:42

if it helps someone else I had the same problem and to solve it had to initiate the pnp.setup

 public onInit(): Promise<void> {
    return super.onInit().then(_ => { 
      spfxContext: this.context

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.