Pnpjs: pnp-sp-js file.getBuffer is not a function

[andarkeerthi]

Error in making file request using server relative path. The request path is invalid. It is adding api after pages library instead of site

pnp.sp.web.getFileByServerRelativeUrl("https://xxxxxx/Plus/DocumentLibrary/folder1/folder2/file.pdf").getBuffer().then((buffer : ArrayBuffer) => {
this.content = buffer;
});

https://xxxxxx/Pages/gfs/_api/web/getFileByServerRelativeUrl('/DocumentLibrary/folder1/folder2/file.pdf"')/$value

_Originally posted by @ahsanranjha in https://github.com/pnp/pnpjs/issues/103#issuecomment-389060241_

[koltyakov]

It's better defining baseUrl explicitly. Using new Web('[siteAbsUrl]') or sp.setup method.

[andarkeerthi]

     `pnp.sp.web.getFolderByServerRelativeUrl("Contracts/Forms/CustomContentType")
  .files.getByName("template.docx")
  .get().then(file => {
    alert("got the file");
    if (file !== undefined && file !== null) {
        file.getBuffer();
        pnp.sp.web.getFolderByServerRelativeUrl("").files.add("abc.docx",file, true).then(f => {
          f.file.getItem().then(item => {
            item.update({
              body
            });
          });
        });
    }
  });
     `

Getting file.getBuffer is not a function may I know the root cause for this?

[koltyakov]

Get file response does not return files blob it's a JSON object with SP.File metadata. And obviously, there is no getBuffer method. getBlob or getBuffer should be used for the purpose of getting a file's content:

Server-relative URLs should stand for valid server-relative URLs, but not an absolute or a random part of it or an empty string, this is incorrect in the samples above, should be something like '/sites/site/web/list/folder'.

Side off comment, please stick to the rules such as using issue templates, they are for the reasons.

Please use docs for general questions before posting an issue.

[andarkeerthi]

Thanks a lot for your reply
I was using following code to get the buffer

import pnp from "sp-pnp-js";
pnp.sp.web.getFileByServerRelativeUrl("/sites/dev/documents/file.avi").getBuffer().then((buffer: ArrayBuffer) => {});

I was getting file.getBuffer is not a function in the console and as per your comment I started using
import { sp } from "@pnp/sp"; library to get the buffer and code started working.

Could you please tell me the differences between the libraries.?

[koltyakov]

PnPjs is a successor of sp-pnp-js which was deprecated a year ago and archived. More info why it happened is here.