javascript - 使用 JavaScript 从 AWS S3 读取 JSON
问题描述
我有这个指向 AWS S3 存储桶的链接,它会自动下载我需要的 JSON。澄清一下,JSON 不会显示在网页本身上。我想从我当前拥有的链接将数据加载到 JavaScript 中。我尝试过使用下面的功能,但没有奏效。URL 来自 AWS-transcribe。
function httpGetAsync(theUrl, callback)
{
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
callback(xmlHttp.responseText);
}
xmlHttp.open("GET", theUrl, true); // true for asynchronous
xmlHttp.send(null);
}
有谁知道如何从此 URL 获取 JavaScript 对象?
解决方案
您可以使用新的ES6 fetch API发送 HTTP 请求并解析字符串化的 JSON 响应。
1.使用ES2017 async-await
const url = `https://s3.us-west-2.amazonaws.com/aws-transcribe-us-west-2-prod/165208660162/16/asrOutput.json?X-Amz-Security-Token=FQoDYXdzEBkaDNEU%2BEwhAVoss9PKYyK3A2qPjQJuSJOukAWY%2BTcHUY8vJoq9xQdb2%2FwEYalKy2uDvgEo03cgqeGAp%2Bjg7WGLNi4nr%2Bv5K2yOYMNG1WNmjbC8pWWArkrgGwCr8%2FXLZCxgziieoi1nV9BToNYEaSXI%2BpUR2w50o1T7a%2FY%2FQkL6hBO%2BIr3%2Fr9KYtWk%2BvC5dJryzW%2BxuHjXVv3SP%2F3SsYrqMuFLgqWct3Msvo37or4S7IxGDg6wcFzutLLQ2RrNXXa77oZJ3C%2BLn7t%2FTmthj3IJXT%2F8%2FlNEYMGc6WUG6aEqC%2F3iQmq6Pg6HDNRYQytIg0OelRhBJ7PzF0spwssUo2ZnuuRQKu%2B%2BuFbnp1Ne2B9PNDDIRRQF1bHKydwRiI%2BfIBH%2FRk3SnFH6dzppvdQjjOlZQzaVYsEE4aWJZ1UA%2FGtZlwID%2FU301m3XjdNebnH%2FgeCCrRKs1U51obmXyXeNP0veCXzgFexrf6JApN7bRrBOpWNp%2BlBXXeHI0YPa07zL62JerTwbLmSXzxbqbMSjso0t2LygCWhvsKXry5gig06%2FtyuLf%2Fxi0GRKKrDlpR2Kg%2BHGE%2B1cCbxFT3jPaIZPy1ktScZpxMw89g0kojO7W1wU%3D&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Date=20180511T164920Z&X-Amz-SignedHeaders=host&X-Amz-Expires=900&X-Amz-Credential=ASIAJHSTNMRIX5LPMVVQ%2F20180511%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Signature=586c9c3f4a1a755757e8cd20e77fa1318cf769fce71d3167a885b209d56e537f`;
async function downloadObject(url) {
try {
const fetchResponse = await fetch(url);
return await fetchResponse.json();
} catch (err) {
console.error('Error - ', err);
}
}
downloadObject(url);
2.使用链式then
和catch
块
const url = `https://s3.us-west-2.amazonaws.com/aws-transcribe-us-west-2-prod/165208660162/16/asrOutput.json?X-Amz-Security-Token=FQoDYXdzEBkaDNEU%2BEwhAVoss9PKYyK3A2qPjQJuSJOukAWY%2BTcHUY8vJoq9xQdb2%2FwEYalKy2uDvgEo03cgqeGAp%2Bjg7WGLNi4nr%2Bv5K2yOYMNG1WNmjbC8pWWArkrgGwCr8%2FXLZCxgziieoi1nV9BToNYEaSXI%2BpUR2w50o1T7a%2FY%2FQkL6hBO%2BIr3%2Fr9KYtWk%2BvC5dJryzW%2BxuHjXVv3SP%2F3SsYrqMuFLgqWct3Msvo37or4S7IxGDg6wcFzutLLQ2RrNXXa77oZJ3C%2BLn7t%2FTmthj3IJXT%2F8%2FlNEYMGc6WUG6aEqC%2F3iQmq6Pg6HDNRYQytIg0OelRhBJ7PzF0spwssUo2ZnuuRQKu%2B%2BuFbnp1Ne2B9PNDDIRRQF1bHKydwRiI%2BfIBH%2FRk3SnFH6dzppvdQjjOlZQzaVYsEE4aWJZ1UA%2FGtZlwID%2FU301m3XjdNebnH%2FgeCCrRKs1U51obmXyXeNP0veCXzgFexrf6JApN7bRrBOpWNp%2BlBXXeHI0YPa07zL62JerTwbLmSXzxbqbMSjso0t2LygCWhvsKXry5gig06%2FtyuLf%2Fxi0GRKKrDlpR2Kg%2BHGE%2B1cCbxFT3jPaIZPy1ktScZpxMw89g0kojO7W1wU%3D&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Date=20180511T164920Z&X-Amz-SignedHeaders=host&X-Amz-Expires=900&X-Amz-Credential=ASIAJHSTNMRIX5LPMVVQ%2F20180511%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Signature=586c9c3f4a1a755757e8cd20e77fa1318cf769fce71d3167a885b209d56e537f`;
const successCb = (resp) => {
console.log(resp);
};
const errorCb = (err) => {
console.error('Error - ', err);
};
function downloadObject(url, successCb, errorCb) {
fetch(url)
.then(response => response.json())
.then(successCb)
.catch(errorCb);
}
downloadObject(url, successCb, errorCb);
推荐阅读
- c# - 我的 Teams 机器人如何与已知用户开始新的 1:1 聊天
- sapui5 - SAP UI5中的多次单击按钮
- typescript - 如何导入 index.d.ts 中定义的命名空间
- android - 无法将 Argumant 类型 ImageProvider 分配给 imageprovider
- sql - 无法在 powershell 脚本中的 SQL 查询中转义表名中的 $
- javascript - 表的 rowSelectionChange oEvent 中缺少 selectedIndex
- javascript - 根据下拉列表和单选选择切换一组 div 的条件
- python-3.x - 如何从我的 df 中排除 A 列和 B 列中前 4 位小数相等的行?
- html - 在同一页面上制作两种不同的列布局
- wine - 在 Linux 上使用 Wine 包装 Windows dll