在进行API调用时动态设置目标

Question

我正在建立一个多租户网站与React和Django。

这是我的setupProxy.js文件：

const { createProxyMiddleware } = require('http-proxy-middleware');

module.exports = function(app) {
  app.use(
    '/api/products',
    createProxyMiddleware({
      target: 'http://tenant1.localhost:8000',
      changeOrigin: true,
      secure: false,
    })
  );
};

这是可行的，但我需要目标值是'http://tenant1.localhost:8000‘或'http://tenant2.localhost:8000'or 'http://tenant3.localhost:8000’等等.取决于子域或租户。

这样做的目的是从URL中获取子域，例如http://tenant1.localhost:3000。

有人知道我是怎么做到的吗？

另外，我是这样调用API请求的：

import React, { useState, useEffect } from 'react'
import { Row, Col } from 'react-bootstrap'
import Product from '../components/Product'

import axios from 'axios'

function HomeScreen() {
    const [products, setProducts] = useState([])  /* const[state, method] */

    useEffect(() => {

        async function fetchProducts(){
            const { data } = await axios.get('api/products/')
            setProducts(data)
        }

        fetchProducts()

    }, [])

    return (
        <div>
            <h1>Latest Products</h1>
            <Row>
                {products.map(product => (
                    <Col key={product._id} sm={12} md={6} lg={4} xl={3}>
                        <Product product={product} />
                    </Col>
                ))}
            </Row>
        </div>
    )
}

export default HomeScreen

谢谢

Answer 1

我想我可能已经找到了一个初步的解决方案：

setupProxy.js：

const { createProxyMiddleware } = require('http-proxy-middleware');

function customRouter(req) {
  const { hostname } = req
  const tenant = hostname.split('.')[0]
  return `http://${tenant}.localhost:8000`
}

module.exports = function(app) {
  app.use(
    '/api/products',
    createProxyMiddleware({
      router: customRouter,
      changeOrigin: true,
      secure: false,
    })
  );
  app.use(
    '/media/*',
    createProxyMiddleware({
      router: customRouter,
      changeOrigin: true,
      secure: false,
    })
  );
};

这是这里给我的。我对JS的反应非常新，所以我不知道这是否是一个好的解决方案。此外，我还需要找到一种方法来路由本地主机:3000成功.