Question

我在React中构建了我的应用程序，在通过webpack-dev-server在生产版本中测试之后，调用API的不可能性出现了。我通过AXIOS提出请求。

GET请求发生以下错误：

获取http://localhost:8080/api/web/api/get-logged-navbar 404（未找到）

对于POST请求，它不会触发操作。

即使我使用了正确的请求路径。

我的应用程序的重要文件夹的结构如下：

public（bundle.js构建的文件，以及其他样式和脚本资源都在这里）
src（组件和操作）
api（api代码在这里：Yii2）

Webpack配置：

var webpack = require('webpack');
var path = require('path');

var BUILD_DIR = path.resolve(__dirname, 'public');
var APP_DIR = path.resolve(__dirname, 'src');

var config = {
  entry: APP_DIR,
  output: {
    path: BUILD_DIR,
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        include: APP_DIR,
        loader: 'babel-loader',
      },
      {
        test: /\.css$/,
        loaders: ["style-loader","css-loader"]
      },
    ]
  }
};

module.exports = config;

我是否需要设置代理并将API放在另一个服务器端口上？

Answer 1

假设您说的是我认为您的意思，那么是的，您可能需要webpack-dev-server proxy option将您的API请求转发给您的Yii2后端。找出API服务器正在侦听的端口，并将/api代理到该端口，如该页面上的示例所示。

Answer 2

我构建了一个天气应用程序，它使用React / Webpack和Axios对openweather.org进行API调用。我不认为代理是必要的。您应该调查传递给Axios的URL。如果无法看到您的代码，就很难提出进一步的建议。

无法调用React JS webpack-dev-server api

2 个答案: