时间戳

首页 > 解决方案 > React ES6 App - 本地 API 调用

javascript - React ES6 App - 本地 API 调用

问题描述

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

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

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

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

...然后获取命中的 URL 是http://localhost:3000/models/overall-stats.php，它简单地解析回 index.html 文件并加载应用程序，而不是我请求的 PHP 文件。

如果我需要点击那个 PHP 文件来获取我的数据，我在使用 fetch 时错了吗？还是我只是使用不正确？如果我不应该使用 fetch 我遇到的这个问题有什么更好的方法？

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

任何帮助将不胜感激。

标签： javascriptphpreactjsapachees6-promise

解决方案

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

推荐阅读