为什么当我调用代理服务器 api 时网站 url 正在附加

Question

我正在开发一个 React 应用程序。我使用模块 http-proxy-middleware 配置了代理。

在标记页面，网站 url 看起来像 //localhost:9000/flags/all。

当用户点击标志页面中的按钮时，我需要调用 sparkle(rest service) api 并加载结果。当我调用 sparkle api 时，内部网站 url 也在附加并且 api 调用正在形成 http://SGD01D:10700/all/sparkle/flags 而不是 //SGD01D:10700/sparkle/flags 。为什么 "all" 附加到 api 调用？如何解决这个问题

//server
app.use('/sparkle', proxy(proxies.sparkle_config()));

 //Proxy config
class proxies {
  static sparkle_config() {
    return {
      target: 'http://SGD01D:10700', // target host
      changeOrigin: true // needed for virtual hosted sites
    };
  }
}

export default proxies;


//React action
//redux-thunk
export function loadFlags() {
  return function(dispatch) {
    dispatch(beginAjaxCall());

    const promise = axios({url: 'sparkle/v1/api/flag', timeout: 20000, method: 'get', responseType: 'json'});

    promise.then(function(flags) {              
      dispatch(loadFlagsSuccess(flags));
    }).catch(function(error) {
      throw(error);
    });

  };
}

Answer 1

这看起来像是一个问题，因为您的 API 调用中存在相对路径。我会用带有绝对路径的 Axios 调用 API：

const promise = axios({url: '/sparkle/v1/api/flag', timeout: 20000, method: 'get', responseType: 'json'});

为什么当我调用代理服务器 api 时网站 url 正在附加

Why does the website url is appending when I call an proxy server api

javascript

http

reactjs

redux

axios