[컴][웹] 간단한 iframe test 환경 조성

 아이프레임 테스트 / 테스트 환경 조성 / iframe 테스트 해보기 / 사용해보기 / 어떻게 / 구성

간단한 iframe test 환경 조성

간략하게 이야기하면, python 으로 static server 를 2개 두고, 테스트 환경을 만들 것이다. 일단 기본적으로 windows 환경에서 작업을 가정한다.

대략적인 그림은 아래와 같다.

┌──────────────────┐   ┌─────────────────┐
│                  │   │                 │
│ 127.0.0.1:8080   │   │  localhost:80   │
│                  │   │                 │
└───────────┬──────┘   └──────────────┬──┘
            │                 ▲       │
            │                 │       │
            │           ┌─────┘       │
            │           │             │
            │         ┌─┘             │
            │         │               │
         ┌──▼─────────┼────────┐      │
         │            │        │    ┌─┘
         │ parent  ┌──┘        │   ┌┘
         │         │           │ ┌─┘
         │  ┌──────┘─────────┐ │ │
         │  │                │◄├─┘
         │  │  iframe        │ │
         │  │                │ │
         │  │                │ │
         │  └────────────────┘ │
         │                     │
         └─────────────────────┘

2개의 static server

아래 처럼 2개의 server 를 띄운다.


start python -m http.server 8080
start python -m http.server 80

아래 같은 directory 구조면 된다.

server-root-dir --+-- iframe-test-server.bat
                  |
                  +-- iframe.html
                  |
                  +-- test.html

iframe test page

다음은 iframe 을 호출하는 page 이다.

<!DOCTYPE html>
<html>
<head>
    <title>iframe test</title>
</head>
<body>

<iframe src="http://localhost/iframe.html"></iframe>
</body>
</html>

아래는 iframe-test.html page이다.

<!DOCTYPE html>
<html>
<head>
    <title>test1</title>
</head>
<body>
Hello World
</body>
</html>

확인

이제 browser 를 열고 아래 주소로 접근하면 된다.

  • http://127.0.0.1:8080/iframe.html

댓글 없음:

댓글 쓰기