WebStrom 自带console调试js：NETWORK_ERR: XMLHttpRequest Exception 101

最新推荐文章于 2023-09-07 23:31:21 发布
最新推荐文章于 2023-09-07 23:31:21 发布
阅读量4k 收藏 1
点赞数
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/catoldcui/article/details/8982376
本文介绍如何解决在WebStorm中调试JavaScript时遇到的跨域问题。具体表现为NETWORK_ERR:XMLHttpRequestException101错误，这是因为浏览器限制了文件间的跨域调用。文章提供了解决方案，即通过向Chrome添加启动参数来允许跨域访问。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

WebStrom 自带console调试js：NETWORK_ERR: XMLHttpRequest Exception 101

浏览器不允许网页跨域使用js，就是当前网站只能使用当前目录下的及子目录下的文件。

不能使用和根目录同级或者更高的目录。

可在浏览器启动时加上命令：

百度到 chrome是  chrome.exe --allow-file-access-from-files


CatoldCui
关注
network_err xmlHttpRequestException 101 解决方案
changNet的专栏
04-28 6986
手机客户端请求webview 网页，出现 network_err xmlHttpRequestException 101   解决方案一、   如果是手机客户端嵌套的WebView 页面 这时候检查你的jsp 页面里面是否用到异步交互的框架。例如DWR框架。 如果用到DWR框架，DWR内部设定的安全机制，不允许跨域的操作。这是候你可以将Dwr框架访问后台数据的方式改变一下。
webstorm设置测试服务器 -- 局域网内其他设备访问（localhost变更为ip地址查看）
晓时不眠的博客
04-18 1399
一、为什么设置成服务器，用IP地址查看？ 移动端的开发页面想要在手机端查看，使用localhost是无法查看的只有使用IP地址才可以通过本机IP访问该页面，查看页面效果 二、设置方法 1、查看本机 IP 地址 调出cmd命令行，输入ipconfig ，获取本机ip地址：192.168.1.100 2、设置 webstorm 选项 ① 弹出设置选项卡 : File ->Settings... ② 端口更改和允许外部：更改端口号“63342”为“8081”，并“√”可以接受外部链接.
ajax networkerror,ajax - NETWORK_ERROR: XMLHttpRequest Exception 101 - Stack Overflow
weixin_42128393的博客
08-06 271
Another modern method of solving this problem is Cross Origin Ressource Sharing.HTML5 offers this feature. You can "wrap" your XMLhttp request in this CORS_request andif the target browser supports th...
前后端交互：前端发不出去请求，控制台的Network无反应
m0_54630400的博客
03-08 6553
1、问题解析： 在发请求之前，请求拦截器可以检测到，在请求发出去之前做一些事情，说明在请求拦截器中请求被拦截了，但是不会出现报错。 2、解决方法： 检查自己的请求拦截器中是否有错误，导致请求被拦截。 ...
介绍一下主流的浏览器的开发者工具(js调试和查看网络请求）
伟庭师兄的博客
09-07 1298
​ （这里咱以axios为例） ■ 在Request Headers 默认看到的仅有请求头，点击一下，就可以看到请求行和(请求方式、请求路径、协议下面)请求头□ 当请求方式是get时，请求体拼接在请求路径url上 □ 当请求方式是post时，请求体在■ 同样，在Response Headers 默认看到的仅有响应头，点击一下，就可以看到响应行和(协议、响应状态码下面)响应头□ 想看响应体，直接点击 （这里咱依然是以axios为例，axios请求成功有一个then方法，调用then方法，打印一下请求
前端后端协作：共同应对ERR_HTTP_RESPONSE_CODE_FAILURE的策略
[前端后端协作：共同应对ERR_HTTP_RESPONSE_CODE_FAILURE的策略](https://user-images.githubusercontent.com/22513657/231147121-b8b54ba7-2b62-4b9a-84ab-ac9ddf635207.png) # 1. ERR_HTTP_RESPONSE_CODE_FAILURE...
GET http://localhost:8081/ask?question=%E4%BD%A0%E6%98%AF%E8%B0%81 500 (Internal Server Error) dispatchXhrRequest @ xhr.js:190 xhr @ xhr.js:28 dispatchRequest @ dispatchRequest.js:53 _request @ Axios.js:176 request @ Axios.js:54 Axios.<computed> @ Axios.js:198 wrap @ bind.js:9 sendQuestion @ index.js??clonedRuleSet-40.use[0]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/views/ChatComponent.vue?vue&type=script&lang=js:31 invokeWithErrorHandling @ vue.runtime.esm.js:2945 invoker @ vue.runtime.esm.js:1835 original_1._wrapper @ vue.runtime.esm.js:7063 显示另外 11 个框架 收起 index.js??clonedRuleSet-40.use[0]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/views/ChatComponent.vue?vue&type=script&lang=js:45 请求失败: AxiosError {message: 'Request failed with status code 500', name: 'AxiosError', code: 'ERR_BAD_RESPONSE', config: {…}, request: XMLHttpRequest, …} sendQuestion @ index.js??clonedRuleSet-40.use[0]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/views/ChatComponent.vue?vue&type=script&lang=js:45 await in sendQuestion（异步） invokeWithErrorHandling @ vue.runtime.esm.js:2945 invoker @ vue.runtime.esm.js:1835 original_1._wrapper @ vue.runtime.esm.js:7063 显示另外 4 个框架 收起 WebSocketClient.js:49 WebSocket connection to 'ws://10.20.145.51:8080/ws' failed:
04-01
| WebSocket | 协议头与端口 | 浏览器开发者工具 > Network | | 跨域问题 | `Access-Control-Allow-Origin`头 | 检查HTTP响应头 | | 代码逻辑 | 异常捕获完整性 | 添加`try...catch`块 | 通过以上步骤逐步排查，可...
Access to XMLHttpRequest at ‘http://localhost:8080/login’ from origin ‘http://localhost:5173’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Login.vue:81 POST http://localhost:8080/login net::ERR_FAILED dispatchXhrRequest @ xhr.js:195 xhr @ xhr.js:15 dispatchRequest @ dispatchRequest.js:51 Promise.then _request @ Axios.js:163 request @ Axios.js:40 httpMethod @ Axios.js:226 wrap @ bind.js:5 (匿名) @ Login.vue:81 validateField @ form.vue:133 await in validateField validate @ form.vue:98 login @ Login.vue:79 callWithErrorHandling @ runtime-core.esm-bundler.js:199 callWithAsyncErrorHandling @ runtime-core.esm-bundler.js:206 emit @ runtime-core.esm-bundler.js:6386 (匿名) @ runtime-core.esm-bundler.js:8099 handleClick @ use-button.ts:61 callWithErrorHandling @ runtime-core.esm-bundler.js:199 callWithAsyncErrorHandling @ runtime-core.esm-bundler.js:206 invoker @ runtime-dom.esm-bundler.js:729 request.js:63 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading ‘status’) at request.js:63:24 at async Axios.request (Axios.js:40:14) at Axios.request (Axios.js:45:41) vue3与spring Boot3项目添加Jwt权限验证,在无登录状态的情况下为什么登陆页面点击登陆进不去了
03-27
console.error('Network Error:', error.message); return Promise.reject({ status: 0, message: '网络连接异常' }); } return Promise.reject(error); } ); ``` 2. **检查请求头配置** 确保登录请求未...
前端有问题后端在// 验证版本号 int currentVersion = versionService.getVersion(username); if (tokenVersion != currentVersion) { log.warn("令牌版本不匹配: {} != {}", tokenVersion, currentVersion); return ResponseEntity.status(498).build(); // 自定义失效状态码 }返回以后前端弹出视频加载失败: MEDIA_ERR_SRC_NOT_SUPPORTED - 不支持的视频格式，按道理来说我们在这里应该重新请求令牌，设置视频源跳转到指定进度位置正常播放视频的，前端我是根据你提供的代码修改的，你提供的前端业务代码：$(function () { // ...（原有变量声明和初始化保持不变）... // 新增状态变量 let currentPosition = 0; // 当前播放位置(毫秒) let isSeeking = false; // 是否正在跳转中 // 获取视频访问令牌（不包含位置参数） function fetchVideoToken() { $ loadingOverlay.show(); $ tokenStatus.text('获取中...').removeClass('bg-success bg-danger').addClass('bg-warning'); return new Promise((resolve, reject) => { $.ajax({ url: `${config.apiBaseUrl}/token`, method: 'POST', dataType: 'json', contentType: 'application/json', data: JSON.stringify({ videoId: config.videoId }), // 不包含位置参数 }) .done(function (res) { isPremium = res.isPremium; localStorage.setItem('isPremium', res.isPremium); $ tokenStatus.text('已获取').removeClass('bg-warning').addClass('bg-success'); resolve(res.token); }) .fail(reject); }); } // 加载视频流（不包含位置参数） function loadVideoStream(token) { resetVideoState(); $ loadingOverlay.show(); // 构造视频流URL（不包含位置参数） const streamUrl = `${config.apiBaseUrl}/play/${config.videoId}?token=${encodeURIComponent(token)}`; setVideoSource($ video, streamUrl); } // 安全跳转处理（核心机制保留） $ video[0].addEventListener('seeking', async function() { if (isSeeking) return; isSeeking = true; // 记录跳转目标位置 const targetPosition = this.currentTime; try { // 刷新令牌 const newToken = await fetchVideoToken(); // 保存当前播放状态 const wasPlaying = !this.paused; const currentVolume = this.volume; // 重新加载视频流 loadVideoStream(newToken); // 新视频加载完成后跳转到目标位置 $ video.on('loadeddata', function handler() { $ video.off('loadeddata', handler); $ video[0].currentTime = targetPosition; $ video[0].volume = currentVolume; if (wasPlaying) attemptPlay($ video); isSeeking = false; }); } catch (error) { console.error('跳转失败:', error); // 回退到跳转前位置 $ video[0].currentTime = currentPosition; isSeeking = false; } }); // 初始化播放位置追踪 $ video.on('timeupdate', function() { currentPosition = this.currentTime; }); // 自定义错误处理（保留令牌刷新机制） $ video.on('error', function(e) { const errorCode = e.target.error?.code; // 令牌失效错误处理 if (errorCode === 498) { fetchVideoToken().then(newToken => { loadVideoStream(newToken); $ video[0].currentTime = currentPosition; $ video[0].play(); }); } // ...其他错误处理保持不变... }); // 会员状态变更处理（保留） window.addEventListener('membershipChanged', () => { fetchVideoToken().then(newToken => { loadVideoStream(newToken); $ video[0].currentTime = currentPosition; $ video[0].play(); }); }); });
07-09
我们遇到的问题是：后端返回498状态码（令牌版本不匹配）时，前端出现视频加载失败错误（MEDIA_ERR_SRC_NOT_SUPPORTED），而不是预期的重新请求令牌并恢复播放。 原因分析： 1. 后端返回498时，视频流请求会返回...
HLS的入门总结
laker的博客
02-21 2843
HLS 全称是 HTTP Live Streaming， 是一个由 Apple 公司实现的基于 HTTP 的媒体流传输协议。通过将整条流切割成一个小的可以通过 HTTP 下载的媒体文件，然后提供一个配套的媒体列表文件，提供给客户端，让客户端顺序地拉取这些媒体文件播放, 来实现看上去是在播放一条流的效果。其基于 Media Source Extensions 开发，用于实现 HTTP Live Streaming 开源JavaScript类库。
你真的会使用XMLHttpRequest吗？
weixin_33885676的博客
01-17 3773
看到标题时，有些同学可能会想：“我已经用xhr成功地发过很多个Ajax请求了，对它的基本操作已经算挺熟练了。” 我之前的想法和你们一样，直到最近我使用xhr时踩了不少坑儿，我才突然发现其实自己并不够了解xhr，我知道的只是最最基本的使用。于是我决定好好地研究一番xhr的真面目，可拜读了不少博客后都不甚满意，于是我决定认真阅读一遍W3C的X...
ajax networkerror,ajax – NETWORK_ERROR：XMLHttpRequest异常101
weixin_31110741的博客
08-06 534
我得到这个错误NETWORK_ERROR: XMLHttpRequest Exception 101当尝试从一个站点获取XML内容。这里是我的代码var xmlhttp;if(window.XMLHttpRequest){xmlhttp = new XMLHttpRequest();}if (xmlhttp==null){alert ("Your browser does not support ...
cef webview创建浏览器，实现ajax异步加载数据异常 NETWORK_ERROR: XMLHttpRequest Exception 101...
02-26 494
错误代码： web = new WebView("https://www.baidu.com/", new BrowserSettings()); web.Dock = DockStyle.Fill; web.LoadCompleted += (o, e) => { ...
jquery对ajax的error内的XMLHttpRequest返回的exception获取里面的信息
weixin_33749131的博客
10-08 1744
var params = $("form").serialize(); $.ajax({ type:"POST", url:"www.xxxxxx.com", data:params, d...
Chrome Extension实战：页面JS脚本替换
热门推荐
夏天夏天悄悄过去留下小眯眯
06-30 1万+
前不久有这样一个想法：怎么把第三方页面所有的GET/POST请求，重定向到我们自己的后台服务器上，然后返回一些假冒数据？
Chrome中XMLHttpRequest请求失败问题解决
ZDX_Y的博客
07-07 9319
在学习XMLHttpRequest和XML过程中，出现了XML内的数据无法显示的问题，F12调试后找到浏览器报出如下错误：“Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.”
项目材料、分包、项目经理比选管理流程.docx
最新发布
08-07
项目材料、分包、项目经理比选管理流程.docx
该项目是基于JavaWeb开发的网上商城购物系统，主要实现了购物车、结算和订单管理的功能，适合Java Web初学者学习使用 （该项目还处于完善阶段，今后会不定时进行更新）
08-07
资源下载链接为： https://pan.quark.cn/s/a3bd6adf8f4f 该项目是基于JavaWeb开发的网上商城购物系统，主要实现了购物车、结算和订单管理的功能，适合Java Web初学者学习使用。（该项目还处于完善阶段，今后会不定时进行更新）（最新、最全版本！打开链接下载即可用！）
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值