cors错误时，在节点JS pug模板中包含脚本时
我有一台Express Server，该服务器将PUG用作模板引擎。我正在尝试使用CDN添加尾风CSS，但我会收到这样的CORS错误：
错误：'https：//cdn.tailwindcss.com/'来自Origin'http：// localhost：3000'已被CORS策略阻止：no'cescess-control-wallo-allow-origin'header'http：// localhost：3000'header
错误：访问脚本是在请求的资源上存在的。
在我的哈哈模板中，这是我的基本文件，我尝试包括脚本：
html
head
block head
meta(charset='UTF-8')
meta(name='viewport' content='width=device-width, initial-scale=1.0')
link(rel='stylesheet' href='/css/style.css')
link(rel='shortcut icon' type='image/png' href='/img/favicon.png')
link(rel='stylesheet' href='https://fonts.googleapis.com/css?family=Lato:300,300i,700')
title A & N Tours | #{title}
body
// HEADER
include _header
// CONTENT
block content
h1 This is a placeholder heading
// FOOTER
include _footer
script(src="https://js.stripe.com/v3/" crossorigin="")
script(src='/js/bundle.js')
script(src="https://cdn.tailwindcss.com" crossorigin="" defer)
我的路由处理程序功能：
const tours = await Tour.find().limit(3);
res.status(200).render('homepage', {
title: 'Home',
topTours: tours
})
});
I have an express server which uses the PUG as a template engine. I am trying to add tailwind CSS using the cdn but I'm getting a cors error like this:
Error: Access to script at 'https://cdn.tailwindcss.com/' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
In my pug template this is my base file where I m trying to include the script:
html
head
block head
meta(charset='UTF-8')
meta(name='viewport' content='width=device-width, initial-scale=1.0')
link(rel='stylesheet' href='/css/style.css')
link(rel='shortcut icon' type='image/png' href='/img/favicon.png')
link(rel='stylesheet' href='https://fonts.googleapis.com/css?family=Lato:300,300i,700')
title A & N Tours | #{title}
body
// HEADER
include _header
// CONTENT
block content
h1 This is a placeholder heading
// FOOTER
include _footer
script(src="https://js.stripe.com/v3/" crossorigin="")
script(src='/js/bundle.js')
script(src="https://cdn.tailwindcss.com" crossorigin="" defer)
My route handler function:
const tours = await Tour.find().limit(3);
res.status(200).render('homepage', {
title: 'Home',
topTours: tours
})
});
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您从TailWindcss.com请求的资源不带CORS标题。但是因为
crossorigin = crossorigin =“属性，浏览器期望它们。如果您忽略此属性，问题就消失了，
您是否有设置属性的特殊原因？
以下HTML页面加载没有问题：
The resource that you request from tailwindcss.com does not come with CORS headers. But because of the
crossorigin=""attribute, the browser expects them.The problem goes away if you omit this attribute
Is there a particular reason why you set the attribute?
The following HTML page loads without problems: