TypeError Cannot read property ‘protocol‘ of undefined

最新推荐文章于 2021-10-14 15:52:56 发布
最新推荐文章于 2021-10-14 15:52:56 发布
阅读量493 收藏
点赞数 1
文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/HHW223/article/details/119667969
版权

TypeError: Cannot read property ‘protocol‘ of undefined

在写vue项目时爆出如下异常

TypeError: Cannot read property ‘protocol‘ of undefined

发生这个错误的具体具体原因是因为在main.js 中引用了axios，同时在其他的类中使用了axios的请求

解决方案

在main.js 中删除Vue.use(axios) 并添加下代码

Vue.prototype.http = axios;
韩宏伟
关注
Vue报错 TypeError Cannot read properties of undefined (reading ‘protocol‘)
geejkse_seff的博客
03-09 2716
Vue报错: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading ‘protocol’) 报错信息: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'protocol') at isURLSameOrigin (isURLSameOrigin.js?3934:57) at dispatchXh
axios：TypeError: Cannot read properties of undefined
qq_38432089的博客
03-31 4686
1、背景 从api获取数据，发现无法解析该json对象中的属性值。 以下是json数据的部分内容： {“content”: { “[{“id” : 1 ,\n “title” : “第一篇博客” ,\n “content” : “这是一篇美食博客，广州早茶的红米肠是我最喜欢的美食之一”,\n “type” : “food”\n}]”}} 2、解决 （1）打印数据类型，发现是string （2）转为object this.axios.get('这里是一个api').then(res=>{ /
TypeError: Cannot read property ‘protocol‘ of undefined
survivorsfyh的博客
03-19 1610
编写 Vue 项目的途中抛出了如下异常，简单记录小结一下： TypeError: Cannot read property ‘protocol‘ of undefined 具体原因出在了 main.js 中引用了 axios，同时在其它的类中使用了 axios 的请求； Vue.use(axios) 解决办法 main.js Vue.use(axios); // 删除该行配置 Vue.prototype.http = axios; 嗯。。搞定。。。 以上便是此次分享的全部内容，希.
Cannot read property ‘protocol‘ of undefined
liuarmyliu的博客
10-07 195
因为采用了外部写api文，在引用时如果写错了就会有这个问题，mark一下
Error in created hook (Promise/async): “TypeError: Cannot read property ‘protocol‘ of undefined“ 的解决
weixin_42047741的博客
04-03 1万+
Error in created hook (Promise/async): “TypeError: Cannot read property ‘protocol’ of undefined” 的解决办法 原因：axios请求中的错误 1.请求地址写错了 2.没有引入http.js 3.引入http的时候，单词拼错了，例如，$axios.get(uri.getCitie) // getCities少写个s等 ...
vue控制台报TypeError: Cannot read property ‘protocol‘ of undefined错误
hong
08-23 559
vue控制台报TypeError: Cannot read property ‘protocol’ of undefined错误 前两天搭建框架 引入axios后 前端刷新报出这个错误 看着很难受 解决了一下 原因是因为在main.js中引入axios时 语法有错误 错误代码如下 import axios from 'axios' Vue.use(axios) 正确代码 import axios from 'axios' Vue.prototype.$axios = axios; 效果图
Node中使用MySQL报错:TypeError: Cannot read property 'query' of undefined
weixin_30751947的博客
11-22 2979
Node中使用MySQL报错: TypeError: Cannot read property 'query' of undefined at /Users/sipeng/Desktop/彭思/2017年学习/Node/sampleEjs/sampleEjs/models/user.js:23:15 at Handshake.onConnect [as _callback...
TypeError: Cannot read property 'protocol' of undefined
09-09
在这种情况下，你正在尝试访问一个未定义的对象的 "protocol" 属性。请确保你正在操作的对象已经正确初始化，并且包含了你所期望的属性。你可以检查相关代码，确保对象正确地被创建和赋值。如果可能的话，提供更多的...
uniapp TypeError: Cannot read property 'protocol' of undefined
09-09
造成这个错误的原因可能是没有正确配置或传递必要的参数，导致无法读取未定义的属性。请检查以下几点： 1. 确保你的代码中没有任何拼写错误或语法错误。 2. 检查你的参数是否正确传递。特别是检查被调用的函数是否...
Cannot read property 'protocol' of undefined的原因和解决办法
weixin_30908103的博客
01-22 1万+
Cannot read property 'protocol' of undefined 原因：axios请求中的错误 1.请求地址写错了 2.没有引入http.js 3.引入http.js的时候，单词拼错了，例如，$axios.get(httpUrl.getUser) // getUsers少写个s等 转载于:https://www.cnblogs.com/luguankun/p/103...
Uncaught (in promise) TypeError: Cannot read property ‘protocol‘ of undefined
ownlight的博客
11-01 712
引入 axios 的错误 正确写法： import axios from 'axios' // Vue.use(axios); //错误写法 Vue.prototype.$http = axios;
Cannot read property 'protocol' of undefined！
liukai6的博客
09-14 4272
如果在使用vue和axios时,报这样的错误,看看是不是将vue.use(axios).这样是不对的,直接引入使用就可以了
vue报错TypeError: Cannot read property 'protocol' of undefined
weixin_30273175的博客
07-22 2300
错误信息如下所示： isURLSameOrigin.js?3934:57 Uncaught (in promise) TypeError: Cannot read property 'protocol' of undefined at isURLSameOrigin (isURLSameOrigin.js?3934:57) at dispatchXhrRequest (xhr.js...
浏览器报错：Uncaught (in promise) TypeError: Cannot read property ‘protocol‘ of undefined
m0_48570180的博客
10-14 4795
报错的代码如下所示： import axios from 'axios' import VueAxios from 'vue-axios' Vue.use(axios,VueAxios) 我们可以这样，加入语句： Vue.prototype.$axios=axios import axios from 'axios' import VueAxios from 'vue-axios' Vue.prototype.$axios=axios Vue.use(axios,VueAxios) ...
前端问题集（3）： Cannot read property ‘protocol‘ of undefined
Yooao的博客
06-27 714
Vue报错： Cannot read property 'protocol' of undefined，解决办法
控制台报错Cannot read property ‘protocol’ of undefined解决
热门推荐
CD52276的博客
06-19 1万+
浏览器控制台报错： ’ Cannot read property ‘protocol’ of undefined’ 截图： 报错.png 原因： 这个错是错误引入axios引起的 截图： 也就是说不能使用 Vue.use(axios); 引入 如何正确引入axios？ 看下面解决方法。 解决方法： 正确使用方法是 Vue.prototype.$axios = axios; 截图： 正确引入姿势.png ...
Vue报错 property protocol of undefined
天渺(喵)工作室
06-17 541
TypeError: Cannot read property 'protocol' of undefined 抱这种错 有两种可能 1.全局Axios https://blog.youkuaiyun.com/weixin_42707181/article/details/88688099 2.Axios 的http 请求地址有误 null 或者是undefined 大部分情况下 就是这两种情况 ...
hook.jsx:142 Uncaught (in promise) AxiosError {message: 'Request failed with status code 500', name: 'AxiosError', code: 'ERR_BAD_RESPONSE', config: {…}, request: XMLHttpRequest, …} code : "ERR_BAD_RESPONSE" config : {transitional: {…}, adapter: Array(3), transformRequest: Array(1), transformResponse: Array(1), timeout: 10000, …} isCancelRequest : false message : "Request failed with status code 500" name : "AxiosError" request : XMLHttpRequest onabort : &fnof; handleAbort() onerror : &fnof; handleError() onload : null onloadend : &fnof; onloadend() onloadstart : null onprogress : null onreadystatechange : null ontimeout : &fnof; handleTimeout() readyState : 4 response : "<!doctype html><html lang=\"en\"><head><title>HTTP Status 500 – Internal Server Error</title><style type=\"text/css\">body {font-family:Tahoma,Arial,sans-serif;} h1, h2, h3, b {color:white;background-color:#525D76;} h1 {font-size:22px;} h2 {font-size:16px;} h3 {font-size:14px;} p {font-size:12px;} a {color:black;} .line {height:1px;background-color:#525D76;border:none;}</style></head><body><h1>HTTP Status 500 – Internal Server Error</h1></body></html>" responseText : "<!doctype html><html lang=\"en\"><head><title>HTTP Status 500 – Internal Server Error</title><style type=\"text/css\">body {font-family:Tahoma,Arial,sans-serif;} h1, h2, h3, b {color:white;background-color:#525D76;} h1 {font-size:22px;} h2 {font-size:16px;} h3 {font-size:14px;} p {font-size:12px;} a {color:black;} .line {height:1px;background-color:#525D76;border:none;}</style></head><body><h1>HTTP Status 500 – Internal Server Error</h1></body></html>" responseType : "" responseURL : "http://localhost:8849/api/complaint/complaint-order/search" responseXML : null status : 500 statusText : "Internal Server Error" timeout : 10000 upload : XMLHttpRequestUpload {onloadstart: null, onprogress: null, onabort: null, onerror: null, onload: null, …} withCredentials : false [[Prototype]] : XMLHttpRequest response : config : {transitio
最新发布
03-19
### Axios 请求失败的状态码 500 错误解决方案 当遇到 Axios 请求返回 `status code 500` 的错误时，这通常表示服务器内部发生了一个未处理的异常或逻辑错误。以下是可能的原因以及对应的解决方法： #### 可能原因及解决办法 1. **服务器端代码存在 Bug** 如果服务器端代码中有未经捕获的异常或者逻辑错误，则可能导致 `500 Internal Server Error`[^1]。建议开发者检查服务器日志以定位具体问题。 2. **缺少必要的模块或依赖项** 在某些情况下，如果服务器环境中缺失了特定的模块或依赖项（例如引用中的 `[webpack-cli] Error: Cannot find module 'object.getownpropertydescriptors'`），也可能引发此错误[^2]。可以通过重新安装依赖来解决问题： ```bash npm install --save-dev object.getownpropertydescriptors ``` 3. **API 配置不正确** 当使用第三方服务（如 OpenAI API）并通过 Firebase Cloud Functions 提供接口调用时，若配置不当也会触发此类错误[^3]。需确认以下几点： - 是否正确设置了 API 密钥。 - 网络请求路径是否匹配官方文档说明。 - 数据传输格式是否满足目标服务的要求。 4. **前端框架集成问题** 对于基于 Vue.js 或其他现代 JavaScript/TypeScript 构建的应用程序，在设置 Axios 实例过程中可能出现参数传递失误等问题[^4]。下面是一个简单的 Axios 初始化示例： ```javascript import axios from 'axios'; const instance = axios.create({ baseURL: 'https://api.example.com', timeout: 1000, headers: { 'Authorization': 'Bearer YOUR_ACCESS_TOKEN' } }); export default instance; ``` 5. **环境差异引起的冲突** 开发阶段与生产部署之间的区别可能会造成兼容性障碍。比如调试模式下允许显示详尽报错详情而正式上线后关闭该功能(`app.UseExceptionHandler("/error")`)就属于这种情况之一。因此要确保两套环境尽可能一致并合理调整相应策略。 --- ### 总结 综上所述，针对 Axios 返回状态码为 500 的情况可以从多个角度出发排查根本原因，并采取相应的修复措施。务必重视服务器端的日志记录分析工作；同时也要注意前后端交互环节里各项设定的一致性和准确性。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值