已阻止加载“http://localhost:8086/xxx.js”的模块,它使用了不允许的 MIME 类型 (“text/plain”)。

记录今天解决的一个小bug

在终端启动8080端口号监听后,打开网址http://localhost:8080,发现不能正确加载页面,打开检查-控制台,出现如下警告:已阻止加载"http://localhost:8086/xxx.js"的模块,它使用了不允许的 MIME 类型 ("text/plain")。

问题的根本原因是静态文件的 MIME 类型错误 。由于使用的是 Python 的 http.server 来提供文件,它默认将 .js 文件的 MIME 类型设为 text/plain,导致浏览器拒绝加载这些文件。

在网上找了一些方法试了没用,借助gpt,发现可以通过手动设置 Python 服务器的 MIME 类型,但是不太推荐。

1.创建如下代码,如a.py

python 复制代码
import http.server
import socketserver
import mimetypes

PORT = 8086
DIRECTORY = "."

class Handler(http.server.SimpleHTTPRequestHandler):
    def end_headers(self):
        self.send_header("Cache-Control", "no-store")
        super().end_headers()

    def guess_type(self, path):
        # Ensure .js files are served with the correct MIME type
        if path.endswith(".js"):
            return "application/javascript"
        return super().guess_type(path)

with socketserver.TCPServer(("", PORT), Handler) as httpd:
    print(f"Serving at port {PORT}")
    httpd.serve_forever()
  1. 进入a.py的目录,并运行这个脚本

python custom_http_server.py

3。重新打开浏览器,成功加载

相关推荐
codigger2 小时前
负载均衡到底在干嘛?7 个场景给你说明白
网络·架构·负载均衡
Thanks_ks3 小时前
HTTPS:浏览器地址栏那把锁的工作原理
http·网络安全·https·tls·加密算法·数字证书·中间人攻击
杨凯凡4 小时前
Spring Boot 大文件下载如何实现断点续传?HTTP Range、206 与 416 实战
spring boot·后端·http
吴建旭 智宅焕13 小时前
智能家居全国交付中执行端能力跃迁的架构设计:从标准装调到交付专家的系统化路径
网络·网络协议·智能家居
Eyfcom16 小时前
〖全球化架构 05〗跨国网络专线优化:QUIC 协议与 SD-WAN 在跨境传输中的实战
网络·架构·跨境物流快递系统·全球化架构
Dream Cosmos17 小时前
传输层协议之UDP
网络·网络协议·udp
梦到啥说啥20 小时前
Linux网络编程:UDP网络协议
linux·网络协议·udp
鸿蒙开发爱好者21 小时前
下班后做的小工具和小游戏,我把它们整理成了 WyanHub
网络·人工智能·职场和发展·个人开发
乐橙开放平台21 小时前
海康和大华摄像头能统一管理吗?可以通过 GB28181 或视频融合平台接入
网络·后端·物联网·音视频
FungLeo1 天前
成为全栈·Vue 管理后台篇·用 fetch 建一层可控的请求内核
前端·javascript·vue.js·http·fetch·formdata·接口封装