使用 Elastic Beanstalk 部署 Vue JS Django 应用程序

Posted 2023-03-04

【中文标题】使用 Elastic Beanstalk 部署 Vue JS Django 应用程序

【英文标题】：Deploy Vue JS Django app with Elastic Beanstalk

【发布时间】：2020-05-20 23:06:32

【问题描述】：

我有一个在本地构建的应用程序，我已准备好部署它，但使用 Vue 作为前端和 Django 作为后端对我来说是新事物。我当前的文件夹结构如下：

-后端 -前端 -环境

后端文件夹是一个传统的 Django 项目，使用 sqlite 作为数据库，前端是您正常的 Vue 项目，而 env 是虚拟环境

我什至不知道该怎么做，也不知道要问什么问题，但我发现人们使用 AWS Elastic Beanstalk 部署 SPA。

部署这样的应用最直接的方法是什么？

【参考方案1】：

我们经常使用的最佳方式

如果您正在使用 ajax 调用访问您的 Django 项目

1.创建项目的构建

创建构建后，您需要使用 s3 或任何其他首选静态托管将此构建托管到某个 URL。

现在您需要使用 EB 部署 Django 项目，部署项目后，您将获得一个自动生成的 URL

在您的前端项目中，您需要在配置中设置一个环境变量，以便无论何时构建项目，您的所有 ajax 调用都将重定向到弹性 beanstalk 自动生成的 URL您的呼叫将被重定向到 localhost URL

下面的代码并不是你的 baseurl 应该是什么样子的大致概念

env.APILINK=env.build? 'beanstalkurl':'localhost'

确保为您的 axios 或任何其他 ajax 调用添加一个基本 URL， 一旦你根据你工作的环境设置了你的baseurl，所有的ajax调用都会被相应地重定向

对于开发环境

http://localhost/api/getsomedata

对于实际上是构建的 prod 环境

http://beanstalkurl/api/getsomedata

【讨论】：

是否可以将 django 和 vue 应用程序部署到同一个 eb 实例。我知道 eb 在一个实例中支持多容器。我想做的实际上是将 BE 和 FE 部署到同一个实例，这可能还是我必须将我的 Vue 应用程序部署到另一个实例？