Question

在我的React应用程序中。我试图根据不同的环境（例如本地，开发和产品）来配置端点。因此，为了实现这一点，我创建了一个配置文件，其中包含以下详细信息-

endpoint.json-

{
    "User1" : {
        "local" : "http://localhost:8080",
        "dev" : "http://dev:8080",
        "prod" : "http://prod:8080"
    },
    "User2" : {
        "local" : "http://localhost:8081",
        "dev" : "http://dev.com:8081",
        "prod" : "http://prod.com:8081"
    },
    "User3" : {
        "local" : "http://localhost:8082",
        "dev" : "http://dev.com:8082",
        "prod" : "http://prod.com:8082"
    }
}

config.json-

{
    "Ramy":  {
                "id": "123",
                "user": "Ramy",
                "member": "User1"
            },
    "Joe":  {
                "id": "134",
                "user": "Joe",
                "member": "User2"
            },
   "Joey":  {
                "id": "356",
                "user": "Joey",
                "member": "User3"
            }
 }

我正在action.js中进行API调用。这是代码-

  import configData from "../config/config";  
  import endpoint from "../config/endpoint";

    export const createData = (postData,obj)  => dispatch => {

        axios({
            method: 'POST',
            url: "http://dev.com:8080/api",
            headers: {
              'Content-Type': 'application/json',
              'UserData': localStorage.getItem('UserData') || 'No Token Found'
            },
            data: postData
          })
          .then (response => {
          dispatch({
            type: API_CREATE, 
            payload: response.data
          })
          })
          .catch(function(error) {       
            dispatch({
              type: SET_ERROR_DESC
            })
          })
    }

我希望该URL具有足够的可配置性，以便无需在不同环境中为不同用户更改终结点。它应该自动检测并相应地重定向。

此外，我将数据编码在config，json中，并将其编码并存储到localStorage中。因此，基于登录的用户，我希望针对斑点端口和环境配置api URL。有人可以让我在这里错过什么，如何实现这一目标。非常感谢。

如何根据登录的用户数据动态更改API端点

0 个答案: