Как динамически настроить URL Ax ios для Heroku config var - PullRequest
0 голосов
/ 14 июля 2020

Вероятно, мне здесь не хватает чего-то очевидного, но я занимаюсь этим уже несколько часов, поэтому решил обратиться за помощью.

У меня есть Vue / Express приложение с базой данных Postgres, которую я планирую разместить на Heroku.

Я хотел бы знать, как написать мой запрос ax ios, чтобы он использовал localhost: 3000 при запуске app локально, но использует переменную конфигурации Heroku при сборке и развертывании на Heroku. Любая помощь будет принята с благодарностью!

Вот мой файл сервера, index.js:

const express = require("express");
const app = express();
const path = require('path');
const bodyParser = require("body-parser");
const cors = require("cors");

const db = require("./queries");

app.get('/', function(req, res) {
  res.sendFile(path.join(__dirname + '/index.html'));
});

app.use(express.static(__dirname + "/dist/"));

app.use(cors());

app.use(bodyParser.json());

app.get("/sizemenudata", db.getSizeMenuData);

app.get("/lightlevelmenudata", db.getLightLevelMenuData);

app.get("/easeofcaremenudata", db.getEaseOfCareMenuData);

app.get("/petsafemenudata", db.getPetSafeMenuData);

app.get("/menuTitles", db.getMenuTitles);

const port = process.env.PORT || 3000;

app.listen(port, () => {
  console.log(`Listening on ${port}`);
});

Мой queries.js файл выглядит следующим образом:

const { Client } = require("pg");

const client = new Client({
  connectionString:
    process.env.DATABASE_URL ||
    "postgresql://postgres:<password>@localhost:5432/plantsdb",
  ssl: process.env.DATABASE_URL ? true : false
});

client.connect();

const getMenuTitles = (request, response) => {
  client.query("SELECT * FROM menuTitles ORDER BY id ASC", (err, results) => {
    if (err) throw err;
    response.status(200).json(results.rows);
  });
};

const getSizeMenuData = (request, response) => {
  client.query(
    "SELECT * FROM plantSizeMenu ORDER BY id ASC",
    (err, results) => {
      if (err) throw err;
      response.status(200).json(results.rows);
    }
  );
};

const getLightLevelMenuData = (request, response) => {
  client.query(
    "SELECT * FROM lightlevelmenu ORDER BY id ASC",
    (err, results) => {
      if (err) throw err;
      response.status(200).json(results.rows);
    }
  );
};

const getEaseOfCareMenuData = (request, response) => {
  client.query(
    "SELECT * FROM easeOfCareMenu ORDER BY id ASC",
    (err, results) => {
      if (err) throw err;
      response.status(200).json(results.rows);
    }
  );
};

const getPetSafeMenuData = (request, response) => {
  client.query("SELECT * FROM petSafeMenu ORDER BY id ASC", (err, results) => {
    if (err) throw err;
    response.status(200).json(results.rows);
  });
};

module.exports = {
  getMenuTitles,
  getSizeMenuData,
  getLightLevelMenuData,
  getEaseOfCareMenuData,
  getPetSafeMenuData
};

В моем main.js я использую Ax ios для получения данных, вот пример:

const axios = require("axios");
import VueAxios from 'vue-axios'

Vue.use(VueAxios, axios)

Vue.axios
  .get(`/sizemenudata`)
  .then(response => {
    this.$store.dispatch("updatePlantSizeMenu", response.data);
  })
  .catch(function(error) {
    console.log(error);
  });

На данный момент он подключается к Vue серверу CLI через порт 8080, как и ожидалось. , но я не уверен, что изменить URL-адрес, чтобы получить желаемые результаты.

Очевидно, я могу жестко запрограммировать маршрут, подобный этому http://localhost:3000/sizemenudata, который работает локально, но проблема в том, что мне нужно имя хоста для be Dynami c, поскольку я хочу разместить его на Heroku, который имеет свою собственную postgres базу данных URL config var как , задокументированную здесь .

Соответствующая часть цитируется здесь:

В рамках процесса подготовки к конфигурации вашего приложения добавляется конфигурационная переменная DATABASE_URL. Он содержит URL-адрес, который ваше приложение использует для доступа к базе данных.

Мне нужно, чтобы URL-адрес изменился на эту конфигурационную переменную при развертывании на Heroku.

Спасибо!

...