>  Q&A  >  본문

Netlify 양식을 사용하여 404를 얻습니다(VueJs 3 + Vite + VueRouter + Netlify)

<p>내 ContactView.vue 页面中有此表单 <code>src/views/ContactView.vue</code> : 我想谢消息 <code>src/views/SuccessView.vue</code></p> <pre class="brush:php;toolbar:false;"><양식 이름="문의 양식" 액션="/성공" 메소드="POST"; data-netlify="true"; data-netlify-honeypot="bot-field"> <입력 유형="숨김" name="연락처 양식" value="문의 양식" /> <div class="grid md:grid-cols-2 md:gap-6"> <div class="상대 z-0 w-전체 mb-6 그룹"> <입력 유형="텍스트" name="first_name" id="floating_first_name" 클래스 = "블록 py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-pine Appearance-none 포커스:개요-없음 포커스:ring-0 포커스 :border-bubblegum Peer" 자리 표시자=" " 필수 /> <label for="first_name" class="peer-focus:font-medium 절대 텍스트-sm text-gray-500 지속 시간-300 변환 -translate-y-6 scale-75 top-3 -z-10 원점-[0] 피어-초점:왼쪽 -0 피어-초점:text-bubblegum 피어-자리 표시자-표시:scale-100 피어-자리 표시자-표시:translate-y-0 피어-초점:scale-75 피어-초점:-translate-y-6>첫 번째 이름 </div> <div class="상대 z-0 w-전체 mb-6 그룹"> <입력 유형="텍스트" 이름="성_이름" id="floating_last_name" 클래스 = "블록 py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-pine Appearance-none 포커스:개요-없음 포커스:ring-0 포커스 :border-bubblegum Peer" 자리 표시자=" " 필수 /> <label for="last_name" class="peer-focus:font-medium 절대 텍스트-sm text-gray-500 지속 시간-300 변환 -translate-y-6 scale-75 top-3 -z-10 원점-[0] 피어-초점:왼쪽 -0 피어-초점:text-bubblegum 피어-자리 표시자-표시:scale-100 피어-자리 표시자-표시:translate-y-0 피어-초점:scale-75 피어-초점:-translate-y-6>마지막 이름 </div> </div> <div class="상대 z-0 w-전체 mb-6 그룹"> <입력 유형="이메일" 이름="이메일" id="floating_email" 클래스 = "블록 py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-pine Appearance-none 포커스:개요-없음 포커스:ring-0 포커스 :border-bubblegum Peer" 자리 표시자=" " 필수 /> <label for="이메일" class="peer-focus:font-medium 절대 텍스트-sm text-gray-500 지속 시간-300 변환 -translate-y-6 scale-75 top-3 -z-10 원점-[0] 피어-초점:왼쪽 -0 피어-초점:text-bubblegum 피어-자리 표시자-표시:scale-100 피어-자리 표시자-표시:translate-y-0 피어-초점:scale-75 피어-초점:-translate-y-6>이메일 주소</라벨> </div> <div class="상대 z-0 w-전체 mb-6 그룹"> <텍스트 영역 유형="텍스트" 이름="텍스트 영역" id="floating_ext_area" 클래스 = "블록 py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-pine Appearance-none 포커스:개요-없음 포커스:ring-0 포커스 :border-bubblegum Peer" 자리 표시자=" " 필수 /> <label for="텍스트 영역" class="peer-focus:font-medium 절대 텍스트-sm text-gray-500 지속 시간-300 변환 -translate-y-6 scale-75 top-3 -z-10 원점-[0] 피어-초점:왼쪽 -0 피어-초점:text-bubblegum 피어-자리 표시자-표시:scale-100 피어-자리 표시자-표시:translate-y-0 피어-초점:scale-75 피어-초점:-translate-y-6>귀하의 메시지</라벨> </div> <버튼 유형="제출" 클래스="text-white bg-bubblegum hover:bg-cherry focus:ring-4 focus:outline-none focus:ring-cotton-candyfont-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center">제출</button> <p>여기에 있는 가이드와 관련 포럼의 모든 가이드를 따랐지만 아무도 나를 도와줄 수 없었습니다. </p> <p>이 기사를 읽었지만 제게는 효과가 없는 것 같습니다. </p> <p>대부분의 가이드와 튜토리얼에서는 "공개" HTML의 뼈대로서 정확한 HTML 복제본을 언급하므로 index.html에서도 비슷한 작업을 수행했습니다</p> <pre class="brush:php;toolbar:false;"><body> <form netlify netlify-honeypot="bot-field" 숨겨진 이름="contact-form" value="POST" action="/success" > <입력 유형="텍스트" 이름="이름" <입력 유형="텍스트" 이름="성명" <입력 유형="이메일" 이름="이메일" <텍스트 영역 이름="텍스트 영역"></textarea> <버튼 유형="제출"></버튼> </양식> <div id="app"></div> <스크립트 유형="모듈" src="/src/main.js"></script> </body></pre> <p><code>random-netlify-name-784120.netlify.app</code>에서 양식을 작성한 후 바로 작성하려고 하면 다음 응답과 함께 검은색 화면이 나타납니다. < <p>모든 일을 원활하게 진행하려면 어떻게 해야 하나요? </p>
P粉564301782P粉564301782412일 전421

모든 응답(1)나는 대답할 것이다

  • P粉470645222

    P粉4706452222023-09-03 10:33:53

    성공하셨나요? 비슷한 문제가 있었는데 action='/success/' 매개변수를 제거하고 Netlify가 해당 페이지로 리디렉션되도록 해야만 문제를 해결할 수 있었습니다...

    Custom Ajax도 작동하지 않습니다. '/'에 대한 가져오기가 404를 반환하기 때문입니다...

    아직 사용자 정의 페이지나 사용자 정의 핸들러에서 실행 중입니다...뭔가를 찾으면 다시 게시하겠습니다.

    (저는 Vite + React + Netlify를 사용하고 있습니다.) 라우터 패키지가 없습니다... 내 vite.config.tsvite.config.ts

    中获得一个 pages/success에서 pages/success 페이지를 얻을 수 있습니다. 으아악

    회신하다
    0
  • 취소회신하다