解决nuxt框架刷新页面报错localStorage is not defined问题

于 2024-07-23 09:45:59 发布
阅读量338 收藏
点赞数 3
文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_79339277/article/details/140626873
版权

问题:页面渲染完了 数据也都赋值上去了都好好的 但是一刷新就会报错 xxx未定义 如:

答疑:

1.一般来说报这种错误就是 页面渲染完了 某个属性未定义但是却使用了 所以就会报错

2.我们这边使用的nuxt3框架 服务端渲染的 每次都是会报错

解决:

1.使用其他前端存储方式如:cookie sissonstok~等方式

2.这个最简单直接放到渲染后的函数里面就行了,但是会影响页面美观 会导致 图片各种东西排版一开始是乱的 等渲染完才会去赋值 我这个无所谓只是自己玩玩后面会改为服务器去动态

全栈小牛马
关注
nuxt 获取不到localStorage，使用cookie持久化
黄哈哈的博客
02-24 1233
nuxt项目中在store和plugins的js文件里使用localStorage会报错。1.安装 cookie-universal-nuxt。
关于nuxt不能使用localStorage和cookie
最新发布
qq_36821038的博客
03-14 721
服务端不能使用localStorage和cookie的解决方案
使用Nuxt重构已有Vue项目(Axios默认根域名、切换Vuetify字体、配置Mavon编辑器和常见异常解决localStorage/window/document is not defined)
"✧treasure mountain✧"
05-23 6768
近日用Vue写了个小项目 但由于Vue的特性 导致项目的SEO并不是很好 因此用Nuxt重构了该项目 对项目进行了一次优化 由于之前并没有相关的经验 因此遇到不少的坑 特此记录一下 一、概念 什么是Nuxt Nuxt.js是Vue.js的通用框架 常用来作服务器端渲染(Server Side Rendering 简称SSR) Vue适合用于开发SPA单页面应用 但因其数据绑定特性 导致爬虫只能爬取页面模板 并不能爬到渲染好的数据 不利于网站排名 对于公司内部网站等不需要排名的网站 可以不用SEO 但对于那些
nuxt localStorage is not defined
博哥的二进制世界
10-26 1615
nuxt localStorage is not defined
解决Nuxt.js 中 sessionStorage is not defined 问题
阿新的博客
11-07 3772
解决nuxt.js 中 sessionStorage is not defined 异常
Error in mounted hook: "ReferenceError: localStorage is not defined"的解决方案
热门推荐
HermitSun的博客
05-08 2万+
先说说问题背景。首先Vue肯定是没跑了，在这个项目中，我没有使用传统（也更加熟悉）的JavaScript，而是使用了TypeScript，同时引入了Mocha+Chai，结合官方推出的Vue Test Utils进行单元测试。Vue Test Utils好用是好用，但可能是因为还没有完全成熟，坑还是挺多的。回头写一篇介绍一下我的一些踩坑经验。 进入正题。首先引入dom-storage这个包，然后创...
Vue Nuxt.js 从LocalStorage读取数据报错
ardong16的博客
06-24 2210
1. 场景描述 在Nuxt.js中，适用axios从服务端获取数据data，为了优化本地访问速度，将data存储在locaStorage中。这样，当用户刷新页面是，优先加载本地数据，超过一定时限，删除本地data，再次从服务端获取。 实现代码如下： mounted () { // 加载函数 this.readOrCreateLocal() }, methods: { // 请求函数 queryAll () { const result = axios.get(
universal-storage-module:Nuxt.js的通用存储实用程序
05-13
Nuxt通用存储模块 基于Nuxt.js通用存储实用程序 设置 使用yarn或npm将@nuxtjs/universal-storage依赖项添加到您的项目中 yarn add @nuxtjs/universal-storage 或者 npm install @nuxtjs/universal-storage --save ...
sessionStorage is not defined
09-02
- *1* [解决Nuxt.js 中 sessionStorage is not defined 问题](https://blog.csdn.net/WIK_7264/article/details/127738038)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source...
Nuxt - asyncData / fetch 请求数据控制台报错 Cannot read properties of undefined (reading ‘data‘) 也可能报其他未定义
王佳斌
07-08 3934
今天初次配置并使用 asyncData / fetch 请求异步数据时，发现控制台报了一个错误（如题），当时一看懵了，这哪有什么 `data` 不存在啊，于是将矛头指向了该页面组件的 `data` 与模板，发现并首先，您必须确保请求路径及跨域等配置正常，并且能正常在 钩子中请求。因为 请求在 服务端完成请求！！！，其环境并没有 window / document 等对象，当遇到这些 “无法识别” 的对象时，就会抛出这个错误（如题）。所以您的请求配置那块，如果用到了相关对象或语法，请使用环境变量判断一下。
nuxt.js 刷新页面报错 （ Failed to execute ‘appendChild‘ on ‘Node‘: This node type does not support this ）
qq_32486011的博客
11-22 1601
把页面上的的 v-if 都改成 v-show 试试 说明说一下：可能出现找个问题的情况很多，这是其一，仅作参考
angular：ERROR ReferenceError: localStorage is not defined
Cloud Flower的博客-专注unity
05-28 377
注意在可能使用localStorage 的地方，需要判断是Server环境返回默认值。使用localStorage时，ssr会报错。
Next.js ReferenceError: localStorage is not defined
宏斌的博客
08-28 1785
axios.interceptors.request.use((config: AxiosRequestConfig) => { if (typeof window !== "undefined") { config.headers.Authorization = getLocalJWT(); } return config; });
Angular 服务器端渲染应用的一个错误消息 type ReferenceError - localStorage is not defined
Web_boom的博客
07-29 348
只需从AppServerModule的providers中添加来自@ng-web-apis/universal包的UNIVERSAL_LOCAL_STORAGE，并通过令牌LOCAL_STORAGE，这样就能获得服务器的localStorage实现。例如，在服务器端渲染模式下，开发人员不能像在客户端渲染环境下那样，直接访问全局文档对象。不要通过全局空间使用浏览器API，而是通过DI来替换或禁用浏览器实现，以便在服务器上安全使用这些API.额外的属性已从组件中移除。...
Nuxt报错
weixin_33725239的博客
05-02 487
新增了个文件store.js: //本地存储的工具库 if(!window.localStorage){ alert('你的浏览器不支持localStorage'); } var store ={ setItem(key,value){ window.localStorage.setItem(key,JSON.stringify(value)); }, getIt...
nuxt 刷新报Window 或 Document未定义解决方案
MYuanFang的博客
08-26 650
首页我们明白问题的来源，页面跳转是没问题的，当我们刷新页面才会出来，我们知道nuxtjs是做服务端渲染的，他有很多声明周期是运行在服务端的，以及正常的vue声明周期mounted之前均是在服务端运行的，那么服务端是没有比如window对象的location、navagitor等，以及H5的FormData()方法，所以当你在created之前使用这些时，会报错，那么如何处理呢？ 首页定义然后在mounted中赋值 ...
localStorage is not defined的解决方案
wy_Blog的博客
09-12 2万+
localStorage.setItem('id_token', JSON.parse(response.data)) 报错： http://eslint.org/docs/rules/no-undef 'localStorage' is not defined localStorage.setItem('id_token', JSON.parse(response.data)) ^
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值