\r\n\u003C/template>\r\n\r\n\u003Cscript setup>\r\nimport {fetchCategories, fetchLocations} from '~/services/home';\r\n\r\nconst categoriesRequest = ref({pending: true, error: null, data: null});\r\nconst locationsRequest = ref({pending: true, error: null, data: null});\r\n\r\nconst res = await Promise.all([fetchCategories(), fetchLocations({filter: 0})]);\r\n\r\nif (res[0].error.value || res[1].error.value) {\r\n showError(res[0].error.value || res[1].error.value);\r\n} else {\r\n categoriesRequest.value = res[0];\r\n locationsRequest.value = res[1];\r\n}\r\n\u003C/script>\r\n```\r\n\r\nnow let's see what are `fetchCategories` and `fetchLocations` functions\r\n\r\nservices/home.js\r\n```js\r\nimport {useEnv} from '~/utils/use-env';\r\n\r\nexport const fetchCategories = () => {\r\n const mainApi = useEnv('mainApi');\r\n\r\n return useFetch(\r\n `${mainApi}/homepage/categories`,\r\n {\r\n method: 'POST',\r\n server: true,\r\n }\r\n );\r\n};\r\n\r\nexport const fetchLocations = (payload = {}) => {\r\n const mainApi = useEnv('mainApi');\r\n\r\n return useFetch(\r\n `${mainApi}/homepage/locations`,\r\n {\r\n method: 'POST',\r\n body: payload,\r\n server: true,\r\n }\r\n );\r\n};\r\n```\r\n\r\nand this is the component we used in home page:\r\n\r\ncomponents/home/Index.vue\r\n```vue\r\n\u003Ctemplate>\r\n \u003Cdiv class=\"categories-wrapper\">\r\n \u003Cdiv\r\n v-for=\"category in categories\"\r\n :key=\"category.key\"\r\n @click=\"setActiveCategory(category.id)\"\r\n >\r\n {{ category.title }}\r\n \u003C/div>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n\u003Cscript setup>\r\nimport {fetchLocations} from '~/services/home';\r\n\r\nconst props = defineProps({\r\n categoriesRequest: {type: Object, required: true},\r\n locationsRequest: {type: Object, required: true},\r\n});\r\n\r\nconst categories = computed(() => {\r\n const items = [];\r\n\r\n if (props.categoriesRequest.data) {\r\n items.push(...props.categoriesRequest.data.items);\r\n }\r\n\r\n return [\r\n {\r\n id: 0,\r\n key: 'ALL',\r\n title: 'همه تورها',\r\n },\r\n ...items,\r\n ];\r\n});\r\n\r\nconst currentLocationsRequest = ref(props.locationsRequest);\r\n\r\nconst setActiveCategory = async (categoryId) => {\r\n currentLocationsRequest.value = await fetchLocations({filter: categoryId});\r\n};\r\n\u003C/script>\r\n```\r\n\r\n\r\n### Describe the bug\r\n\r\nwe are expecting `fetchCategories` and `fetchLocations` have been called in server side once and nothing else happens in client side.\r\nand when we click on each category element, `fetchLocations` should be called.\r\n\r\nbut this is not the behavior we actually see.\r\nwe see both function just have been called in client side.\r\nand this happens after upgrading nuxt from `3.0.0` to `3.2.2`.\r\nbefore that it worked fine.\r\nand i have to mention that this behavior happens only in production.\r\nif i change `setActiveCategory` to:\r\n```js\r\nconst setActiveCategory = async (categoryId) => {\r\n console.log(categoryId);\r\n};\r\n```\r\nit works fine again\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2064,2065,2066],{"name":2031,"color":2032},{"name":2054,"color":2055},{"name":2037,"color":2038},19292,"useFetch ssr not working when use same function in page setup and click event on an element after upgrade nuxt to 3.2.2 from 3.0.0","2023-04-05T07:47:53Z","https://github.com/nuxt/nuxt/issues/19292",0.65383166,{"description":2073,"labels":2074,"number":2083,"owner":1994,"repository":1994,"state":2019,"title":2084,"updated_at":2085,"url":2086,"score":2087},"### Environment\r\n\r\n------------------------------\r\n- Operating System: `Linux`\r\n- Node Version: `v16.14.2`\r\n- Nuxt Version: `3.2.0`\r\n- Nitro Version: `2.2.1`\r\n- Package Manager: `npm@7.17.0`\r\n- Builder: `vite`\r\n- User Config: `routeRules`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nReproduction repository: https://stackblitz.com/edit/github-45sxb2?file=app.vue\r\n\r\nTo create the situation with a render error:\r\n\r\n1. Start the application\r\n2. See that the page loads correctly\r\n3. Add `Hello {{ broken.stuff }}` as the content of the \u003Cdiv> element in the app.vue file.\r\n4. Press the refresh button of the stackblitz browser\r\n5. See that the error page is shown (Expected)\r\n6. Remove the error part in the \u003Cdiv> content\r\n7. Press the refresh button of the stackblitz browser\r\n8. See that the error page is still being shown and the server is still logging the error (Not expected). You can also see that the console.log statements are not triggering, suggesting the page is not invalidated and the error is still being served from the cache\r\n\r\nTo create the situation with a createError call\r\n\r\n1. Start the application\r\n2. See that the page loads correctly\r\n3. Adjust the url of the $fetch call to `https://httpbin.org/status/500`\r\n4. See that the page adjusts itself to the error state (Expected)\r\n5. Press the refresh button of the stackblitz browser (you may need to do this twice)\r\n6. See that the working old version of the page is shown (Not expected)\r\n7. Adjust the content in the \u003Cdiv> element to be `Hello 2`\r\n8. Refresh the browser\r\n9. See that the content from the server is showing \"Hello\", while the Vue client replaces it with \"Hello2\" (Not expected, the page is even still broken due to the 500 being loaded in from the adjusted $fetch call url), the page isn't even invalidated on the server.\r\n10. Adjust the url of the $fetch call to `https://httpbin.org/status/200`\r\n11. Press the refresh button of the stackblitz browser\r\n12. See that the state of step 9 still happens and the server still logs the error of the broken state\r\n\r\n\r\nIf you would remove the cache property from the nuxt.config.ts and repeat above steps, you would only see expected behavior.\r\n\r\n### Describe the bug\r\n\r\nIt seems that when using cache in a Nuxt application, invalidation of pages gets broken once an error has occurred. \r\nThis results in mixed behavior, depending on what the error was (see reproduction steps for two scenario's, but there may be more situation that this applies to or result in different unexpected behavior).\r\n\r\nThis results in the entire Nuxt application being unusable if the application requires a cache strategy. The Nuxt application will also no longer execute the logic within the route, and only serve pages from the cache.\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2075,2076,2077,2080],{"name":2031,"color":2032},{"name":2034,"color":2035},{"name":2078,"color":2079},"nitro","bfd4f2",{"name":2081,"color":2082},"upstream-bug","B60205",18926,"Nuxt application broken after any error occurred if using cache configuration","2023-03-06T14:44:35Z","https://github.com/nuxt/nuxt/issues/18926",0.65589446,{"labels":2089,"number":2092,"owner":1994,"repository":1994,"state":2019,"title":2093,"updated_at":2094,"url":2095,"score":2096},[2090,2091],{"name":2031,"color":2032},{"name":2034,"color":2035},11905,"Error on using useFetch","2023-01-19T15:58:28Z","https://github.com/nuxt/nuxt/issues/11905",0.65691257,{"description":2098,"labels":2099,"number":2102,"owner":1994,"repository":1994,"state":2019,"title":2103,"updated_at":2104,"url":2105,"score":2106},"### Environment\r\n\r\n- Operating System: `Darwin`\r\n- Node Version: `v18.18.0`\r\n- Nuxt Version: `3.7.4`\r\n- CLI Version: `3.9.0`\r\n- Nitro Version: `2.6.3`\r\n- Package Manager: `yarn@1.22.19`\r\n- Builder: `-`\r\n- User Config: `app`, `modules`, `components`, `nitro`, `runtimeConfig`\r\n- Runtime Modules: `@nuxtjs/tailwindcss@6.8.0`, `@nuxtjs/plausible@0.2.3`\r\n- Build Modules: `-`\r\n\r\n\r\n### Reproduction\r\n\r\n```\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003Ca @click=\"fetch('400')\"> 400 \u003C/a>\r\n \u003Ca @click=\"fetch('404')\"> 404 \u003C/a>\r\n \u003Ca @click=\"fetch('500')\"> 500 \u003C/a>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n\u003Cscript lang=\"ts\" setup>\r\n const runtimeConfig = useRuntimeConfig()\r\n async function fetch(url) {\r\n await useFetch(`${runtimeConfig.public.apiURL}/${url}`, {\r\n onRequest({ request, options }) {\r\n console.log('Inside onRequest')\r\n },\r\n onResponse({ request, response, options }) {\r\n console.log('Inside onResponse')\r\n },\r\n onResponseError({ request, response, options }) {\r\n console.log('Inside onResponseError')\r\n }\r\n })\r\n }\r\n\u003C/script>\r\n```\r\n\r\n### Describe the bug\r\n\r\nOn a server error, useFetch fired twice. In my code example, 400 and 404 work as expected, but on 500 the request is fired again. Here are the console.log messages from the code if you click on every anchor.\r\n\r\n```\r\nInside onRequest test.vue:16:16\r\nXHRGET\r\nhttp://127.0.0.1:8000/400\r\n[HTTP/1.1 400 Bad Request 13ms]\r\nInside onResponse test.vue:19:16\r\nInside onResponseError test.vue:22:16\r\n\r\nInside onRequest test.vue:16:16\r\nXHRGET\r\nhttp://127.0.0.1:8000/404\r\n[HTTP/1.1 404 Not Found 12ms]\r\nInside onResponse test.vue:19:16\r\nInside onResponseError test.vue:22:16\r\n\r\nInside onRequest test.vue:16:16\r\nXHRGET\r\nhttp://127.0.0.1:8000/500\r\n[HTTP/1.1 500 Internal Server Error 11ms]\r\nInside onResponse test.vue:19:16\r\nInside onResponseError test.vue:22:16\r\n\r\nInside onRequest test.vue:16:16\r\nXHRGET\r\nhttp://127.0.0.1:8000/500\r\n[HTTP/1.1 500 Internal Server Error 10ms]\r\nInside onResponse test.vue:19:16\r\nInside onResponseError test.vue:22:16\r\n```\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2100,2101],{"name":2031,"color":2032},{"name":2054,"color":2055},23457,"useFetch is fired twice if server returns with a 500 Error","2023-09-29T06:43:46Z","https://github.com/nuxt/nuxt/issues/23457",0.6590411,{"description":2108,"labels":2109,"number":2113,"owner":1994,"repository":1994,"state":2019,"title":2114,"updated_at":2115,"url":2116,"score":2117},"### Environment\n\n------------------------------\r\n- Operating System: `Darwin`\r\n- Node Version: `v16.16.0`\r\n- Nuxt Version: `3.0.0-rc.9`\r\n- Nitro Version: `0.5.1`\r\n- Package Manager: `yarn@1.22.15`\r\n- Builder: `vite`\r\n- User Config: `ssr`, `app`, `telemetry`, `build`, `modules`, `components`, `vueuse`, `runtimeConfig`, `vite`\r\n- Runtime Modules: `@vueuse/nuxt@9.2.0`, `@pinia/nuxt@0.4.0`\r\n- Build Modules: `-`\r\n------------------------------\n\n### Reproduction\n\nafter update project to v3.0.0-rc.9 problem inited\n\n### Describe the bug\n\nI use composable useFetch\r\n\r\n```\r\n[nuxt] [request error] [unhandled] [500] fetch failed ()\r\n at async $fetchRaw2 (/D:/project/node_modules/ohmyfetch/dist/chunks/fetch.mjs:131:20)\r\n at async /D:/project/.nuxt/dev/index.mjs:2411:20\r\n at async /D:/project/.nuxt/dev/index.mjs:2472:64\r\n at async /D:/project/.nuxt/dev/index.mjs:135:22\r\n at async /D:/project/node_modules/h3/dist/index.mjs:492:19\r\n at async nodeHandler (/D:/project/node_modules/h3/dist/index.mjs:438:7)\r\n at async ufetch (/D:/project/node_modules/unenv/runtime/fetch/index.mjs:9:17)\r\n at async $fetchRaw2 (/D:/project/node_modules/ohmyfetch/dist/chunks/fetch.mjs:131:20)\r\n at async Object.errorhandler [as onError] (/D:/project/.nuxt/dev/index.mjs:383:16)\r\n at async nodeHandler (/D:/project/node_modules/h3/dist/index.mjs:445:9)\r\n```\n\n### Additional context\n\nsame issue in ohmyfetch:\r\nhttps://github.com/unjs/ohmyfetch/issues/120\n\n### Logs\n\n_No response_",[2110,2111,2112],{"name":2031,"color":2032},{"name":2054,"color":2055},{"name":2037,"color":2038},14894,"Error occurs when enabling https on dev in Nuxt3","2023-01-19T17:41:57Z","https://github.com/nuxt/nuxt/issues/14894",0.6593195,["Reactive",2119],{},["Set"],["ShallowReactive",2122],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"g8Ua4HAleqiMs3wAz6c7KOPK3hSqenVrpRU-sKAJp0s":-1},"/nuxt/nuxt/24334"]