将数据从FastAPI端点获取到苗条的前端应用程序

Question

我正在尝试用Svelte构建一个简单的应用程序来学习。

在我的FastAPI后端(main.py(中，我只是有一个端点hello:

@app.get("/hello")
async def hello():
return "Hello"

我有这样设置的中间件，所以应该允许来自svelte的请求：

origins = [
"http://localhost:5173",
"localhost:5173"
]
app.add_middleware(
CORSMiddleware,
allow_origins=origins,
allow_credentials=True,
allow_methods=["*"],
allow_headers=["*"]
)

在苗条的应用程序中，我有：

function getHello()
{
fetch("hello").then(d => d.text);
}
console.log("the hello message", getHello());

但我得到了：

the hello message undefined

我用一个类似的模板尝试过这个，我从反应useQuery中得到了一个似乎可以工作的模板。我想我可能把文件夹设置错了。

FastAPI在中/后端

svelte应用程序位于/my-app/src中，仅来自基本教程安装。

非常感谢任何关于尝试和设置的提示

Answer 1

用于获取数据的代码不能像这样工作。

• 函数不返回任何内容
• 调用代码(在log内部(不说明它是异步的

(此外，路径'hello'是相对的，因此这只适用于浏览器中正确的站点路径。(

如果路径正确并且服务器正常工作，代码应该更像这样：

function getHello() {
return fetch("hello").then(d => d.text);
}
getHello().then(text => console.log("the hello message", text));

可以使用替代的async函数或Svelte的{#await}指令。

(async () => {
console.log("the hello message", await getHello()));
})();

{#await getHello() then text}
{text}
{/await}