在本地开发带有全栈 (WAMP) 的 React

2024-03-18

有没有办法在前端使用 React 和全栈服务器(例如 WAMP)设置本地开发环境?

完美的情况是:

  • 使用默认的 React Create App 设置不弹出脚本
  • 对 PHP 文件进行 AJAX 调用,该文件将处理对 MySQL 数据库的查询

问题:

  • 是否可以在 localhost:3000 上运行 WAMP 并进行 Reactyarn start位于 localhost:3002 (它自动设置不同的 IP),然后将 PHP 文件放入其中的某个位置src文件夹并使用其中一种 AJAX 技术(例如 jQuery 或本机 XMLHttpRequest)从 JSX 调用它们?
  • 或者唯一的方法是弹出脚本,然后构建文件并将其放入 WAMP 中/www/project文件夹,然后使用自定义工具更新 WAMP 本地主机地址上的所有这些内容?

EDIT:将反应应用程序放入/wamp/www不是一个选择 - 它对我不起作用,我不想投入更多的努力。在本地主机上运行 React 和 WAMP 似乎可以工作,要回答的问题是:

  • 如何将 PHP 文件导入 JSX。尝试用类似的方式调用它:require('./foo.php')不起作用。import foo from ./foo.php也没用。安利的想法?

经过调查,我找到了实现目标的方法。

能够向您使用的任何本地服务器(Apache、Nginx、Node.js)发送请求的关键是使用 ReactJSproxy特征:

  • https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#proxying-api-requests-in-development https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#proxying-api-requests-in-development

添加后"proxy": "http://localhost" to my 包.json文件我能够向我的 WAMP 服务器发送和接收请求,同时保留所有 React 的 Create App 本机脚本。

附:事实证明,Facebook 有一个很好的 React-native 请求工具,名为fetch - https://facebook.github.io/react-native/docs/network.html https://facebook.github.io/react-native/docs/network.html.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在本地开发带有全栈 (WAMP) 的 React 的相关文章

随机推荐