cross-domain - 推送的资源被下载两次并警告有关跨域
问题描述
我尝试使用 http/2 server-push 在 Laravel 网站中预加载一些资产。
<!-- Preload -->
<link href="/fonts/Logo.woff" as="font" type="font/woff" rel="preload" crossorigin>
<link href="/css/app.css" rel="preload" as="style" type="text/css" crossorigin>
<link href="/js/app.js" rel="preload" type="application/javascript" as="script" crossorigin>
<!-- Use -->
<link href="/css/app.css" rel="stylesheet">
<script type="module" src="/js/app.js"></script>
我正在使用中间件来设置链接头。
但是,脚本和字体被下载了两次(推送和正常请求)
他们都产生警告
“已找到‘ https://localhost/fonts/Logo.woff ’的预加载,但由于请求凭据模式不匹配而未使用。考虑查看 crossorigin 属性。”
“已找到‘ https://localhost/js/app.js ’的预加载,但未使用,因为请求凭据模式不匹配。考虑查看 crossorigin 属性。”
我试图crossorigin
从所有三个标签中删除,但这并没有解决问题。还尝试了不同的组合,例如crossorigin="use-credentials"
or crossorigin="anonymous"
。
解决方案
以防万一有人有同样的问题。Link HTTP-Header 必须包含字体/脚本的跨域,但不能包含 CSS/图像
推荐阅读
- c - C++11,用于处理不同版本的 C struct 版本的包装类
- amazon-cloudwatch - 如何让 CodeDeploy Blue/Green 为自定义指标创建 CloudWatch 警报?
- excel - Excel VBA:如何将粗体格式应用于“:”之前的所有单词?
- python - SpaCy lemmatizer 删除大写
- python - 如何构建指向已保存的 python 回溯的异常?
- python - 用glom怎么说“收集所有”?
- jquery - 如何将自定义参数传递给 jQuery AJAX 方法的回调方法?
- javascript - 尝试访问 hypixel api 中的“pricePerUnit”时,出现错误:TypeError: Cannot read property 'pricePerUnit' of undefined
- javascript - 如何让 Puppeteer 基于 page.$eval 函数在 PDF 中渲染 MathJax?
- javascript - 数据库中的数据未返回