nginx 프록시를 사용하여 정적 리소스 액세스를 달성하는 방법

WBOY
풀어 주다: 2023-05-26 12:25:20
앞으로
9351명이 탐색했습니다.

1. 목표:

nginx를 통해 정적 리소스(CSS, 그림 등)를 요청하고 nginx 프록시를 통해 페이지 미리보기를 수행합니다.

2. 구현 효과:

페이지를 열려면 브라우저를 통해 nginx 프록시 주소를 입력하여 로컬 HTML 파일에 액세스하세요. 또한 페이지 미리보기 기능을 구현하기 위해 프록시 라우팅 액세스 인터페이스에 액세스할 수도 있습니다. 로컬 Windows 개발 환경

구성 3. 특정 구성

1. nginx는 로컬 정적 엔지니어링 에이전트를 구성합니다.

nginx 구성 파일 nginx.conf를 찾아 nginx 에이전트를 구성합니다.

server{
listen       80;

#前端门户工程
location / {
    alias   D:/workspace/sc-multipl-static-web-project/;
    index  index.html;
}
로그인 후 복사

지침:

D:/workspace /sc-multipl-static-web -project/는 프런트 엔드 프로젝트 파일 경로입니다

구성 파일을 저장하고 nginx를 다시 시작하고 브라우저에 localhost:80을 입력하여 확인하세요

2. Win10은 로컬 도메인 이름을 구성합니다. 도메인 이름 액세스

도메인 이름 액세스는 실제로 해당 IP 주소를 통해 이루어지며, IP를 통해 서비스에 액세스하려면 인터넷 도메인 이름을 개설하지 않은 경우 로컬 도메인 이름 매핑을 구성하여 도메인 이름 액세스를 시뮬레이션할 수 있습니다(유효한 도메인 이름만

C:WindowsSystem32driversetc를 열고 호스트 파일을 찾습니다. 그렇지 않은 경우 관리를 위해 직접 추가합니다. 회원으로 편집기를 열고

127.0.0.1 www.chen123.com

을 입력한 다음 nginx를 엽니다. 구성 파일

server{
    listen       80;
    server_name  www.chen123.com;
    ssi on;
    ssi_silent_errors on;
    #前端门户工程
    location / {
        alias   D:/workspace/sc-multipl-static-web-project/;
        index  index.html;
    }
    
   }
로그인 후 복사

구성 파일을 저장하고 nginx를 다시 시작하고 브라우저에 localhost:chen123을 입력하여

3.nginx 구성 페이지 미리보기 라우팅

우선 페이지 미리보기 인터페이스를 구현해야 하며 반환 형식은 다음과 같습니다. 문자열 형식, 내용은 실제로 html의 텍스트 내용입니다

그런 다음 nginx 구성 파일을 엽니다

http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;
    #cms页面预览路由
    upstream cms_server_pool {
        server 127.0.0.1:31001 weight=10;
    }

    server{
    listen       80;
    server_name  www.xuecheng.com;
    ssi on;
    ssi_silent_errors on;
    #前端门户工程
    location / {
        alias   D:/workspace/sc-multipl-static-web-project/;
        index  index.html;
    }
    #页面预览
    location /cms/preview/ {
        proxy_pass http://cms_server_pool/cms/preview/;
    }
    
   }
}
로그인 후 복사

http://cms_server_pool/cms/preview/ 페이지 미리보기 인터페이스를 구현해야 합니다. 라우팅을 구성하여 실제 주소로 이동합니다. ,

    upstream cms_server_pool {
        server 127.0.0.1:31001 weight=10;
        #如果有多个服务器,可以写在下面,例如
        #server 127.0.0.1:31002 weight=10;
    }
로그인 후 복사

구성 파일을 저장하고 nginx를 다시 시작하고 브라우저에 http://cms_server_pool/cms/preview를 입력하여 확인하세요

내 로컬 nginx 구성은 다음과 같습니다

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;
    keepalive_timeout  65;

    #gzip  on;
    #cms页面预览路由
    upstream cms_server_pool {
        server 127.0.0.1:31001 weight=10;
    }

    server{
    listen       80;
    server_name  www.xuecheng.com;
    ssi on;
    ssi_silent_errors on;
    #前端门户工程
    location / {
        alias   D:/workspace/sc-multipl-static-web-project/;
        index  index.html;
    }
    #页面预览
    location /cms/preview/ {
        proxy_pass http://cms_server_pool/cms/preview/;
    }
   }
}
로그인 후 복사

위 내용은 nginx 프록시를 사용하여 정적 리소스 액세스를 달성하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:yisu.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