Axios Api 在 Heroku 中调用

IT技术 javascript reactjs heroku axios
2021-05-12 19:30:22

我已将我的应用程序部署到 heroku 并将其连接到 mongoLab。我的问题是我使用 axios 的 API 调用不适用于 Heroku，因为它们仍然在本地设置。是否有一个动态环境变量我必须用 baseURL 替换它才能工作？我尝试研究这个，但没有运气。

请参阅下面的代码

export default {


  saveClient: function(clientData) {
    return axios({
method:"post",
url:"/api/saveClient",
baseURL:"http://localhost:3001",
data:clientData
    })

  }

----------------------
server.js is below



const express = require("express");
const bodyParser = require("body-parser");
const mongoose = require("mongoose");
const app = express();
const PORT = process.env.PORT || 3001;
const cors = require("cors")
app.use(cors())
// Configure body parser for AJAX requests
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
// Serve up static assets
app.use(express.static("client/build"));

var apiRoutes = require("./controllers/clientController.js");
var validatorRoutes = require("./controllers/validatorRoutes.js")
app.use("auth",validatorRoutes)
app.use("/api", apiRoutes);
mongoose.Promise = global.Promise;
// Connect to the Mongo DB
mongoose.connect(
  process.env.MONGODB_URI || "mongodb://skillBuilder:qwerty123@ds143707.mlab.com:43707/heroku_2s9vp225",
  {
    useMongoClient: true
  }
);

// Start the API server
app.listen(PORT, function() {
  console.log(`🌎  ==> API Server now listening on PORT ${PORT}!`);
});
2个回答

您实际上可以完全删除 baseUrl 选项并仅使用相对 URL '/api/saveClient'。这将适用于您的开发和生产环境。当您使用相对 url 时，axios 将默认为 http:// your-app-name .herokuapp.com/api/saveClient。

但是，如果您必须使 baseUrl 显式，则适当的 baseUrl 将是：http:// your-app-name .herokuapp.com。为避免对此进行硬编码，您可以尝试以下操作：

baseUrl = process.env.baseURL || "http://localhost:3001"

Heroku的，您可以在一个简单的方式在他们的控制台，dashboard.heroku.com/apps/设置环境变量您-APP-名称/设定。我认为您不需要这个，但是随着您的应用程序的增长以及您希望更轻松地配置生产环境，知道这一点是很好的。

我通过这样做来修复我的：

exports.homeRoutes = (req, res) => {
  // make request to the /api/users
  //your-app.heroku.com/path/to/your/api
  axios
    .get("https://dashboard.herokuapp.com/api/users")
    .then(function (response) {
      res.render("index", { users: response.data });
    })
    .catch((err) => {
      res.send(err);
    });
};

在您的情况下，此 hack 可能有效：

url:"your-app.herokuapp.com/api/saveClient"
其它你可能感兴趣的问题
上一篇灯丝四处走动而不粘在床上 下一篇如何避免进纸器卡住？