React ES6 App-本地API调用

Question

我一辈子都无法弄清楚这一点，似乎应该是直截了当的，但这只是没有点击。

我有一个使用create-react-app创建的ES6应用程序。 我已经为项目设置了所有模板和布局，然后尝试从我想放在应用程序内的API提取数据-就像一个装满MVC的MVC，其中React处理视图，然后运行模型和控制器在PHP中。

因此，我想在其中一个组件中获取一个函数以获取一些数据。 我使用fetch（）函数（我知道这与许多浏览器尚不兼容，但这又是一天的问题）来获取从组件到要加载的模型的相对路径，但是fetch函数会处理我的路径作为对基本URL的调用，后跟请求。 因此，使用在localhost：3000上运行的站点，我在getData（）函数中运行以下代码...

let test = fetch('../models/overall-stats.php').then(function(response) {
        console.log(response);
        return response;
    });

...提取的网址便是http：// localhost：3000 / models / overall-stats.php ，它可以简单地解析回index.html文件并加载应用程序，而不是我请求的PHP文件。

如果我需要点击该PHP文件来获取数据，那么使用fetch是否会出错？ 还是我使用不正确？ 如果我不应该使用访存，有什么更好的方法来解决这个问题呢？

当我在apache服务器上运行此文件（在构建和部署之后）时，我可以使提取工作正常（apache可以识别URL的结构并按预期的方式命中它），并且我没有遇到任何问题，但是我需要能够在本地开发环境中工作并具有相同的功能。 该应用程序最终将实时部署在apache服务器上。

任何帮助将不胜感激。

Answer 1

我睡着之后就知道这将是非常简单的……我只需要将我的模型和控制器移动到公共目录中就可以访问它们。 我将对模型进行身份验证，以使它们不能直接被命中，而只能通过GET请求被命中。

Answer 2

您为什么不只使用${baseUrl}/models/... ？

同样，为了解决浏览器获取问题，您可以导入Polyfill或直接使用axios（我的选择）！

Answer 3

也许您可以尝试使用ajax从服务器获取或发布数据，如下所示：

 $.ajax({
        url: '../models/overall-stats.php',
        data: {

        },
        type: 'GET',
        dataType : 'json',
        success : function(res){
           let obj = parseJSON(res)
        }

    })

或将其添加到您的php文件中，因为CORS：

header('Access-Control-Allow-Origin: *');