PnPJs and PCF Control, popup and redirection uri

[krunal039]

What version of PnPjs library you are using

4.x

Minor Version Number

4.6

Target environment

other (enter in the "Additional environment details" area below)

Additional environment details

I’m using PnPJs to create a PCF control for uploading large files to SharePoint within a canvas app. The code below is working while editing the canvas app, along with the redirection URI : https://authoring.eu-il109.gateway.prod.island.powerapps.com/v3.24095.15.310953622/embed/ `import { IInputs, IOutputs } from "./generated/ManifestTypes"; import type { MSALOptions } from "@pnp/msaljsclient"; import { spfi, SPBrowser } from "@pnp/sp"; import { MSAL, getMSAL } from "@pnp/msaljsclient"; import "@pnp/sp/webs"; import "@pnp/sp/lists"; import "@pnp/sp/site-users/web";

export class pcfspolargeupload implements ComponentFramework.StandardControl<IInputs, IOutputs> {

constructor() {

}

public async init(context: ComponentFramework.Context, notifyOutputChanged: () => void, state: ComponentFramework.Dictionary, container:HTMLDivElement): Promise { let _notifyOutputChanged: () => void let _context: ComponentFramework.Context let _spContext: any

const options: MSALOptions = {
    configuration: {
        auth: {
            authority: "https://login.microsoftonline.com/[TenantID]/",
            clientId: "[AppID]",
        },
        cache: {
            claimsBasedCachingEnabled: true // in order to avoid network call to refresh a token every time claims are requested
        }
    },
    authParams: {
        forceRefresh: false,
        scopes: ["https://tenant.sharepoint.com/.default"],
    }
};

const sp = spfi("https://tenant.sharepoint.com/").using(SPBrowser(), MSAL(options));

const user = await sp.web.currentUser();

// For logout later on
const msalInstance = getMSAL();
const currentAccount = msalInstance.getActiveAccount();

const list = sp.web.lists.getByTitle("Documents");

// we can use this 'list' variable to run more queries on the list:
const r = await list.select("Id")();

// log the list Id to console
console.log(r.Id);

container.appendChild(document.createTextNode(r.Id));

}

public updateView(context: ComponentFramework.Context): void { } public getOutputs(): IOutputs { return {}; }

public destroy(): void { } }`

Question/Request

When I publish the app and access it, the redirection URI changes to: https://runtime-app.powerplatform.com/publishedapp/e/default-cc83b6ac-505f-4efc-a552-a2c7bfa6d7e3/preloadindex/V1. The popup doesn’t close, and I’m unsure what I’m doing wrong. What steps should I take to get PnPJs working with my AAD app to upload large files to SharePoint via PCF control in Canvas app?

[patrick-rodgers]

What is the error in the server logs? I.e. why do you think this is a PnPjs library issue? Based on the above I don't know what the underlying error is or where to start investigating.

[krunal039]

What is the error in the server logs? I.e. why do you think this is a PnPjs library issue? Based on the above I don't know what the underlying error is or where to start investigating.

I do not know if it is an issue with PnP library, just want to know if there is anything I am doing wrong here to get an access token in PCF control? I could not find much sample as well

[bcameron1231]

Hi, did you update the Redirect URL in Azure for the App Registration for the new URL?

[krunal039]

Yes, I did update, popup is not closing.

On Fri, 18 Oct 2024, 21:21 Beau Cameron, @.***> wrote:

Hi, did you update the Redirect URL in Azure for the App Registration for the new URL?

— Reply to this email directly, view it on GitHub https://github.com/pnp/pnpjs/issues/3154#issuecomment-2423175342, or unsubscribe https://github.com/notifications/unsubscribe-auth/ACZMRSE73NMKZ55YC3QK74TZ4FUT3AVCNFSM6AAAAABQDYTJ3SVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDIMRTGE3TKMZUGI . You are receiving this because you authored the thread.Message ID: @.***>

[bcameron1231]

Do you see any errors in the developer console (F12 -> Console) in the browser when you load the application?

[krunal039]

No related to Auth or redirection.

On Mon, 21 Oct 2024, 16:15 Beau Cameron, @.***> wrote:

Do you see any errors in the developer console (F12 -> Console) in the browser when you load the application?

— Reply to this email directly, view it on GitHub https://github.com/pnp/pnpjs/issues/3154#issuecomment-2426980695, or unsubscribe https://github.com/notifications/unsubscribe-auth/ACZMRSFS2MXOIZA4ZKHNZCLZ4ULCNAVCNFSM6AAAAABQDYTJ3SVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDIMRWHE4DANRZGU . You are receiving this because you authored the thread.Message ID: @.***>

[bcameron1231]

Okay. Unfortunately there isn't quite enough information to provide a definitive answer. Are you seeing queries for the token and authorize to login.microsoft.com?

It may just be an issue with the Power Apps environment once it's published. It's likely unrelated to the PnPjs library.