The section "projet" could not be loaded: The JSON response from the API could not be parsed

Kirby 3 Solved ✅
3
The site blueprint 
title: Site

columns:
  - width: 2/3
    sections:
      projet: sections/projets

  - width: 1/3
    sections:
     pages: true
     content:
      type: fields
      fields:
        author:
          label: Author
          type:  text
        description:
          label: Description
          type:  textarea
        keywords:
          label: Keywords
          type:  tags
        copyright:
          label: Copyright
            type: textarea
And the section blueprint 
type: pages
headline: Projets
parent: kirby.page("projets")
# template: projet
templates:
  - projet
  - projet-continu
empty: No project yet
limit: 30
4

Is your indentation exactly like what you posted?

5

Oups no, I fixed it in my previous post.

6

Ok, the blueprints looks ok now. Maybe you have an error in one of the templates projet or projet-continu. Could you please post them here as well?

7

projet.yml

title: Project

columns:
  - width: 2/3
    sections:
      files: 
        headline: Images
        template: project-image
        info: "{{ file.dimensions }}"
        layout: cards
        size: small
        image:
          ratio: 3/2
          cover: true

  - width: 1/3
    sections:
      content:
        type: fields
        fields:
          client:
            type: text
            width: 1/2
          projet:
            label: Conception
            type: textarea
            width: 1/2
          text:
            type: textarea
            width: 1/2
      sideImages:
        type: files
        template: side-image

projet-continu.yml

title: Projet-continu
extends: pages/projet
8

I meant the php templates

9

Oh! Both are pretty similar:

<?php snippet('head') ?>

<?php snippet('projet-poster') ?>

<?php snippet('menu') ?>

<?php snippet('projet-content') ?> OR <?php snippet('projet-content-continu') ?> 

<?php snippet('projet-suivant') ?>

<?php snippet('foot') ?>

And here are the related snippets

10

Hm, those look rather innocent as well, even if in some places if statements would make the code more reliable.

When you updated, did you clear the media folder?

11

I just deleted the entire media folder, and the same error appears. :slightly_frowning_face:

12

I tried doing a blueprint with only

title: Site

sections:
  projet: sections/projets

But no more luck.
Here’s the console log

Error: The JSON response from the API could not be parsed
onParserError — app.js:1:22240
(fonction anonyme) — app.js:1:17486
asyncFunctionResume
[native code]
promiseReactionJobWithoutPromise
13

Hm, I’m a bit lost. Since it works locally, I would assume that there’s some server side configuration that’s causing this. What about server side caching? Have you tried to purge/disable that?

14

I’m afraid I don’t know how to do that. I contacted Fortrabbit; will keep you posted if they have any clue!

15

I played a bit with the code this morning.
If I remove the following from sections/projets

parent: kirby.page("projets")

I get it kinda working, but not showing any projects. Dont know if it help!

16

Does the given page exist at the path? Is the folder name really projet?

17

Yes, I have both the /blueprints/pages/projets.yml and content/01_projets in place.

18

I found this in the Docs, but it doesn’t seams to relate unfortunately :confused:

19

If you open Developer Tools in the browser, and inspect the JSON/Panel responses, what is their content? There could be your answer; I remember debugging some very old project of mine, where expected JSON kept failing just to discover that response was actually misformatted because of some PHP errors

20

Hey @adamkiis, thanks for the suggestion. I find nothing that seams weird.
Here’s the HTML from Inspect Elements.

<section class="k-pages-section k-section k-section-name-projet"><header class="k-section-header"><h2 class="k-headline">   <!----></h2><!----></header><div data-theme="negative" class="k-box"><div data-size="small" class="k-text"><strong> The section "projet" could not be loaded: </strong> The JSON response from the API could not be parsed </div></div></section>
<header class="k-section-header"><h2 class="k-headline">   <!----></h2><!----></header>
<div data-theme="negative" class="k-box"><div data-size="small" class="k-text"><strong> The section "projet" could not be loaded: </strong> The JSON response from the API could not be parsed </div></div>
<div data-size="small" class="k-text"><strong> The section "projet" could not be loaded: </strong> The JSON response from the API could not be parsed </div>
<strong> The section "projet" could not be loaded: </strong>
 The JSON response from the API could not be parsed 
<div data-size="small" class="k-text"><strong> The section "projet" could not be loaded: </strong> The JSON response from the API could not be parsed </div>
<div data-theme="negative" class="k-box"><div data-size="small" class="k-text"><strong> The section "projet" could not be loaded: </strong> The JSON response from the API could not be parsed </div></div>
<section class="k-pages-section k-section k-section-name-projet"><header class="k-section-header"><h2 class="k-headline">   <!----></h2><!----></header><div data-theme="negative" class="k-box"><div data-size="small" class="k-text"><strong> The section "projet" could not be loaded: </strong> The JSON response from the API could not be parsed </div></div></section>

And the Console log

Error: The JSON response from the API could not be parsed
onParserError — app.js:1:22240
(fonction anonyme) — app.js:1:17486
asyncFunctionResume
[native code]
promiseReactionJobWithoutPromise
onError — app.js:1:22082
(fonction anonyme) — app.js:1:17731
asyncFunctionResume
(fonction anonyme)
promiseReactionJobWithoutPromise
app.js:1:11815

Does that helps?

21

Not Really. That’s your current html and console. If you go to devtools, there should be a requests or network tab. There you see the json requests panel makes upon navigation, and should help you isolate the problematic one.

22

Solved with the more than gracious help from @adamkiss!
It was simply… accented characters in the filename of two of the projects :expressionless:.
My host apparently doesn’t like them!