Create Private Pages that are accessible only after authorization

Hi there

Is it possible for me to create a Page that can only be viewed privately? I have certain pages on my site that should only be accessible after login

I can control that flow on my application - but nothing stops someone from using my public builder api key from my deployed source code to bypass my frontend (which serves as a proxy to Builder)

1 Like

Howdy @yashu, welcome to the forum!

You can do this using a recently added model setting called public readable. You can go over to Builder.io: Visual Development Platform and choose your model and hit show more options under model settings and then find the public readable option and turn that off and save your model, e.g. perhaps make a new private-page model of page type with this setting switched off

Note that this model option is currently only live on beta.builder.io but will be in the production builder.io settings UI soon.

Then, go over to your organization settings at Builder.io: Visual Development Platform and add create a new private key

private key .

Then you can use our content API to request private content using your private key, e.g.

let apiUrl = 'https://cdn.builder.io/api/v2/content'
let modelName = 'private-page'
let content = await request(`${apiUrl}/${modelName}?apiKey=${yourPublicKey}&limit=1&userAttributes.urlPath=/some-page`, {
  headers: { Authorization: `Bearer ${yourPrivateKey}` },
})

Then you can pass that json to render as needed, e.g. with React

let page = content.results[0];

if (page) {
  return <BuilderComponent model="private-page" content={page} />
}

Hope this helps and let me know if I can further explain anything here!

2 Likes

Should this work in Angular? I’m able to fetch the data from the content API but the builder component doesn’t render. I’m passing the content.results[0] how it’s shown above in this thread.

BTW I opened a similar topic Private Page Authentication - #5 by spm922

Hi @spm922,

Yes, this should work in angular, we have used your code provided at Private Page Authentication - #5 by spm922 and have not been able to reproduce this error, the content is rendering fine for us. Are you using the correct private key?

Here is git with source code working for us GitHub - Manic-sh/builder-angular-private-pages: Builder Integration with angular, private page example