1. 冒頭の2つの単語みなさんこんにちは。私の名前はLin Zonglinです。私はテストエンジニアであり、フルスタックテストトレーニングキャンプの学生です。 トレーニングキャンプで 2. プロジェクトの紹介このプロジェクトは、フロントエンドとバックエンドの分離技術を使用して実装されています。フロントエンドは 2.1 dockerとdocker-composeをインストールする以下の操作はすべて 1. 古いバージョンをクリーンアップまたはアンインストールします。 sudo yum dockerを削除します\ dockerクライアント\ docker-client-最新 \ docker-common \ docker-最新 \ docker-最新-logrotate \ docker-logrotate \ dockerエンジン 2. yumライブラリを更新する sudo yum インストール -y yum-utils sudo yum-config-manager \ --リポジトリを追加\ https://download.docker.com/linux/centos/docker-ce.repo 3. 最新バージョンをインストールする sudo yum インストール docker-ce docker-ce-cli containerd.io 4. Dockerサービスを開始する sudo systemctl dockerを起動します 5. docker composeインストールパッケージをダウンロードする curl を使用してインストールする利点は、依存関係が不足することを心配する必要がないことです。 sudo curl -L "https://github.com/docker/compose/releases/download/1.28.6/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose 6. docker composeの権限を変更する sudo chmod +x /usr/local/bin/docker-compose 2.2 DockerfileカスタムPythonコンテナまず、デプロイするDjangoプロジェクトコードを特定のディレクトリ(ここでは Djangoプロジェクトの依存パッケージファイル Dockerfileファイルを作成する: Dockerfile の内容: (注: ステートメントの後にコメントを入れないでください。一部のステートメントの実行時に問題が発生する可能性があります): # ベースイメージ FROM python:3.6.8 # python -u を置き換えて、出力をファイルにリダイレクトします。 環境変数 PYTHONUNBUFFERED 1 # ディレクトリを作成し、作業ディレクトリを切り替えます。RUN mkdir /code && mkdir /code/db WORKDIR /コード # ファイルを追加 ADD ./requirements.txt /code/ # コマンド RUN pip install -r requirements.txt を実行します。 # ファイルを追加 ADD ./code/ 2.3 Docker Compose コンテナの作成同じディレクトリを配置し、docker-compose.yml ファイルを作成します: # docker-compose バージョン: "3.9" # サービス情報サービス: # mysql コンテナ、カスタム名 db: イメージ:mysql:5.7 さらす: - 「3306」 ボリューム: - ./db:/var/lib/mysql #データベーステーブルのデータセットを設定するコマンド: [ '--character-set-server=utf8', '--collation-server=utf8_unicode_ci' ] 環境: -MYSQL_DATABASE=xxxx で始まる -MYSQL_ROOT_PASSWORD=yyyy 再起動: 常に # Django は Web を提供します: # このパスの Dockerfile に基づいて Python コンテナを作成します。build: 。 コマンド: bash -c "python ./test_plat_form/manage.py migrate && python ./test_plat_form/manage.py runserver 0.0.0.0:8000" ボリューム: - .:/コード ポート: - 「8000:8000」 さらす: - 「8000」 # 現在のサービスが依存するサービスは、まず依存サービスを起動し、次に現在のサービスを起動します。depends_on: -db # コンテナの IP は可変で、構成ファイル内の mysql の HOST 値を置き換えます。名前は、上記のリンクの mysql コンテナ サービスの名前と一致します。 -db ボリューム: - ./files/suites:/code/test_plat_form/suites - ./files/debugs:/code/test_plat_form/debugs - ./files/reoprts:/code/test_plat_form/レポート - ./files/run_log:/code/test_plat_form/run_log Djangoプロジェクトのsetting.pyファイル内のmysqlホストを、上記のWebノードのlinksの値に変更します。 データベース = { 'デフォルト': { 'エンジン': 'django.db.backends.mysql', '名前': 'xxxx', 'ユーザー': 'root', 'パスワード': 'yyyy', 'HOST': 'db', # ここで変更 'PORT': 3306 } } コマンドを実行 パス: 2.4 Vueプロジェクトの構築Vue は従来の方法で構築できます。 サーバー構成ノードnpm環境 グローバルpm2をインストールする プロジェクト内のAPIのホストをサーバーのIPまたはドメイン名に変更します vueプロジェクトをパッケージ化します: 定数 fs = require('fs'); 定数パス = require('path'); 定数 express = require('express'); express() は、定数です。 app.use(express.static(path.resolve(__dirname, './dist'))) // ディレクトリ内の単一ページ ファイル (index.js) を読み取り、ポート 8080 をリッスンします。 app.get('*', 関数(req, res) { 定数 html = fs.readFileSync(path.resolve(__dirname, './dist/index.html'), 'utf-8') res.send(html) }) アプリをリッスンします(8080); パッケージ化されたdistディレクトリ、app.js、package.jsonをプロジェクトディレクトリにコピーします。 プロジェクトディレクトリに入り、依存関係をインストールします: サービスを開始する: コンテナログを実行します。 ブラウザを使用して 結論現時点ではこのプロジェクトの構成は比較的シンプルで、オーケストレーションに使用されるコンテナは 2 つだけです。しかし、これを例にとると、より多くのコンテナを構築する際には、まずプロジェクトの構成に合わせて異なるコンテナをカスタマイズし、その後コンテナ間の組織関係や依存関係を計画することで、スムーズに構築できると考えています。 Django+Vue+Docker を実際に使用してインターフェース テスト プラットフォームを構築する方法については、これで終わりです。Django+Vue+Docker インターフェース テストに関する関連コンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 以下もご興味があるかもしれません:
|
>>: フレームセットを使用してワイドスクリーンを中央に配置するためのヒントを共有する
まず、私の日常生活についてお話しします。MySQLの急速なアップデートにより、MySQLはバージョン...
ナビゲーションなどは日々の開発でよく使うので、記録として記事を書きます。ナビゲーションは終了/開始位...
リモートアクセスを有効にする次のコマンドを実行して、root ユーザーのリモート アクセス権を有効に...
目次1. 関連するbinlog設定2. binlogに関する詳細設定2.1 バイナリログモードの変更...
Web ページのデザインに関する質問です。すべてに答えられるでしょうか? 1. 単一選択の質問 (...
さっそく、コードを直接投稿します。具体的なコードは次のとおりです。 <!DOCTYPE htm...
翻訳Kool Desktop Environment の略称。 Linux、Unix、FreeBSD...
序文デフォルトでは、MySQL はデータベース クエリ データをキャッシュするために大きなメモリ ブ...
コードをコピーコードは次のとおりです。 <!DOCTYPE html> <html...
以下は、純粋な CSS で記述された画像マウスホバーズーム効果です。実際、基本原理は非常に単純です。...
目次1. JavaScriptはHTMLでキャンバスを使用する2. ページストレージ技術1. Jav...
HTML5 では、ヘッダー、フッター、ナビゲーションなどのセマンティック タグが追加されているため...
ユニアプリコード <テンプレート> <表示> <image v-for...
以前、開発で頻繁に pip ダウンロードを使用する必要がありました。pip ソースを国産ソースに変更...
「ウェブサイトを高級感のあるものにするにはどうすればいいでしょうか? それともデザイン重視にすればい...