gpt4 book ai didi

javascript - 使用 fetch 获取页面设置

转载 作者:行者123 更新时间:2023-12-03 18:53:16 25 4
gpt4 key购买 nike

我很犹豫要不要问这个问题。我的问题有很多答案,但它们不涉及 <script>标签和普通的 HTML 和 javascript。所以这里...
这是我的场景的最小复制。 (我的真实场景涉及缩小的第三方脚本,这超出了我的技能或理解范围,但需要配置。)
index.html

<!DOCTYPE html>
<html>
<head>
<title>Test App</title>
</head>
<body>
<script src="setup-configuration.js"></script>
<script src="do-something.js"></script>
<p>Test Text</p>
</body>
</html>
设置配置.js
config = 'Not Set Yet';

fetch('config.json')
.then(response => response.json())
.then(json => config = json)
.catch( error => console.error('error:', error) );
做某事.js
console.log(config)
config.json
{
"SomeSetting": "SomeValue"
}
这里的问题是对 console.log(config) 的调用使用 config设置之前的变量。这(当然)是因为 fetch 调用使用了 Promise 并且是异步的。通常,我只是将依赖代码作为 promise 链的一部分。但我基本上需要我所有的应用程序等待这个脚本来获取配置代码。 ( do-somthing.js 脚本实际上是几个非常复杂的第 3 方脚本,我没有机会修改它们以在一个文件中工作。)
我原来用的是同步的 XMLHttpRequest调用,但我的 chrome 调试工具警告说我做错了,它将从 future 版本的 javascript 中删除。
因此,我想知道一个 <script> 的值如何标签可以用在另一个 <script>通过 fetch 检索时的标记。有没有办法在 <script> 之间链接 promise ?标签?

最佳答案

我一直在做这种事情一段时间(因为我如何构建我的网站)。
要走的路是只有1个脚本标签。这将负责链接脚本和其他具有依赖关系的代码
使您的配置脚本看起来像这样:

let head = document.getElementsByTagName('head')[0];
function script(src) {
return new Promise(res=> {
let e = document.createElement('script');
e.src = src;
e.onload = res;
head.appendChild(e);
});
}
let config;
fetch('config.json').then(r=>r.json()).then(j=>config=j).then(()=> {
script('s1.js'); script('s2.js');
}) ;
网址是 https://www.sharember.com

关于javascript - 使用 fetch 获取页面设置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66470656/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com