【快速解决方案】浏览器的安全策略不允许通过 file:// 协议直接加载外部文件(最省事的方法)

news2024/11/16 1:37:29

 目录

问题摘要

解决办法

检验结果


问题摘要

  • Failed to load resource: net::ERR_FILE_NOT_FOUND
  • 🌈 Cute Code Editor 🌈.html:162 Fetch API cannot load file:///D:/%E6%A1%8C%E9%9D%A2/%E4%B8%83%E5%A4%95%E5%BF%AB%E4%B9%90/index.txt. URL scheme "file" is not supported.
  • 🌈 Cute Code Editor 🌈.html:168 Error loading text content: TypeError: Failed to fetch
        at window.onload (🌈 Cute Code Editor 🌈.html:162)

解决办法

这个错误是因为浏览器的安全策略不允许通过 file:// 协议直接加载外部文件,包括 index.txt。你需要在一个 web 服务器上运行你的代码,以便能够通过 HTTP 协议加载文件。

你可以使用简单的方法来启动一个本地的 web 服务器,例如使用 Python 的内置模块来启动一个简单的服务器。下面是如何在终端中使用 Python 来启动一个 web 服务器:

  1. 打开终端。
  2. 转到包含你的 "🌈 Cute Code Editor 🌈" 文件的目录。可以使用 cd 命令来切换到目录,例如:
cd /path/to/your/cute-code-editor-directory

在该目录下运行以下命令来启动一个简单的 web 服务器:

python -m SimpleHTTPServer 8000

或者,如果你使用的是 Python 3.x,可以运行:

python -m http.server 8000

现在,你可以在浏览器中访问 http://localhost:8000/🌈%20Cute%20Code%20Editor%20🌈.html,然后你应该能够看到你的 "🌈 Cute Code Editor 🌈" 页面,并且 "index.txt" 文件的内容应该会逐字加载到 HTML 区域中。

检验结果

 成功了这里我已经可以正常导入文件中的数据了。

我这里运行的时候不卡,直接就可以打开,很顺利,但如果你的网页打开卡的话可以换以下的方法:

考虑远程服务器,可以直接把文件上传的GitHub上,然后就可以顺利打开了(略*从根本上解决问题) 

本章的内容就到这里了,觉得对你有帮助的话就支持一下博主把~

这是我的GitHub网址,感兴趣的话可以给我个star✨嘛

🌌点击下方个人名片,交流会更方便哦~
↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/909161.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

RK3399平台开发系列讲解(内核调试篇)内核中内存泄漏的调试

🚀返回专栏总目录 文章目录 一、Linux 内核内存泄漏二、如何观测内核内存泄漏?三、kmemleak 工具沉淀、分享、成长,让自己和他人都能有所收获!😄 📢 内核内存泄漏往往都会是很严重的问题,那么,我们该如何判断内存泄漏是否是内核导致的呢? 一、Linux 内核内存泄漏 …

003-Nacos 2.1.x 注册实例源码分析

目录 Nacos 2.1.X注册实例入口接口流程Client 注册 事件处理 服务订阅入口 Nacos 2.1.X 注册实例 入口 com.alibaba.nacos.naming.remote.rpc.handler.InstanceRequestHandler#handleService service Service.newService(request.getNamespace(), request.getGroupName(), r…

计算机网络————IP数据报的首部各字段详解(很重要)

