Gunakan borang netlify untuk mendapatkan 404 (VueJs 3 + Vite + VueRouter + Netlify)
P粉564301782
2023-09-02 15:59:41
<p>我的 ContactView.vue 页面中有此表单 <code>src/views/ContactView.vue</code> ：
我想重定向到自定义页面，感谢消息 <code>src/views/SuccessView.vue</code></p>
<pre class="brush:php;toolbar:false;"><form name="contact-form" tindakan="/berjaya" kaedah="POST" data-netlify="benar" data-netlify-honeypot="bot-field">
<jenis input="tersembunyi" name="borang hubungan" value="borang hubungan" />
<div class="grid md:grid-cols-2 md:gap-6">
<kelas div="relatif z-0 w-kumpulan mb-6 penuh">
<jenis input="teks" name="nama_pertama" id="floating_first_name" class="sekat py-2.5 px-0 w-teks penuh-sm teks-kelabu-900 bg-sempadan lutsinar-0 sempadan-b-2 sempadan-penampilan pain-tiada fokus:garis besar-tiada fokus:fokus cincin-0 :sempadan-bubblegum rakan sebaya" pemegang tempat=" " diperlukan />
<label untuk="nama_pertama" class="peer-focus:font-medium absolute text-sm text-grey-500 duration-300 transform -terjemah-y-6 skala-75 atas-3 -z-10 asal-[0] rakan-fokus:kiri -0 fokus rakan sebaya:teks-bubblegum pemegang tempat rakan sebaya-ditunjukkan:skala-100 pemegang tempat rakan sebaya-ditunjukkan:terjemah-y-0 fokus rakan sebaya:skala-75 fokus rakan sebaya:-terjemah-y-6">Pertama nama</label>
</div>
<kelas div="relatif z-0 w-kumpulan mb-6 penuh">
<jenis input="teks" name="last_name" id="nama_akhir_terapung" class="sekat py-2.5 px-0 w-teks penuh-sm teks-kelabu-900 bg-sempadan lutsinar-0 sempadan-b-2 sempadan-penampilan pain-tiada fokus:garis besar-tiada fokus:fokus cincin-0 :sempadan-bubblegum rakan sebaya" pemegang tempat=" " diperlukan />
<label untuk="last_name" class="peer-focus:font-medium absolute text-sm text-grey-500 duration-300 transform -terjemah-y-6 skala-75 atas-3 -z-10 asal-[0] rakan-fokus:kiri -0 fokus rakan sebaya:teks-bubblegum peer-placeholder-ditunjukkan:skala-100 peer-placeholder-ditunjukkan:terjemah-y-0 fokus rakan sebaya:skala-75 fokus rakan sebaya:-terjemah-y-6">Terakhir nama</label>
</div>
</div>
<kelas div="relatif z-0 w-kumpulan mb-6 penuh">
<jenis input="e-mel" nama="e-mel" id="e-mel_terapung" class="sekat py-2.5 px-0 w-teks penuh-sm teks-kelabu-900 bg-sempadan lutsinar-0 sempadan-b-2 sempadan-penampilan pain-tiada fokus:garis besar-tiada fokus:fokus cincin-0 :sempadan-bubblegum rakan sebaya" pemegang tempat=" " diperlukan />
<label untuk="e-mel" class="peer-focus:font-medium absolute text-sm text-grey-500 duration-300 transform -terjemah-y-6 skala-75 atas-3 -z-10 asal-[0] rakan-fokus:kiri -0 peer-focus:teks-bubblegum peer-placeholder-ditunjukkan:skala-100 peer-placeholder-ditunjukkan:terjemah-y-0 peer-focus:skala-75 peer-focus:-terjemah-y-6">E-mel alamat</label>
</div>
<kelas div="relatif z-0 w-kumpulan mb-6 penuh">
<jenis textarea="teks" name="textarea" id="kawasan_luar_terapung" class="sekat py-2.5 px-0 w-teks penuh-sm teks-kelabu-900 bg-sempadan lutsinar-0 sempadan-b-2 sempadan-penampilan pain-tiada fokus:garis besar-tiada fokus:fokus cincin-0 :sempadan-bubblegum rakan sebaya" pemegang tempat=" " diperlukan />
<label untuk="textarea" class="peer-focus:font-medium absolute text-sm text-grey-500 duration-300 transform -terjemah-y-6 skala-75 atas-3 -z-10 asal-[0] rakan-fokus:kiri -0 peer-focus:text-bubblegum peer-placeholder-ditunjukkan:skala-100 peer-placeholder-ditunjukkan:terjemah-y-0 peer-focus:skala-75 peer-focus:-terjemah-y-6">Anda Mesej</label>
</div>
<jenis butang="serahkan" kelas="teks-putih bg-bubblegum hover:bg-ceri fokus:ring-4 fokus:garis-tiada fokus:cincin-kapas-gula-gula fon-medium bulat-lg teks-sm w-full sm:w-auto px-5 py-2.5 text-center">Serah</button>
</form></pre>
<p>Saya mengikuti semua panduan di sana dan di forum berkaitan tetapi tiada siapa yang dapat membantu saya. </p>
<p>Saya membaca artikel ini tetapi ia nampaknya tidak berkesan untuk saya. </p>
<p>Kebanyakan panduan dan tutorial menyebut klon HTML tepat sebagai rangka dalam HTML "awam", jadi dalam index.html saya melakukan sesuatu yang serupa</p>
<pre class="brush:php;toolbar:false;"><body>
<bentuk netlify-honeypot="bot-field"nama tersembunyi="contact-form"
<jenis input="teks"
<jenis input="teks"
<jenis input="emel"nama="e-mel"
<textarea name="textarea"></textarea>
<jenis butang="serahkan"></button>
</form>
<div id="app"></div>
<jenis skrip="modul" src="/src/main.js"></script>
</body></pre>
<p>Apabila saya cuba mengisi borang dalam <code>random-netlify-name-784120.netlify.app</code> serta-merta selepas mengisinya, saya melihat skrin hitam dengan respons ini. < /p>
<p>Bagaimanakah saya boleh menjadikan semuanya berjalan lancar? </p>
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Adakah anda berjaya? Saya mempunyai masalah yang sama dan hanya boleh menyelesaikannya dengan mengalih keluar parameter
action='/success/'dan membiarkan Netlify mengubah hala ke halamannya sendiri...Ajax tersuai juga tidak berfungsi kerana pengambilan untuk
'/'mengembalikan 404...Masih berjalan pada halaman tersuai atau pengendali tersuai...jika saya menjumpai sesuatu saya akan siarkan semula.
(Saya menggunakan Vite + React + Netlify) Tiada pakej penghala... Saya boleh mendapatkan halaman
中获得一个pages/successdalamvite.config.tssayavite.config.tspages/successbuild: { ..., rollupOptions: { input: { main: resolve(root, 'index.html'), success: resolve(root, 'pages', 'success', 'index.html'), }, }