Вероятно, мне здесь не хватает чего-то очевидного, но я занимаюсь этим уже несколько часов, поэтому решил обратиться за помощью.
У меня есть 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.
Спасибо!