小编Oli*_*ona的帖子

如何在 Nginx 容器内路由 Angular 应用程序?

我的问题

我想用 docker 容器部署我的 angular 应用程序。不幸的是,我很难路由特定的 uri。

前端图像包含 nginx 和我编译的 angular 应用程序。为了在容器内执行路由,nginx 将所有 uri 指向我编译的应用程序,try_files $uri $uri/ myapplication/index.html =404然后 angular router 负责一切。

但是,当我运行前端容器时。我只能访问我的应用程序,而角度路由根本不起作用。

另一方面,如果我在没有 docker 的情况下使用 nginx 为我编译的应用程序提供服务,则路由可以完美运行。

鉴于此,我想知道:

如何在 docker 容器内正确路由 angular 应用程序?

您可以在 Tl;dr 下方找到所有详细信息


整个构建过程

我的应用程序由三个服务组成:

  1. Angular 前端(Nginx + Angular)
  2. 后端 API ( NodeJs + Express )
  3. 数据库(MongoDB)

1) 上下文

我有以下文件树:

|frontend
||package.json
||nginx.conf
||frontend.dockerfile
||Jumble
|backend
||package.json
||backend.dockerfile
||server.js
||Jumble
|docker-compose.yml
Run Code Online (Sandbox Code Playgroud)

Docker-compose.yml 文件:

services:
  frontend:
    container_name: clockmachine-frontend
    build:
      context: ./frontend
      dockerfile: clockmachine-frontend.dockerfile

  database:
    container_name: …
Run Code Online (Sandbox Code Playgroud)

routes nginx docker docker-compose angular

8
推荐指数
1
解决办法
9196
查看次数

使用 mongoDB 切换布尔值

我正在使用 mongoDB 数据库,我想切换 Day 对象内的布尔值present 属性。这是我的工作代码:

exports.modifyPresence = (req, res) => {
  action.getStudentCurrentDay(req.body.hash)
  .then(
    dayId => {
      return Day.findOne({_id: dayId});
    }
  )
  .then(
    day => {
      return Day.findOneAndUpdate({_id: day.id},{$set:{present:!day.present}});
    }
  )
  .then(
    () => res.status(200).json("This is a success")
  )
  .catch(
    (error) => res.status(500).json({error})
  )
}
Run Code Online (Sandbox Code Playgroud)

它正在工作,但我很想打电话给我的数据库一次并编写如下内容:

exports.modifyPresence = (req, res) => {
  action.getStudentCurrentDay(req.body.hash)
  .then(
    dayId => {
      return Day.findOneAndUpdate({_id: day.id},{$set:{present:!present}});
    }
  )
  .then(
    () => res.status(200).json("This is a success")
  )
  .catch(
    (error) => res.status(500).json({error})
  )
}
Run Code Online (Sandbox Code Playgroud)

有谁知道如何实现对数据库的单个调用并以优雅的方式切换我的布尔值?我不知道如何简化我的代码。

谢谢你们

optimization boolean toggle mongodb

6
推荐指数
2
解决办法
7010
查看次数

引导模式中的 CKEditor

我阅读了很多关于如何在 Bootstrap Modal 中使用 CKEditor 的解决方案他们都不为我工作。我感到绝望...... js fiddle <-我目前使用的代码:

  • jQuery 3.1.1
  • 引导程序 3.3.7
  • 编辑器 4.6.2

我的 html 头:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="https://cdn.ckeditor.com/4.6.2/standard/ckeditor.js"></script>
Run Code Online (Sandbox Code Playgroud)

我的模态:

<button type="button" data-toggle="modal" data-target="#modal">Launch modal</button>    
<!-- Modal -->
    <div class="modal fade" id="modal" role="dialog">
      <div class="modal-dialog modal-lg">
        <div class="modal-content">
          <form enctype="multipart/form-data" action="" method="post" class="form-horizontal">
            <div class="modal-body">
              <div class="form-group">
                <label for="text" class="col-lg-2 control-label">CKeditor:</label>
                <div class="col-lg-10">
                    <textarea class="form-control"  name="text" rows="8" maxlength="400" minlength="20" required></textarea>
                </div>    
              </div>
            </div>
            <div …
Run Code Online (Sandbox Code Playgroud)

ckeditor bootstrap-modal

1
推荐指数
1
解决办法
4620
查看次数