How to use OnlineStorePage with GraphQL api - either admin or storefront?

Martin_Bravo
Shopify Partner
1 0 4

I'm implementing a custom storefront for an ecommerce using the new GraphQL api. It is awesome but I'm having a hard time loading page content from the store via this api. 

I see in the docs there is an Object "OnlineStorePage" but I haven't found the way to query it on the docs or browsing with GraphiQL. Any clues?

https://help.shopify.com/en/api/graphql-admin-api/reference/object/onlinestorepage

krstffr
New Member
1 0 0

@Martin_Bravodid you find out how to do this? I can not find about this using Google or in the GraphQL query explorer.

0 Likes
Adverbly
Tourist
5 0 1

I was also poking around with this as a few types were documented, but I couldn't figure out how to get them(e.g. OnlineStoreArticle/OnlineStoreBlog). I eventually ran a schema introspection query and dug into the schema.graphql:

"A custom page on the Online Store."
type OnlineStorePage implements HasPublishedTranslations & Navigable & Node {
    "A default cursor for use in pagination."
    defaultCursor: String!
    "Globally unique identifier."
    id: ID!
    "The translations associated with the resource."
    translations(
        #Filters translations locale.
        locale: String!
    ): [PublishedTranslation!]!
}

type OnlineStorePageEdge {
    "A cursor for use in pagination."
    cursor: String!
    "The item at the end of OnlineStorePageEdge."
    node: OnlineStorePage!
}


What is missing here is an OnlineStorePageConnection Type, or any other field which returns an OnlineStorePage... This means that nothing in the API actually returns these types.

If I had to guess, the graphql api team at Shopify is ahead of the curve and modeling types which are not used yet. Bit confusing for us. Hopefully they will be available soon(Although I snooped the 2020-1 release candidate schema and didn't see them there either, so probably not that soon).

ryantkelly
Tourist
10 0 5

Wow, thank you all for posting this. I was losing my mind wondering how on earth it's possible to access OnlineStorePage with GraphQL considering nothing returns it.

0 Likes
Adverbly
Tourist
5 0 1

@ryantkelly FYI, since I initially dug into this, I've learned a few things about Graphql and Relay.

Of note is https://graphql.org/learn/schema/#interfaces and https://shopify.dev/docs/admin-api/graphql/reference/common-objects/node

I think its technically possible that a root level query for a node which passed in the ID for an OnlineStorePage or an OnlineStoreArticle could then use the `...onOnlineStorePage` syntax to grab the properties... Alternatively, if any other spots return Nodes or some of the other thing that these types implement, it's theoretically possible to use `...onOnlineStorePage` to fetch them.

Again though, this may not be all that helpful though because you need the IDs up front.

0 Likes
ryantkelly
Tourist
10 0 5

@Adverblythanks for those.

From what I've found, nothing returns the OnlineStorePage object, but if I had the ID, I could get it.

I suppose I could get the admin_graphql_api_id from the REST api. So if anyone else in the future is trying to this...there's an idea.

But for the sake of clarity - what I was attempting to do was use the GraphQL API to search for a specific page by handle or title in something I am building with Retool. I used this same concept with Collections, but that GraphQL endpoint is more complete. I can approximately get to what I want to do with the REST API, but GraphQL is much more direct.

0 Likes