我在自己的API后面抽象了一个API，它是通过我的HTML页面上的JavaScript函数调用的。API 调用返回一段数据 (JSON(。现在我想导航到另一个页面，该页面显示返回的数据。如何将 API 调用返回的数据传递到新页面？或者，只是将链接传递给新站点并让它自己进行 API 调用不是更好吗？但话又说回来，如何将某些内容传递给我的新网站？
这是我使用 JavaScript 函数调用的 HTML：
<!doctype html>
<head>
<meta charset="utf-8">
<title>Homepage</title>
</head>
<body>
<script src="equity-frontend.js"></script>
<div id="div1">
<form>
<label for="equity">Equity</label>
<input type="text" name="equity" id="equity">
<button onclick="sendRequest();return false">Get Data</button>
</form>
</div>
<div id="target">
</div>
</body>
</html>
这就是 JavaScript 文件：
'use strict'
let baseUrl = 'http://localhost:3000/equities';
async function sendRequest() {
let equity = document.getElementById('equity').value;
let equityEndpoint = makeRequest(equity);
callEndpoint(equityEndpoint).then(
response => {
let responseArr = [];
for (let [key, value] of Object.entries(response['_links'])) {
let resObj = {};
resObj['key'] = key;
resObj['value'] = value['href'];
responseArr.push(resObj);
}
let resDiv = document.createElement("div");
for (let i = 0; i < responseArr.length; i++) {
let btn = document.createElement('BUTTON');
btn.innerHTML = JSON.stringify(responseArr[i].key);
btn.onclick = function () {
callEndpoint(baseUrl + responseArr[i].value)
.then(response => {
const tsDiv = document.createElement('div');
const resP = document.createElement('p');
resP.innerHTML = JSON.stringify(response);
tsDiv.appendChild(resP);
document.body.insertBefore(tsDiv, resDiv)
});
}
resDiv.appendChild(btn);
resDiv.appendChild(document.createElement("br"));
}
let currentDiv = document.getElementById("div1");
document.body.insertBefore(resDiv, currentDiv);
}
);
}
function makeRequest(equity) {
let equityEndpoint = baseUrl + '/' + equity;
return equityEndpoint;
}
async function callEndpoint(endpointUrl) {
const response = await fetch(endpointUrl, {
method: 'GET',
});
let data = await response.json();
return data;
}
我想象在调用我的 API 后类似回调的东西(伪代码(
callEndpoint(baseUrl + responseArr[i].value)
.then(response => showResultPage(URL, response))
这将从响应中接收数据并导航到结果.html，但我不知道该怎么做。
谢谢:)
您可以将数据存储在 SessionStorage、LocalStorage 或 cookie 中，并在下一页中读取。
或者你使用像ngrx/store这样的高级东西。
希望对您有所帮助。