无法读取使用 Node.js 上传到 S3 存储桶的 css 文件

Question

我有一个 Node.js 应用程序，用于将 css 文件上传到 S3 以供我的网站使用。 一切似乎都运行良好，但是当我访问我网站上的文件时，没有应用任何 css 更改。 我什至可以在“开发工具/源”下看到 css 文件。 该文件中的 css 虽然没有生效。 如果我在开发工具中对文件进行任何更改，css 将立即开始所有工作。 如果我从 s3 下载文件然后手动重新上传它而不更改任何也有效的文件。 因此，与我添加带有 Node.js 的文件的格式有关的事情正在被抛弃。 对此的任何帮助将不胜感激。

 let globalStyles = `.header-background{background-color:${themeStyles['headerBackground']};} //using this to remove backticks from globalStyles globalStyles = globalStyles.replace(/^`|`$/g, ''); await addFileCssS3(css, `${newUrl}/global.css`, newUrl); const addFileCssS3 = async (file, key, newUrl) => { await s3.putObject({ Body: file, Bucket: BucketName, Key: key, ContentType: 'text/css', }).promise().catch((error) => { console.error(error) }) }

Answer 1

要解决此问题，您可以尝试在将换行符传递给addFileCssS3方法之前从globalStyles字符串中删除换行符。 有几种方法可以做到这一点，一种是简单地使用.trim()属性从字符串中删除任何前导和尾随空格。

例如：

globalStyles = globalStyles.trim();

或者，通过使用正则表达式从globalStyles字符串的末尾删除换行符：

globalStyles = globalStyles.replace(/\r?\n|\r/g, '');

第二种方法使用正则表达式，应该可以从 Windows 和 Linux 中删除换行符。

另一个可能的原因可能是对 function 的调用失败，将 CSS 重新插入到 html 页面，最终缺少此 function 导致下载的 CSS 无法使用。

如果这不能解决问题，我建议在上传到 S3 时检查 CSS 文件的 Content-Type header 以确保其设置正确。 还要检查 S3 存储桶权限或浏览器缓存参数是否配置为不允许使用更新后的 CSS。