Axios Api 在 Heroku 中调用

Mme*_*rba 2 javascript heroku reactjs axios

我已将我的应用程序部署到 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}!`);
});
Run Code Online (Sandbox Code Playgroud)

Jef*_*del 6

实际上,您可以完全删除 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/ your-app-name /settings。我认为您不需要这个,但随着您的应用程序的增长并且您希望更轻松地配置生产环境,了解这一点是件好事。