在PHP中使用create-react-app

时间:2018-08-23 16:07:54

标签: php reactjs integration create-react-app

我是新来的反应者,想与index.php一起使用。我使用create-react-app创建了我的React项目。我对此进行了研究,发现您可以在构建它之后使用php进行反应。但是我想使用开发模式。请帮助我。

1 个答案:

答案 0 :(得分:0)

将其他服务器用于PHP;

第一次调试React,“ npm start” http://localhost:3000/

let buttonPHPSet = () => document.getElementById("buttonPHP").addEventListener("click", (e) => {
    const that = e.target;
    const data = {
        "p": "7",
        "h": "2",
        "P": "3"
    };
    postAjax("http://my-app.local/controller/HomeController.php", data, (result) => {
        let json = JSON.parse(result);
        that.textContent = JSON.stringify(json);
        console.log(json);
    });
}, false);

function postAjax(url, object, success) {
    let xhr = new XMLHttpRequest();
    xhr.open('POST', url, true); //URL-aдpec интерпретируется относительно страницы, с которой вызывается код, хотя можно указать и абсолютный путь //только готовит его к отправке
    xhr.onreadystatechange = () => {
        if (xhr.readyState === 4 && xhr.status === 200) {
            success(xhr.responseText);
        } 
    };
    xhr.setRequestHeader('Content-Type', 'text/plain; charset=UTF-8');
    xhr.send(JSON.stringify(object));

    // let xhrFormData = new FormData();
    // for (const key in object) {
    //     if (object.hasOwnProperty(key)) {
    //         xhrFormData.append(key, object[key]);
    //     }
    // }
    // xhr.send(xhrFormData);

    // const allHeaders = xhr.getAllResponseHeaders();
    // xhr.abort();
    return xhr;
} 

通过IIS http://my-app.local/调试php

<?php 
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: Content-Type, Access-Control-Allow-Headers, X-Requested-With");
header('Content-Type: text/plain; charset=utf-8');

// header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT");
// header('Access-Control-Allow-Credentials: true');
// header('Content-Type: application/json;charset=UTF-8');
// header('Content-type: application/xml');
// header('Content-type: multipart/form-data);
// header('Content-type: text/html;charset=utf-8);
// header('Content-type: application/x-www-form-urlencoded; charset=UTF-8);

$postdata = file_get_contents("php://input");
$postDataDecode = json_decode($postdata);

if($_POST){

    $array = [];

    foreach ($_POST as $key => $value) {
        $array[$key] = $value;
    }

    echo json_encode($array);

} elseif ($postDataDecode) {
    echo json_encode($postDataDecode);
}

?>

vs code edge