disable __data.json in SPA mode #10467

lukaso · 2023-08-01T22:39:24Z

lukaso
Aug 1, 2023

I'm unable to host my site in static mode because despite setting when ssr=false I'm still getting requests on __data.json.

This appears to be due to Houdini, even though I've followed these instructions: HoudiniGraphql/houdini#85. But I'm not sure.

I could work around this by returning {} from a static __data.json except for the fact that my host, firebase, reserves __, and therefore blocks me providing that file. So that doesn't work.

However, my host is still rewriting __data.json to index.html (I have a ** wildcard rewrite) because I need this for my SPA to work. https://firebase.google.com/docs/hosting/full-config

"hosting": {
  // ...

  // Serves index.html for requests to files or directories that do not exist
  "rewrites": [ {
    "source": "**",
    "destination": "/index.html"
  } ]
}

This causes the following error:

Uncaught (in promise) SyntaxError: Unexpected token '<', "<!DOCTYPE html>" is not valid JSON
    at JSON.parse (<anonymous>)
    at start.c9bb6dea.js:3:33

because instead of getting a 404 or a {} when data.json is called by sveltekit, I'm getting the index.html returned and sveltekit doesn't handle it.

Any ideas. Many thanks!

Answered by eltigerchino

Aug 3, 2023

Can you try adding static: true to your houdini.config.js file? I'm not sure what the side effects are but it seems Houdini is responsible for calling the fetch to /__data.json even when there is no root layout load function.

/// <references types="houdini-svelte">

/** @type {import('houdini').ConfigFile} */
const config = {
	watchSchema: {
		url: 'https://rickandmortyapi.com/graphql/',
	},
	plugins: {
		'houdini-svelte': {
+			static: true,
		},
	},
}

export default config

static (optional, default: false): A flag to remove the session infrastructure from your application

https://houdinigraphql.com/api/config

View full answer

eltigerchino · 2023-08-02T08:49:08Z

eltigerchino
Aug 2, 2023
Collaborator

ssr=false I'm still getting requests on __data.json

This shouldn't be happening. Can you share a minimal reproduction to help with troubleshooting this issue?

7 replies

lukaso Aug 2, 2023
Author

OK, I've simply added this line to the standard example for houdini and __data.json is now called.

export const ssr = false

and changed to adapter-static.

Here is the repo with my changes:

https://github.com/lukaso/houdini-with-sveltekit-example

lukaso Aug 2, 2023
Author

When I've deployed this project to firebase with the only change being adapter-static and fallback, and without the ssr=false change, I am still faced with the __data.json being called.

This is the firebase.json:

{
  "hosting": [
    {
      "target": "app",
      "public": "build",
      "ignore": [
        "**/.*",
        "node_modules/**",
        "src/**",
        "static/**",
        "tests/**",
        "*.json",
        "*.js",
        "*.lock",
        "*.ts",
        "*.yaml",
        "*.md"
      ],
      "rewrites": [
        {
          "source": "**",
          "destination": "/index.html"
        }
      ]
    }
  ]
}

My Github action to deploy is:

      - uses: FirebaseExtended/action-hosting-deploy@main
        with:
          repoToken: '${{ secrets.GITHUB_TOKEN }}'
          firebaseServiceAccount: '${{ env.SERVICE_ACCOUNT_KEY }}'
          channelId: live
          projectId: hiphops-${{ env.ENV_NAME }}
          target: app
        env:
          FIREBASE_CLI_PREVIEWS: hostingchannels

And here is a failing preview: https://hiphops-stage--pr386-try-minimal-break-1uydybrj.web.app/

Given firebase is a commercial product, I'm not sure how to create a minimal reproducible version other than to say that something is changing things.

lukaso Aug 2, 2023
Author

One thing that is making this harder to debug is that vite preview seems to ignore adapter-static. So I see errors on the server side and an internal server 500 error on the client side when running locally. This shouldn't be happening if I was running a true SPA. When hosted on firebase, I get the errors only on the client side (there is no server side).

I'm also wondering if the load in layout.ts is forcing the call to __data.json, even though there's a fallback set.

This line appears from my debugging to be returning true once the app has been deployed to firebase: https://github.com/sveltejs/kit/blob/master/packages/kit/src/core/sync/write_client_manifest.js#L87

Which is used here:

kit/packages/kit/src/core/sync/write_client_manifest.js

Line 122 in 3c24450

export const server_loads = [${[...layouts_with_server_load].join(',')}];

Which leads to calling load_data here:

kit/packages/kit/src/runtime/client/client.js

Lines 823 to 829 in 3c24450

    
           const default_layout_has_server_load = app.server_loads[0] === 0; 
        
           if (default_layout_has_server_load) { 
        
           	// TODO post-https://github.com/sveltejs/kit/discussions/6124 we can use 
        
           	// existing root layout data 
        
           	try { 
        
           		const server_data = await load_data(url, [true]);

Which adds __data.json here:

kit/packages/kit/src/runtime/client/client.js

Line 1821 in 3c24450

data_url.pathname = add_data_suffix(url.pathname);

And then calls it.

eltigerchino Aug 3, 2023
Collaborator

Can you try adding static: true to your houdini.config.js file? I'm not sure what the side effects are but it seems Houdini is responsible for calling the fetch to /__data.json even when there is no root layout load function.

/// <references types="houdini-svelte">

/** @type {import('houdini').ConfigFile} */
const config = {
	watchSchema: {
		url: 'https://rickandmortyapi.com/graphql/',
	},
	plugins: {
		'houdini-svelte': {
+			static: true,
		},
	},
}

export default config

static (optional, default: false): A flag to remove the session infrastructure from your application

https://houdinigraphql.com/api/config

Answer selected by lukaso

lukaso Aug 3, 2023
Author

Yes, I've tried that. It made no difference, either locally or on the hosted version.

eltigerchino Aug 3, 2023
Collaborator

I'm not sure what else could be causing it. Adding the static config option caused the __data.json network requests to disappear in this repo (build then preview) https://stackblitz.com/edit/github-ekkchp

lukaso Aug 3, 2023
Author

Embarrassingly, the problem seems to have been that I put the static: true in the wrong place. It appears to be working now. Will report back if I can't get it to work on the more complex project.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

disable __data.json in SPA mode #10467

Uh oh!

{{title}}

Uh oh!

Replies: 1 comment 7 replies

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{editor}}'s edit

{{editor}}'s edit

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

Uh oh!

disable __data.json in SPA mode #10467

Uh oh!

lukaso Aug 1, 2023

Replies: 1 comment · 7 replies

Uh oh!

eltigerchino Aug 2, 2023 Collaborator

Uh oh!

Uh oh!

lukaso Aug 2, 2023 Author

Uh oh!

lukaso Aug 2, 2023 Author

Uh oh!

lukaso Aug 2, 2023 Author

Uh oh!

eltigerchino Aug 3, 2023 Collaborator

Uh oh!

lukaso Aug 3, 2023 Author

Uh oh!

eltigerchino Aug 3, 2023 Collaborator

Uh oh!

lukaso Aug 3, 2023 Author

lukaso
Aug 1, 2023

Replies: 1 comment 7 replies

eltigerchino
Aug 2, 2023
Collaborator

lukaso Aug 2, 2023
Author

lukaso Aug 2, 2023
Author

lukaso Aug 2, 2023
Author

eltigerchino Aug 3, 2023
Collaborator

lukaso Aug 3, 2023
Author

eltigerchino Aug 3, 2023
Collaborator

lukaso Aug 3, 2023
Author