Quantcast
Channel: Active questions tagged svelte - Stack Overflow
Viewing all articles
Browse latest Browse all 1545

Cannot read clientAddress during prerendering

$
0
0

I'm facing an issue with svelte prerender function : "...Cannot read clientAddress during prerendering"

I'm using SvelteKit v1.0.0-next.330 for my frontend, and I use strapi v4 for the back.My frontend is deployed on netlify and my back on heroku.

During the build process I have the following issue.

.svelte-kit/output/server/chunks/hooks-ac5d4bf3.js                               1.94 KiBError: Cannot read clientAddress during prerendering    at Object.getClientAddress (file:///Users/.../node_modules/@sveltejs/kit/dist/chunks/index2.js:1294:8)    at Object.get clientAddress [as clientAddress] (file:///Users/.../.svelte-kit/output/server/index.js:2110:22)    at __spreadValues (file:///.../.svelte-kit/output/server/chunks/hooks-ac5d4bf3.js:11:33)    at Object.handle (file:///.../.svelte-kit/output/server/chunks/hooks-ac5d4bf3.js:43:29)    at respond (file:///.../.svelte-kit/output/server/index.js:2146:42)> 500 /dashboard

In the load function of my /dashboard, I'm calling a fetch function with a relative path a .json.js endpoint. I think the issue is due to my fetch function.

try {            let res = await fetch('/dashboard/chart.json');...}

If in my svelte.config I set prerender to false, the build is ok.

const config = {    kit: {        adapter: adapter(),        vite: {            plugins: [isoImport()]        },        prerender: {            concurrency: 1,            crawl: true,            default: false,            enabled: false        }    }};

I tried changing the path to the file, to absolute path, but it's not working either.

I don't understand what's wrong, if you have any idea.

Thanks for your help

Fabien

UPDATE 1

Here is the load function within index@dashboard.svelte file

<script context="module">    export const load = async ({ fetch }) => {        try {            let res = await fetch('/dashboard/chart.json');            if (res.ok) {                // console.log(await res.json());                const {                    generateDatas,                    apexTableSummary,                    evolutions,                    apexQsTable,                    apexDonut,                    apexColBar,                    apexColBar2,                    apexColBar3,                    tableDatas                } = await res.json();                // console.log(generateDatas);                return {                    props: {                        datas: { ...generateDatas },                        prtRate: { ...apexTableSummary },                        sumData: { ...evolutions },                        qs: { ...apexQsTable },                        donut: { ...apexDonut },                        colBar: { ...apexColBar },                        colBar2: { ...apexColBar2 },                        colBar3: { ...apexColBar3 },                        tableDatas: { ...tableDatas }                    }                };            } else {                return {                    props: {                        datas: {},                        tables: {}                    }                };            }        } catch (error) {            return {                props: {                    datas: {},                    tables: {}                }            };        }    };</script>

Here the endpoint

// récupère les données des chartsimport { generateDatas, generateTablesDatas } from '$lib/dummy/chartDatas';import {    summaryLineDatas,    summaryTableDatas,    summaryDonutDatas,    summaryColDatas,    QSbyKeyword} from '$lib/dummy/chartApex';export const get = async () => {    return {        status: 200,        body: {            // lineChart,            generateDatas: generateDatas(),            evolutions: summaryLineDatas(20),            apexTableSummary: summaryTableDatas(                1,                3,                ['Campagne','Impressions','Impressions perdues (classement)','Impressions perdues (budget)'                ],                null,                ['#ff5d5d60', '#6c6ff560']            ),            apexQsTable: summaryTableDatas(                9,                3,                ['', 'Coûts', 'Impressions', 'Clics'],                null,                ['#ff5d5d60', '#6c6ff560'],                ['QS1', 'QS2', 'QS3', 'QS4', 'QS5', 'QS6', 'QS7', 'QS8', 'QS9', 'QS10']            ),            apexDonut: summaryDonutDatas(9, ['QS1','QS2','QS3','QS4','QS5','QS6','QS7','QS8','QS9','QS10'            ]),            apexColBar: summaryColDatas(                ['Inférieur', 'dans la moyenne', 'Supérieure à la moyenne'],                ['CTR', 'Pertinence annonce', 'Convivialité']            ),            apexColBar2: summaryColDatas(                ['Inférieur', 'dans la moyenne', 'Supérieure à la moyenne'],                ['CTR', 'Pertinence annonce', 'Convivialité']            ),            apexColBar3: summaryColDatas(                ['Inférieur', 'dans la moyenne', 'Supérieure à la moyenne'],                ['CTR', 'Pertinence annonce', 'Convivialité']            ),            tableDatas: QSbyKeyword({                nbrRow: 10,                labels: ['','Mot clé',"Campagne","Groupe d'annonce",'Url de destination','CPC moyen','Clics','Impressions','CTR','Coûts','Conversions','CPA (coût/conversions)','Note QS','CTR attendu',"Pertinence de l'annonce",'Convivialité de la page de destination'                ]            })        }    };};

Upadte 2

I've search few days and finally, I found something.What I did, is to set my https cookies logic within my register/login svelte file. When I've change it to do it within the hooks.js handle function, it solved about everything. Not sure if it is the right answer, but now I can build my project without any issue.

Thanks


Viewing all articles
Browse latest Browse all 1545

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>