“Unhandled Rejection（SyntaxError）：位于0的JSON中的意外标记h”，带有response.json（）

Question

I simply want the php file to "echo $string = 'hello world';" on the html page of my ReactJS app.

But I get this error from my Browser (Google Chrome):

"Unhandled Rejection (SyntaxError): Unexpected token h in JSON at position 0"

Indicating that this is the line causing the issue:

.then((response) => response.json()

My JavaScript:

import React, { Component } from 'react'
import './App.css'


class App extends Component {

    componentDidMount(){

        fetch('http://localhost/finaldemo.php')
        .then((response) => response.json())
        .then((responseJson) => {
            console.log(responseJson)
        })
    }


    render () {
        return (
            <div>
            <p> HELLO </p>
            </div>
        );
    }   
}
export default App;

My PHP:

<?php header('Access-Control-Allow-Origin: http://localhost:3000');?>
<?php
    echo $string = 'hello world';
?>

Where is the problem?

Thanks in advance!

Answer 1

response.json() expects the response from fetch to be in JSON format. which it will then automatically put in JSON.parse to convert it to a javascript object.

your 'hello world' is just text and not a JSON. you can use response.text() and then it will expect a text.

Or you can have the PHP send an actual JSON like '{"message":"hello world"}'