Mac 環境での Nginx 構成とローカル静的リソースへのアクセスの実装

Mac 環境での Nginx 構成とローカル静的リソースへのアクセスの実装

ローカル開発では、直接アクセスできない静的ファイル リソースのデバッグが必要になる場合があります。これは、ローカル Nginx サービスを構成することで実行できます。ちなみに、Nginx の構成手順は記録されています。

インストール

<!--Brew 経由でインストール: -->
nginx をインストール
<!--開始: -->
brew サービスが nginx を起動します
<!-- 設定を表示: -->
usr/local/etc/nginx/nginx.conf をcatします。
<!--設定を編集: -->
vi usr/local/etc/nginx/nginx.conf

Nginx コマンド:

<!--開始: -->
nginx

<!--停止/再起動-->
nginx -s 停止/開始/再起動

設定ファイル

ファイルアドレス: usr/local/etc/nginx/nginx.conf

# ルートの静的ファイルにアクセスできるのはルート所有者のみで、それ以外の場合は 403 が報告されます
ユーザー ルート 所有者;
ワーカープロセス 1;

#error_log ログ/error.log;
#error_log ログ/error.log 通知;
#error_log ログ/error.log 情報;

#pid ログ/nginx.pid;


イベント {
  ワーカー接続 1024;
}


http {
  mime.types を含めます。
  デフォルトタイプ アプリケーション/オクテットストリーム;

  #log_format main '$remote_addr - $remote_user [$time_local] "$request" '
  # '$status $body_bytes_sent "$http_referer" '
  # '"$http_user_agent" "$http_x_forwarded_for"';

  #access_log ログ/access.log メイン;

  ファイル送信オン;
  #tcp_nopush オン;

  #キープアライブタイムアウト 0;
  キープアライブタイムアウト65;

  #gzip オン;

  サーバー{
    # listen ポート listen 8080;
    # ドメイン名 server_name local.XXX.com をバインドします。

    #文字セット koi8-r;

    #access_log ログ/host.access.log メイン;
    
    #ファイルパスとエントリファイルの場所 / {
      ルート /usr/local/var/www;
      インデックス index.html index.htm;
    }
    
    # インターフェースリソース 1
    場所 /XXXapi/ {
      proxy_pass https://api.XXX.com; 
    }
    # インターフェースリソース 2
    場所 /apiXXX/ {
      proxy_pass https://api.XXX.com; 
    }

    #エラーページ 404 /404.html;

    # サーバーのエラーページを静的ページ /50x.html にリダイレクトします
    #
    エラーページ 500 502 503 504 /50x.html;
    場所 = /50x.html {
      ルートhtml;
    }
  }

  サーバーをインクルードします/*;
}

設定手順

  • Nginxをインストールする
  • SwitchHost 経由でホストをバインド (127.0.0.1 local.XXX.com)
  • ポートとドメイン名を設定する
# listen ポート listen 8080;
# ドメイン名 server_name local.XXX.com をバインドします。
エントリファイルと静的ファイルのパスを指定します#ファイルパスとエントリファイルの場所 / {      
 ルート /usr/local/var/www;      
 インデックス index.html index.htm;    
}
追加のAPIリソースがある場合は、proxy_pass#インターフェースリソース1を介して対応するAPIリソースアドレスをバインドします。
場所 /XXXapi/ {
  proxy_pass https://api.XXX.com; 
}
# インターフェースリソース 2
場所 /apiXXX/ {
  proxy_pass https://api.XXX.com; 
}
  1. 静的ファイルをNginx設定のファイルパスに配置する
  2. 完了。ローカルは静的ウェブサイトのリソースを開き、対応するホストを介してアクセスできます。

Mac 環境での Nginx 設定とローカルの静的リソースへのアクセスの実装に関するこの記事はこれで終わりです。Nginx 設定とローカルの静的リソースへのアクセスに関するより関連性の高いコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • Linux サーバー上のローカル静的リソースにアクセスするために nginx を使用する方法

<<:  Web プロジェクト開発 JS 機能の手ぶれ補正とスロットリングのサンプル コード

>>:  シェル スクリプトを使用してワンクリックで MySQL 5.7.29 をインストールする方法

推薦する

HTMLページの読み込みと解析プロセスの詳細な紹介

ブラウザがHTMLを読み込みレンダリングする順序1. IE は上から下へダウンロードし、上から下へレ...

MySQLのクラスタモードでのgalera-clusterのデプロイメントの詳細説明

目次1: galera-clusterの紹介2. galera-clusterの仕組み3: Mari...

Centos7 に PHP と Nginx をインストールする詳細なチュートリアル

Centos のサーバー側への適用がますます普及するにつれて、Centos7 もますます使用されるよ...

Docker /var/lib/docker/aufs/mnt ディレクトリのクリーニング方法

会社のサービスはdockerを使用しており、ディスクマンが見つかりました。その後、次のコマンドを実行...

MySQL データベースで機密データの暗号化と復号化を実装する方法

目次1. 準備2. MySQL暗号化関数方式2.1 MySQL 暗号化2.2 MYSQL 復号化3....

HTML 基本構造_Powernode Java アカデミー

多くの場合、Web ページ開発を学ぶときに最初に印象に残るのは、html または htm サフィック...

CSSは下部のタップバー機能を実装します

現在多くの携帯電話には、下部のタブバーを切り替える機能があります。私も最近、同様の機能を見つけました...

MySQLデータ復旧のさまざまな方法の概要

目次1. はじめに2. 直接回復2.1 mysqldumpバックアップの完全リカバリ2.2 xtra...

JavaScript 履歴オブジェクトの説明

目次1. ルートナビゲーション2. 履歴状態管理API (1)ハッシュチェンジイベント(2)ポップス...

Ubuntu 18.04の下のディレクトリにディスクをマウントします

導入この記事では、Ubuntu 18.04 デスクトップ システムでディスクを目的のディレクトリにマ...

Javascriptのクロージャとアプリケーションの詳細な説明

目次序文1. クロージャとは何ですか? 1.1 クロージャは条件コードを満たす1.2 クロージャ生成...

Linux での MySQL データベースのマスター スレーブ同期レプリケーション構成

Linux での MySQL データベースのマスター/スレーブ同期構成の利点は、この方法をバックアッ...

MySql 組み込み関数の自習知識ポイントまとめ

文字列関数文字ascii(str)のASCIIコード値をチェックし、strが空の文字列の場合は0を返...

MySQLサービスを削除する具体的な方法

MySQLは次のエラーを表示します「コントロール パネル -> 管理ツール -> サービ...

Mysqlのマージ結果と水平スプライシングフィールドの実装手順

序文最近、レポート機能に取り組んでいたのですが、ある月に各部署に入社した人と退職した人の数をカウント...