Неожиданный конец ввода JSON в почтовом запросе - PullRequest
0 голосов
/ 03 августа 2020

надеюсь, вы сможете прояснить эту проблему:

Я пытаюсь создать простую форму реакции, обновляющую данные в базе данных, мой код React выглядит следующим образом:

import React, { useState, useEffect } from 'react';


export default function Form() {
    const [email, setEmail] = useState('');
    const [name, setName] = useState('');
    const [text, setText] = useState('');

    const handleEmail=(e)=>{
        
        setEmail(e.target.value)
    }
    const handleName=(e)=>{
        
        setName(e.target.value)
    }
    const handleText=(e)=>{
        
        setText(e.target.value)
    }
    const handleSubmit=(e)=>{

        e.preventDefault();
        if(name&&email&&text!==''){
             sendData()
        }else{
            console.log('fill the stuf')
        }
    
    }
    const sendData=()=>{

        fetch('http://www.contact.test/api/contact',{
            method:'post',
            body:JSON.stringify(
                {email,name,text}
            ),
            headers:{
                'Accept':'application/json',
                'Content-Type':'application/json',
            }
        }).then(function(response){
            response.json().then(function(resp){
                console.log(resp)
            })
        })
        setText('')
        setEmail('')
        setName('')

    }
    
    return (
        <>
            <form onSubmit={handleSubmit}>
                <label>Email</label>
                <input onChange={handleEmail} type="email" value={email} placeholder="Enter email"/>
                <label>Name</label>
                <input onChange={handleName} type="text" value={name} placeholder="Enter Name"/>
                <label>Text</label>
                <textarea onChange={handleText} value={text} placeholder="Enter Text"/>
                <button type="submit">Send</button>
            </form>
        </>
    )
}


однако Я получаю сообщение об ошибке при извлечении данных,

Form.jsx:43 Uncaught (in promise) SyntaxError: Unexpected end of JSON input
    at Form.jsx:43

самая важная часть для выборки - это строка 43, которую вы можете идентифицировать:

    const sendData=()=>{

        fetch('http://www.contact.test/api/contact',{
            method:'post',
            body:JSON.stringify(
                {email,name,text}
            ),
            headers:{
                'Accept':'application/json',
                'Content-Type':'application/json',
            }
        }).then(function(response){
            response.json().then(function(resp){>**//this is line 43**
                console.log(resp)
            })
        })
        setText('')
        setEmail('')
        setName('')

    }

мой bakcend - это с Laravel 7:

class ContactController extends Controller
{
    function contact(Request $request)
    {
        $contact = new Contact;
        $contact->name=$request->input('name');
        $contact->email=$request->input('email');
        $contact->text=$request->input('text');
        $contact->save();

        return $contact;
    }
}

маршрут

Route::post('/contact', 'ContactController@contact');

Я немного сбит с толку, так как мне удалось отправить некоторый запрос в БД, но внезапно он начал жаловаться на CORS , Я установил расширение chrome, и теперь это происходит.

Надеюсь, у вас есть предложение.

Спасибо

редактировать проблема возникла при попытке чтобы настроить автоматическое c электронное письмо после отправки формы, в инструментах разработчика / network / headers, когда я заполняю файл .env в laravel информацией из электронного письма, появляются 2 новых заголовка:

enter image description here

введите описание изображения здесь

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...