如何在 AWS S3 托管静态网站上配置重定向到 api？答案

【问题标题】：How configure redirect to api on AWS S3 hosting static website?如何在 AWS S3 托管静态网站上配置重定向到 api？
【发布时间】：2023-06-07 14:02:01
【问题描述】：

这个想法基本上是将调用 /api 重定向到某个来源。例如 ==> http://my-production-api.com/

我有我的 html 文件，

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Redirect - API</title>
	<script>
		const api = 'https://jsonplaceholder.typicode.com';

		fetch(api + '/todos/1')
			.then(response => response.json())
			.then(json => console.log(json)).catch(console.log);

		const ENV_API = '/api';

		fetch(ENV_API + '/todos/1')
			.then(response => response.json())
			.then(json => console.log(json)).catch(console.log);
	</script>
</head>

<body>
	<div id="app">
		Redirect api
	</div>
</body>

</html>

以及下一条路由规则：

<RoutingRules>
<RoutingRule>
    <Condition>
        <KeyPrefixEquals>/api</KeyPrefixEquals>
    </Condition>
    <Redirect>
        <ReplaceKeyWith>https://jsonplaceholder.typicode.com</ReplaceKeyWith>
    </Redirect>
</RoutingRule>

但是，控制台的结果是：加载资源失败：服务器响应状态为 403 (Forbidden)。

谢谢你回答我的问题！！

【问题讨论】：

/jsonplaceholder.typicode.com</HostName>
谢谢，@JamesDean
我可以解决：api/jsonplaceholder.typicode.com

标签： javascript amazon-web-services api amazon-s3 bucket

【解决方案1】：

我确实解决了：

<RoutingRules>
<RoutingRule>
<Condition>
    <KeyPrefixEquals>api/</KeyPrefixEquals>
</Condition>
<Redirect>
    <HostName>jsonplaceholder.typicode.com</HostName>
    <ReplaceKeyPrefixWith></ReplaceKeyPrefixWith>
</Redirect>
</RoutingRule>

【讨论】：