我过去使用过 sapper,并且多次使用过端点。因此,当我尝试尝试 sveltekit 时,我没想到会在发布到端点时遇到错误。我的设置很简单,我使用了 kit.svelte.dev 文档中的步骤来搭建一个框架项目。在我的 index.svelte 中,我添加了一个表单:
<form on:submit|preventDefault={submitit}>
<p>
<label>Name :
<input type="text" placeholder="name" aria-label="name" required bind:value={name}>
</label>
</p>
<p>
<label>Password :
<input type="password" placeholder="password" aria-label="password" required bind:value={password}>
</label>
</p>
<button type="submit">Submit</button>
</form>
在 src 文件夹内,添加 formdata.js 作为端点并添加以下代码:
export function post (request) {
let formfields = JSON.parse(request.body)
console.log("login.js name :", formfields.name)
console.log("login.js password", formfields.password)
return {
status : 200,
headers: {
'content-type': 'application/json'
},
body : {
message : "login form submitted the login credentials",
name : formfields.name,
password : formfields.password,
}
}
} //end post handle
回到我的index.svelte文件,我添加了submit fn:
<script>
let name
let password
async function submitit(){
console.log("name is :", name)
console.log("password is :", password)
let res = await fetch( 'formdata' ,{
method : "post",
headers: {
'content-type': 'application/json'
},
body : JSON.stringify({
name : "name",
password : "password"
})
})// fetch
let results = res.json()
return {
status : results.code,
body : results
}
} //submitit
</script>
当我在表单字段中输入任何内容并点击提交时,我收到以下错误日志:
"To access the request body use the text/json/arrayBuffer/formData methods, e.g. `body = await request.json()`. See https://github.com/sveltejs/kit/pull/3384 for details
at Object.get (file:///D:/mycode/2022/sveltekit/kittest/skeleton/.svelte-kit/runtime/server/index.js:2244:10)
at post (D:\mycode\2022\sveltekit\kittest\skeleton\src\routes\formdata.js:4:41)"
我向端点添加了异步,但没有帮助。
显然我的端点有问题或者可能需要更新某些内容。错误指出请求正文,但不清楚它是我的页面 -index.svelte- 还是我的端点 -formdata.js - 因此我们将不胜感激。
更新: 当我将端点更改为
let results = await request.json()
我在控制台中得到这个:
request.json is not a function
TypeError: request.json is not a function
at post (D:\mycode\2022\sveltekit\kittest\skeleton\src\routes\formdata.js:2:36)
at render_endpoint (file:///D:/mycode/2022/sveltekit/kittest/skeleton/.svelte-kit/runtime/server/index.js:117:25)
at async resolve (file:///D:/mycode/2022/sveltekit/kittest/skeleton/.svelte-kit/runtime/server/index.js:2299:10)
at async respond (file:///D:/mycode/2022/sveltekit/kittest/skeleton/.svelte-kit/runtime/server/index.js:2264:20)
at async file:///D:/mycode/2022/sveltekit/kittest/skeleton/node_modules/@sveltejs/kit/dist/chunks/index.js:238:24
Line must be greater than or equal to 1, got 0
TypeError: Line must be greater than or equal to 1, got 0
at BasicSourceMapConsumer.SourceMapConsumer_findMapping [as _findMapping] (D:\mycode\2022\sveltekit\kittest\skeleton\node_modules\vite\dist\node\chunks\dep-f5552faa.js:58887:13)
at BasicSourceMapConsumer.SourceMapConsumer_originalPositionFor [as originalPositionFor] (D:\mycode\2022\sveltekit\kittest\skeleton\node_modules\vite\dist\node\chunks\dep-f5552faa.js:58956:22)
at D:\mycode\2022\sveltekit\kittest\skeleton\node_modules\vite\dist\node\chunks\dep-f5552faa.js:59897:34
at String.replace (<anonymous>)
at D:\mycode\2022\sveltekit\kittest\skeleton\node_modules\vite\dist\node\chunks\dep-f5552faa.js:59885:21
at Array.map (<anonymous>)
at ssrRewriteStacktrace (D:\mycode\2022\sveltekit\kittest\skeleton\node_modules\vite\dist\node\chunks\dep-f5552faa.js:59884:10)
at Object.ssrFixStacktrace (D:\mycode\2022\sveltekit\kittest\skeleton\node_modules\vite\dist\node\chunks\dep-f5552faa.js:60382:36)
at Object.get_stack (file:///D:/mycode/2022/sveltekit/kittest/skeleton/node_modules/@sveltejs/kit/dist/chunks/index.js:244:14)
at render_response (file:///D:/mycode/2022/sveltekit/kittest/skeleton/.svelte-kit/runtime/server/index.js:1085:25)
我在文档中找到了这个,但我不知道它是什么意思或如何实现它: 您不能直接 require JSON 文件,因为 SvelteKit 期望 svelte.config.js 是一个 ES 模块。如果您想在应用程序中包含应用程序的版本号或 package.json 中的其他信息,您可以像这样加载 JSON:
最佳答案
错误在控制台,说明是在服务器端。
问题在于 request.body 与 Node 中的情况不同。请求/响应项实际上来自 Fetch API。
尝试改变
let formfields = JSON.parse(request.body)
至
let formfields = await request.json()
同样,在前端
res.json()
返回一个 Promise。
尝试等待:
let results = await res.json();
关于sveltekit 端点从页面发布错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70975944/