✨Discover storytelling in the AI age with Pixar's Matthew Luhn at Sanity Connect, May 8th—register now

Troubleshooting a POST GROQ request using JS Client in Next.js

7 replies
Last updated: May 16, 2021
Hey,
Any pointers on how to send a POST GROQ request using the JS Client? My query is too big…
May 10, 2021, 1:42 PM
I’m just getting this error from Next: FetchError: invalid json response body at https://sanity.io/v2021-03-25/data/query/production?query <bigquery>
May 11, 2021, 6:18 AM
Really struggling with this 😞
May 11, 2021, 10:24 AM
Would you be willing to post your query in its context in Next—including a query that's formed like yours? (The specifics of the query can be changed but it would help diagnose the problem to see something like what you're sending.)
You may also want to curl your query to make sure the error is with the query itself and not your code.
May 11, 2021, 1:48 PM
{
      "pageData": 
      *[_type == "policy" && slug.current == $slug] 
      
      {..., 
          pageTemplate{
              ...,
              mainButton{
                  buttonText,
                  "slug": internalLink->{slug},
                  "externalLink": externalLink{...},
              },
              secondButton{
                  buttonText,
                  "slug": internalLink->{slug},
                  "externalLink": externalLink{...},
              },
              introText[]{
                  ...,
                  markDefs[]{
                  ...,
                  _type == "internalLink" => {
                          "slug" : @->slug.current,
                      "type" : @->_type
                      }
                  },
              }, 
          },
          
      content[]{
          ...,
          
      "image":image{
          ...,
          alt, 
          caption,
          ...asset->
      }
  ,
          _type == 'accordionSection' => {
              ...,
              accordions[]{
                  ...,
                  ...@->{...},
                  _type == "manualRef" => {
                      "body": body[]{
                      ...,
                      markDefs[]{
                      ...,
                      _type == "internalLink" => {
                              ...,
                              "slug" : @->{
                                  defined(postFields) => {
                                      "current":postFields.slug.current,
                                  },
                                  defined(slug) => {
                                      "current":slug.current
                                  }
                              },
                              "type" : @->_type
                          }
                      },
                  },
                  }
              },
          }, 
          _type == 'shortcutSection' => {
              ...,
              
      "image":image{
          ...,
          alt, 
          caption,
          ...asset->
      }
  , 
              bgColor,
              shortcuts[]{ 
                  ...,               
                  ...@->
              }
          },
          
  _type == 'feedSection' => {
      ...,
      feedContent[]{
          ...,
          route->{...},
          
      "image":image{
          ...,
          alt, 
          caption,
          ...asset->
      }
  
      }
  },
          
   _type == 'sliderSection' => {
       ...,
      route->{...},
      sliderContent[]->{
          ...
          
      }, 
  },
          
  _type == 'peopleSection' => {
      title,
      people[]->{...}, 
  },
          
  _type == 'registrationFormSection' => {
      ...,
      description[]{
         ...,
         markDefs[]{
          ...,
          _type == "internalLink" => {
                  ...,
                  "slug" : @->{
                      defined(postFields) => {
                          "current":postFields.slug.current,
                      },
                      defined(slug) => {
                          "current":slug.current
                      }
                  },
                  "type" : @->_type
              }
          },
      }, 
      
      "image":image{
          ...,
          alt, 
          caption,
          ...asset->
      }
  
  }
  ,
  
          
          text[]{
              ...,
              
      "image":image{
          ...,
          alt, 
          caption,
          ...asset->
      }
  ,  
              accordions[]{
                  ...,
                  ...@->{...},
                  body[]{
                      ...,
                      markDefs[]{
                      ...,
                      _type == "internalLink" => {
                              ...,
                              "slug" : @->{
                                  defined(postFields) => {
                                      "current":postFields.slug.current,
                                  },
                                  defined(slug) => {
                                      "current":slug.current
                                  }
                              },
                              "type" : @->_type
                          }
                      },
                  },
              },
              shortcuts[]{ 
                  ...,      
                  ...@->{
                      ...,
                      internalLink{
                          "slug" : @->{
                              defined(postFields) => {
                                  "current":postFields.slug.current,
                              },
                              defined(slug) => {
                                  "current":slug.current
                              }
                          },
                          "type" : @->_type
                      }
                  }
              },
              markDefs[]{
                  ...,
                  _type == "internalLink" => {
                          "slug" : @->{
                              defined(postFields) => {
                                  "current":postFields.slug.current,
                              },
                              defined(slug) => {
                                  "current":slug.current
                              }
                          },
                          "type" : @->_type
                      }
              },
          },
          images[]{
              ...,
              ...asset->
          }, 
          route->{
              slug, 
              _type, 
              title,
              ...postFields
              }, 
          manualNews[]->{
              _type, _id,
              postFields{
                  title, blurb, mainImage, slug
              }
          }, 
          newsCategory->{title, _id},      
          people[]->{
              name, _id, photo, role, contactInfo, slug
          },                       
      }
            
      }
  ,
      
       "siteConfig" : *[_type == "siteConfig"] {
        
      ..., 
      logo,
      mainNavigation[]->{slug, page->{"title": title}},
      dropdownNavigation[]->{slug, page->{"title": title}},
      footerNavigation[]->{slug, page->{"title": title}}
  ,
        "contactInfo": *[_type == "mainContact"] {
           ...contactInfo
         },
        "social": *[_type=='social'],
      }
  
    }
May 16, 2021, 7:55 AM
The error is still Unexpected Token < in JSON at position 0. Which seems to be Sanity 400 bad request page:
May 16, 2021, 8:00 AM
Trying to post the actual get URL that shows up in my terminal but Slack wont let me lol
May 16, 2021, 8:01 AM
Whelp. I think the whole problem was using next-sanity that defaults to picosanity.
May 16, 2021, 8:54 AM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?