Connecting to Private API using the Documentation

Developing with Prismic
1

Hi Everyone, this is my first time using Prismic and I'm having a bit of difficulty connecting to a private API. I'm pretty new to React so I may have missed some simple essentials but I'm giving it my best shot.
I have followed the steps in the Documentation and have written all the code into my app.js file.
For some reason an error showed me that I needed to put a ; before the curly bracket on linkResolver, even though that wasn't in the documentation so I did that.
Now the issue is that it is failing to compile because 'return' is outside of the function (28:2).

I'd be really grateful if anyone has any feedback or tips on how I can solve this issue.
Thanks so much for your time, I really appreciate any help you can give.

Here is the code without the private details of course:

// Link Resolver
linkResolver(doc) ;{

// Define the url depending on the document type

if (doc.type === 'doc name here') {

return '/doc name here/' + doc.uid;

}

}

3

Hi Lauren,

Welcome to the Prismic community, and thanks for posting this question :slight_smile:

It looks like there's an error in the documentation. I'm guessing you found the Link Resolver code here?

This line:

linkResolver(doc) {

Should be something like this:

function linkResolver(doc) {

(With no semicolon.)

Let me know if that helps!

Best,
Sam

4

Hi Sam, thanks so much for replying! Yeah I got the documentation from the site here...the link you sent in your post was where I got it from. So I have put the doc type but do I need to put the name of my doc in the doc type I'm guessing? Do I also need to the name of my UID or not?.....
// Link Resolver

function linkResolver(doc) {

// Define the url depending on the document type

if (doc.type === 'doc.type') {

return '/doc.type/' + doc.uid;

} else if (doc.type === 'blog_post') {

return '/blog/' + doc.uid;

}

// Default to homepage

return '/';

}

5

I have also tried to connect in javascript in a different repo to see if I could get it connected but for some reason that didn't work either.

6

Great, I fixed the code snippet in the documentation. Thanks for pointing that out!

You can customize the Link Resolver however you like. (This article has more information about how the Link Resolver works.)

Sometimes you'll need to use the name of a doc type, and sometimes you'll need to use the name for a UID. I'll give you a detailed example to help illustrate things. Let me know if this helps.

The return statements in the Link Resolver should return a relative Link to a document. So, if your website has the following pages:

/
/about
/contact
/blog/hi-there
/blog/nice-colors
/blog/cats

And we assume:

  • the page / is a "page" document with the UID "homepage"
  • the pages /about and /contact are both "page" documents with the UIDs "about" and "contact"
  • the blog pages are all "blog" documents, with the UIDs "hi-there", "nice-colors", and "cats"

Then, we're going to write our own Link Resolver to match that structure.

function linkResolver(doc) {
  // First, make sure the homepage goes to the root
  if (doc.uid === 'homepage') {
    return '/'
  // Then, construct the URL for pages
  } else if (doc.type === 'page') {
    return '/' + doc.uid;
  }
  // Finally, construct the URL for blog posts
  } else if (doc.type === 'blog') {
    return '/blog/' + doc.uid;
  }
  // Then, default to the homepage for any outliers
  return '/';
}

Having said that, there are lots of different ways to do this. You can customize it however you need, and you could even use a completely different method for this.

And, like you said, the names of doc.type and doc.uid are set by you in Prismic. So, where I put 'homepage', you could have anything. Same with 'page' and 'blog'. You can also add more else ifs for other documents and document types.

I hope I didn't overcomplicate things with this example! Let me know if this helps at all.

Best,
Sam

7

Thanks so much again Sam. Yeah so I just checked and I have that there...looks correct. I have this after it: // Default to homepage
return '/';
}

var PrismicDOM = require('prismic-dom');

This is the javascript version. I tried the react version but I couldn't get it going so I'm trying to stick with what I know more of. I have copied all the code from the documentation for the javascript version but it doesn't seem to fetch any data from prismic. Is there anything else I need to do after having written this code in my workspace? It seems like something is missing.
8

I would need to look at all of your code to see what else is needed. Can you send me your files in a DM? That way I can get a better idea.

9

Sure no problem, thank you Sam.

11

This thread has been closed due to inactivity. Flag to reopen.