目录 1. IP数据报的介绍2. 首部的固定部分的各字段说明2.1 Version(版本)2.2 IHL(首部长度)2.3 Type of service(区分服务)2.4 Total Length(总长度)2.5 Identification(…

企业级即时通讯协作和移动应用管理平台哪个品牌好?

在竞争激烈的商业环境下,高效的企业通讯和协作变得至关重要。WorkPlus作为领先的品牌,专注于提供企业级即时通讯协作和移动应用管理平台。本文将介绍WorkPlus如何成为企业实现协同工作、高效沟通和流程管理的理想解决方案。 一、全面协作加速工作流程&am…

二、1.保护模式

访问外部硬件有两个方式: 将某个外设的内存映射到一定范围的地址空间中, CPU 通过地址总线访问该内存区域时会落到外设 的内存中,这种映射让 CPU 访问外设的内存就如同访问主板上的物理内存一样外设是通过 IO 接口与 CPU 通信的,…

BDA初级分析——民宿投资决策影响因素分析

实战作业: 民宿投资决策影响因素分析如今,出门旅行住民宿已经不是一个新鲜话题,而且民宿品牌也是层出不穷.作为一名旅行服务业的数据分析师,我们以Airbnb北京的民宿为例,对其进行数据分析,探索什么类型的民宿价格更高?…

Eltima USB Network Gate 10.0 Crack

USB Network Gate -通过网络共享USB 设备 USB Network Gate (前身为以太网USB控制器USB) 轻松的通过网络(Internet/LAN/WAN)分享您的一个或者多个连接到您计算机的USB设备。 无论您身处异国还是近在隔壁办公室,您都可以轻松使用远程扫描仪、打印机、摄像头、调制解…

从零构建深度学习推理框架-9 再探Tensor类,算子输入输出的分配

再探Tensor类&#xff1a; 第二节中我们编写的Tensor类其实并不能满足我们的使用需要&#xff0c;我们将在这一节以代码阅读的方式来看看一个完全版本的Tensor应该具备怎样的要素&#xff0c;同时我们对Tensor类的分析来看看在C中一个设计好的类应该是怎么样的。 Tensor<fl…

K8s学习笔记3

Kubernetes功能&#xff1a; Kubernetes是一个轻便的可扩展的开源平台&#xff0c;用于管理容器化应用和服务。通过Kubernetes能够进行应用的自动化部署和扩缩容。在Kubernetes中&#xff0c;会将组成应用的容器组合成一个逻辑单元以更易管理和发现。Kubernetes积累了作为Goog…

打怪升级之从零开始的网络协议

序言 三个多月过去了&#xff0c;我又来写博客了&#xff0c;这一次从零开始学习网络协议。 总的来说&#xff0c;计算机网络很像现实生活中的快递网络&#xff0c;其最核心的目标&#xff0c;就是把一个包裹&#xff08;信息&#xff09;从A点发送到B点去。下面是一些共同的…

面试-快速学习计算机网络-UDP/TCP

1. OSI四层和七层映射 区别&#xff1a; 应用层&#xff0c;表示层&#xff0c;会话层合并为了应用层数据链路层和物理层合并为了网络接口层 2. TCP和UDP的区别&#xff1f; 总结&#xff1a; 1 . TCP 向上层提供面向连接的可靠服务 &#xff0c;UDP 向上层提供无连接不可靠服…

验证二叉搜索树

给你一个二叉树的根节点 root &#xff0c;判断其是否是一个有效的二叉搜索树。 有效 二叉搜索树定义如下&#xff1a; 节点的左子树只包含 小于 当前节点的数。节点的右子树只包含 大于 当前节点的数。 所有左子树和右子树自身必须也是二叉搜索树。 示例 1&#xff1a; 输…

8.21summary

计划部分完成&#xff0c;复习暂未完成

Linux环境下交叉编译环境安装、编译和运行

Win11主机上安装虚拟机&#xff0c;虚拟机内运行Ubuntu20.04&#xff0c;为了能够在本地电脑&#xff08;Win11&#xff09;上开发测试软件和算法&#xff0c;最终将编译好的可执行文件拷贝到Linux板上&#xff08;Rk3288上运行linux系统&#xff09;运行&#xff0c;因此需要安…

【QML】鼠标放在控件上颜色改变的效果实现

最近刚好要用到一个功能&#xff0c;在qml上实现鼠标放上去&#xff0c;控件的颜色改变&#xff0c;鼠标移走&#xff0c;控件颜色恢复。第一反应是这个功能非常简单&#xff0c;但是搞了一会儿都没实现&#xff0c;最后发现MouseArea其实提供了一个很简便的方法来提供使用&…

马蹄集 第九次oj赛

目录 MT2188单条件和 8421码 余3码 永恒之2 新十六进制 人脑计算机 二进制&#xff1f;不同&#xff01; 三进制计算机1 三进制计算机2 excel的烦恼 MT2188单条件和 号难度&#xff1a;黄金© 时间限制&#xff1a;1秒 巴占用内存&#xff1a;128M ★收藏△报错 “单…

MemSeg:一种差异和共性来检测图像表面缺陷的半监督方法

目录 1、摘要 2、Method 2.1 模拟异常样本 2.2 Memory Module 2.3 空间注意模块 2.4 多尺度特征融合模块 2.5 损失函数设置 2.6 Decoder模块 1、摘要 本文认为人为创建类内差异和保持类内共性可以帮助模型实现更好的缺陷检测能力&#xff0c;从而更好地区分非正常图像。如…

蓝蓝设计UI设计公司-界面设计与开发案例

天津航天中为项目 中国南方电网十二个软件交互优化和界面设计 图标设计 | 交互设计 | 界面设计 天津航天中为数据系统科技有限公司是航天503所控股的专业化公司&#xff0c;坐落于天津滨海新区航天技术产业园&#xff0c;是航天五院家入住天津未来科技城的军民融合型企业&…

el-tree组件图标的自定义

饿了么树形组件的图标自定义 默认样式: 可以看到el-tree组件左侧自带展开与收起图标,咱们可以把它隐藏:: .groupList {::v-deep .el-tree-node { .el-icon-caret-right {display: none;} } } 我的全部代码 <div class"groupList"><el…

韩顺平java集合

遍历集合方式: public static void main(String[] args) {List<Object> arrayList new ArrayList<>();arrayList.add(1);arrayList.add(3);arrayList.add(111);Iterator<Object> iterator arrayList.iterator();while (iterator.hasNext()){System.out.pri…