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

 目录

问题摘要

解决办法

检验结果


问题摘要

  • 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.mzph.cn/news/47266.shtml

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

相关文章

Java基础知识题(五)

系列文章目录 Java基础知识题(一) Java基础知识题(二) Java基础知识题(三) Java基础知识题(四) Java基础知识题(五) 文章目录 系列文章目录 前言 一 Java的数据连接——JDBC 1. 简述什么是JDBC?重点 2. JDBC PreparedStatement比Statement有什么优势&…

Spring Boot

前言 什么是Spring Boot?为什么要学Spring Boot? Spring 的诞⽣是为了简化Java 程序的开发的,⽽Spring Boot 的诞⽣是为了简化Spring 程序开发 的。Spring就像汽车,相比以前人只能其自行车走路,汽车可以帮助人们更快…

git获取远端分支和merge

将远程分支拉取到本地 你可以使用以下命令: 1. 首先,使用git fetch命令从远程仓库获取最新的分支信息: git fetch origin 这个命令将会将远程仓库origin的分支信息下载到本地。 2. 接下来,可以使用git checkout命令切换到你想…

C# WPF ListBox 动态显示图片

前言 最近在和其他软件联合做一个本地图片选择传输功能,为此希望图片能够有序的呈现在客户端,简单的实现了一下功能,通过Mvvm模式进行呈现,过程简单通俗,话不多说直接上图。 处理过程 前台代码 你只需要粘贴到你的前台…

生物识别技术与身份认证:探讨生物识别技术在强化身份认证和访问控制方面的应用

第一章:引言 在数字化时代,随着信息技术的飞速发展,身份认证和访问控制变得越来越重要。传统的用户名和密码方式逐渐暴露出安全性不足的问题,为此,生物识别技术应运而生。生物识别技术利用人体生物特征来识别个体身份…

字符串哈希(线段树维护)

例题:https://acm.sdut.edu.cn/onlinejudge3/problems/4928ui​​​​​​ 第一种方式: 这一种做法就和正常的字符串哈希基本思想一样,都是h[r]h[l-1]*p[r-l1]; 我们这里是左高右低,故是hash[ l ]hash[ l ]*p[ r.len ]hash[ r …

第9步---MySQL的索引和存储引擎

第9步---MySQL的索引和存储引擎 1.索引 1.1分类 索引可以快速的找出具有特定值的行。不用从头开始进行寻找了。 类别 hash和btree hash 根据字段值生生成一个hash的值 快速的进行定位到对应的行的值 可能会出现相同的值,找到对应的空间会出现对应的值 btree树…

LTMC S/4HANA 2022 – 迁移您的数据

翻译一篇,估计很少人用过这个LTMC功能,更不用说,LTMOM了。一个还没开始用已经被弃用的事务代码: 在这篇博文中,我将解释如何在 S/4HANA 2022 版本中通过“迁移您的数据”应用程序逐步执行数据迁移。如您所知&#xff0…

5.7.webrtc线程的启动与运行

那在上一节课中呢?我向你介绍了web rtc的三大线程,包括了信令线程,工作线程以及网络线程。那同时呢,我们知道了web rtc 3大线程创建的位置以及运行的时机。 对吧,那么今天呢?我们再继续深入了解一下&#…

Redis分布式缓存

分布式缓存 -- 基于Redis集群解决单机Redis存在的问题 单机的Redis存在四大问题: 1.Redis持久化 Redis有两种持久化方案: RDB持久化 AOF持久化 1.1.RDB持久化 RDB全称Redis Database Backup file(Redis数据备份文件)&#x…

Certify The Web (IIS)

一、简介 Certify The Web 适用于 Windows的SSL 证书管理器用户界面,与所有 ACME v2 CA 兼容,为您的 IIS/Windows 服务器轻松地安装和自动更新来自 Letencrypt.org 和其他 ACME 证书授权机构的免费 SSL/TLS 证书,设置 https 从未如此简单。 …

【实用工具】磁盘被写保护怎么解除

磁盘被写保护怎么解除 我的是磁盘3无法写只能读,具体的执行步骤看下面 C:\Users\wsw>diskpartMicrosoft DiskPart 版本 10.0.19041.964Copyright (C) Microsoft Corporation. 在计算机上: SH-DB751B3DISKPART> list disk磁盘 ### 状态 大小 可…

JSON的处理

1、JSON JSON(JavaScript Object Notation):是一种轻量级的数据交换格式。 它是基于 ECMAScript 规范的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。 简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。易于人阅读和编写&#…

保研之旅1:西北工业大学电子信息学院夏令营

💥💥💞💞欢迎来到本博客❤️❤️💥💥 本人持续分享更多关于电子通信专业内容以及嵌入式和单片机的知识,如果大家喜欢,别忘点个赞加个关注哦,让我们一起共同进步~ &#x…

[PyTorch][chapter 49][创建自己的数据集 1]

前言: 后面几章主要利用DataSet 创建自己的数据集,实现建模, 训练,迁移等功能。 目录: pokemon 数据集深度学习工程步骤 一 pokemon 数据集介绍 1.1 pokemon: 数据集地址: 百度网盘路径: https://pan.baidu.com/s/1…

二、8.系统调用、可变参数和堆内存管理

系统调用:让用户进程申请操作系统的帮助 一个系统功能调用分为两部分, 一部分是暴露给用户进程的接口函数,它属于用户空间,此部分只是用户进程使用系统调用的途径,只负责发需求。另一部分是与之对应的内核具体实现&am…

C++day1(笔记整理)

一、Xmind整理&#xff1a; 二、上课笔记整理&#xff1a; 1.第一个c程序&#xff1a;hello world #include <iostream> //#:预处理标识符 //<iostream>:输入输出流类所在的头文件 //istream:输入流类 //ostream:输出流类using namespace std; //std&#x…

Goland 注释时自动在注释符号后添加空格

不得不说 JetBrains 旗下的 IDE 都好用&#xff0c;而且对于注释这块&#xff0c;使用 Ctrl / 进行注释的时候&#xff0c;大多会在每个注释符号后统一添加一个空格&#xff0c;比如 PyCharm 和 RubeMine 等。 # PyCharm # print("hello world") # RubyMine # req…

从Web 2.0到Web 3.0,互联网有哪些变革?

文章目录 Web 2.0时代&#xff1a;用户参与和社交互动Web 3.0时代&#xff1a;语义化和智能化影响和展望 &#x1f389;欢迎来到Java学习路线专栏~从Web 2.0到Web 3.0&#xff0c;互联网有哪些变革&#xff1f; ☆* o(≧▽≦)o *☆嗨~我是IT陈寒&#x1f379;✨博客主页&#x…

Python入门教程 | Python 基础语法

标识符 第一个字符必须是字母表中字母或下划线 _ 。标识符的其他的部分由字母、数字和下划线组成。标识符对大小写敏感。 在 Python 3中&#xff0c;可以用中文作为变量名&#xff0c;非 ASCII 标识符也是允许的了。默认情况下&#xff0c;Python 3 源码文件以 UTF-8 编码&am…