无法从 html 文件中引用 javascript 文件
[英]Cannot reference javascript file from html file
问题描述
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Generic title</title>
<link rel="stylesheet" href="./stylesheets/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:300,400,700">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat&display=swap">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/css/pikaday.min.css">
</head>
Error in browser:
浏览器错误：
127.0.0.1/:1 Refused to load the script 'https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js' because it violates the following Content Security Policy directive: "script-src 'self'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
127.0.0.1/:1 Refused to load the script 'https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.js' because it violates the following Content Security Policy directive: "script-src 'self'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
127.0.0.1/:1 Refused to load the script 'https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/pikaday.min.js' because it violates the following Content Security Policy directive: "script-src 'self'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
I have the same issue referencing my own javascript files.我在引用我自己的 javascript 文件时遇到了同样的问题。 I'm using express for my backend.我在后端使用 express。 I am trying to avoid using 'unsafe-inline' 'unsafe-eval'.我试图避免使用'unsafe-inline''unsafe-eval'。 If I disable the CSP from helmet it functions fine, but again I would like to avoid this.如果我从头盔中禁用 CSP，它可以正常工作，但我想再次避免这种情况。
1 个解决方案
解决方案1
0 2021-12-12 18:29:20
I had helmet incorrectly configured, I was blocking the sources I was attempting to reference in the html tag.我的头盔配置不正确，我阻止了我试图在 html 标签中引用的源。 Doing something like做类似的事情
app.use(
helmet.contentSecurityPolicy({
directives: {
defaultSrc: ["'self'"],
scriptSrc: scriptSources,
scriptSrcElem: scriptSources,
styleSrc: styleSources,
connectSrc: connectSources,
}
})
);
instead where the constants have my sources defined in them allows me to safely use external javascript files without compromising my sites security相反，其中定义了我的源的常量允许我安全地使用外部 javascript 文件，而不会影响我的站点安全性
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.