Rumah > Soal Jawab > teks badan
Saya sedang mengusahakan projek React.js/Next.js menggunakan Google reCAPTCHA. Bahagian hadapan saya nampaknya berfungsi (saya tahu itu kerana saya telah menyediakan penyata cetakan), tetapi bahagian belakang memberi saya ralat ini dalam terminal tempatan saya:
Ralat - Tiada kaedah HTTP dieksport dalam 'srcappapirecaptcharoute.ts'. Eksport bernama eksport untuk setiap kaedah HTTP.
Juga mendapat ralat dalam alat dev saya:
'POST http://localhost:3000/api/recaptcha 405 (Kaedah tidak dibenarkan)'
Saya rasa ini berkaitan dengan pepijat lain.
Ini kodnya:
import { NextApiRequest, NextApiResponse } from 'next'; import express from 'express'; import cors from 'cors'; import bodyParser from 'body-parser'; import axios from 'axios'; const app = express(); app.use(cors()); app.use(bodyParser.json()); console.log('hi'); export async function postHandler(req: NextApiRequest, res: NextApiResponse){ if (req.method === 'POST') { const { token } = req.body; try { const response = await axios.post( `https://www.goog le.com/recaptcha/api/siteverifysecret=${process.env.NEXT_PUBLIC_RECAPTCHA_SECRET_KEY}&response=${token}` ); console.log('you made it here'); if (response.data.success) { res.status(200).json({ message: 'reCAPTCHA verification successful' }); } else { res.status(400).json({ message: 'reCAPTCHA verification failed' }); } } catch (err) { console.log(err); res.status(500).json({ message: 'Internal server error' }); } }; }
Saya cuba menamakan semula fungsi itu, mengeksportnya sebagai const dan mengeksportnya pada penghujung fail dan bukannya pada masa penamaan.
P粉5059175902024-01-29 09:27:52
Jika anda menggunakan NextJS 13 App Router
sila gunakan kod berikut:
Fail: ./app/api/recaptcha/route.ts
import { NextResponse } from 'next/server'; import axios from 'axios'; export async function POST(req: Request){ const { token } = req.body; try { const response = await axios.post(`https://www.google.com/recaptcha/api/siteverify?secret=${process.env.NEXT_PUBLIC_RECAPTCHA_SECRET_KEY}&response=${token}`,{},{headers: { "Content-Type": "application/x-www-form-urlencoded; charset=utf-8" }}); if (response.data.success) { return NextResponse.json({ message: 'reCAPTCHA verification successful' }) } else { return NextResponse.json({ message: 'reCAPTCHA verification failed' }) } } catch (err) { return NextResponse.json({ message: 'Internal server error' }) } }
Jika anda menggunakan NextJs 13 Page Router
maka gunakan:
Fail: ./pages/api/recaptcha.ts
import { NextApiRequest, NextApiResponse } from 'next'; const handler = async (req: NextApiRequest, res: NextApiResponse) => { if (req.method === 'POST') { const { token } = req.body; try { const response = await axios.post(`https://www.google.com/recaptcha/api/siteverify?secret=${process.env.NEXT_PUBLIC_RECAPTCHA_SECRET_KEY}&response=${token}`,{},{headers: { "Content-Type": "application/x-www-form-urlencoded; charset=utf-8" }}); if (response.data.success) { return res.status(200).json({ message: 'reCAPTCHA verification successful' }) } else { return res.status(400).json({ message: 'reCAPTCHA verification failed' }) } } catch (err) { return res.status(500).json({ message: 'Internal server error' }) } } else{ res.status(405).json({message: "Method Not Allowed"}) } }; export default handler;
Semoga ini menyelesaikan masalah anda :)