使用Svelte Kit Actions实现表单提交时遇405错误求助

排查并修正以下关键问题：

• 表单缺少提交触发入口：你的+page.svelte中没有提交按钮，导致表单无法正确触发POST请求，需添加<button type="submit">提交</button>。

• request.formData调用错误：request.formData是异步方法，必须用await调用才能获取到表单数据，原代码仅打印方法引用，修正后才能正常获取数据。

• 表单label属性错误：phone对应的label的for属性误写为name，会影响表单可访问性，需修正为phone。

• 确认文件路径与命名：确保+page.server.ts与+page.svelte同处于/form目录下，文件名拼写完全正确（区分大小写，不可出现+Page.server.ts这类错误命名）。

• 排查路由冲突：/form目录下不可存在+server.ts这类文件，否则会优先拦截请求，导致Actions无法触发。

修正后的完整代码示例：

/form/+page.server.ts #

import type { Actions } from './$types';

export const actions: Actions = {
  contact: async ({ request }) => {
      const formData = await request.formData();
      console.log('表单数据:', formData);
      // 可在此添加表单验证、数据存储等后续逻辑
  },
} satisfies Actions;

/form/+page.svelte #

<form method="POST" action="?/contact" class="w-full">
  <div>
    <label for="name">name</label>
    <input id="name" name="name" />
  </div>
  <div>
    <label for="email">email</label>
    <input id="email" name="email" />
  </div>
  <div>
    <label for="phone">phone</label>
    <input id="phone" name="phone" />
  </div>
  <button type="submit">提交</button>
</form>

内容的提问来源于stack exchange，提问作者Diego Hernandez Ureño