다중 터미널 호환성을 달성하기 위해 ThinkPHP6을 사용하는 방법

ThinkPHP6을 사용하여 다중 터미널 호환성을 얻는 방법

모바일 장치의 인기로 인해 사람들이 웹 사이트에 액세스하는 방식도 많이 바뀌었습니다. 점점 더 많은 사용자가 휴대폰, 태블릿과 같은 모바일 단말기를 사용하여 웹 사이트에 액세스하기 시작하고 있으며 좋은 경험을 얻기를 희망합니다. 다중 터미널 호환성을 달성하기 위해 ThinkPHP6 프레임워크에서 제공하는 일부 기능을 사용할 수 있습니다.

다중 컨트롤러 정의

웹사이트의 경우 다양한 터미널에 다양한 페이지를 제공해야 하며, 이를 위해서는 요청을 처리하기 위해 다양한 컨트롤러를 사용해야 합니다. 예를 들어 www.example.com 웹사이트가 있는 경우 터미널마다 다른 페이지를 제공해야 할 수도 있습니다.

• PC 측: www.example.com 홈페이지 사용
• 모바일 측: m.example.com 홈페이지 사용

응용 프로그램 디렉토리에 두 개의 컨트롤러(Index.php 및 Mobile.php)를 생성할 수 있습니다. 이는 PC와 모바일 터미널의 액세스 요청을 각각 처리하는 데 사용됩니다. 다음은 Index.php 및 Mobile.php의 코드 구현입니다.

Index.php

<?php
namespace appindexcontroller;
use thinkController;
class Index extends Controller
{
    public function index()
    {
        return $this->fetch('index');
    }
}

Mobile.php

<?php
namespace appmobilecontroller;
use thinkController;
class Mobile extends Controller
{
    public function index()
    {
        return $this->fetch('index');
    }
}

URL rewriting

이전 단계에서 두 개의 컨트롤러를 만들어 서로 다른 터미널 액세스를 처리하는 데 사용했습니다. 요구. 다음으로, URL 재작성을 통해 웹사이트가 다양한 터미널을 지원하도록 해야 합니다.

ThinkPHP6에서 제공하는 라우팅 규칙을 사용하여 URL 재작성 기능을 완성할 수 있습니다. 애플리케이션 디렉터리 아래의 경로 디렉터리에 Route.php 파일을 생성하고 URL 재작성 규칙을 작성합니다. 다음은 간단한 URL 재작성 규칙 예시입니다:

use thinkacadeRoute;
Route::pattern([
    'mobile' => 'Mobile',
]);
Route::domain('m', function () {
    Route::get('/', 'mobile/index');
});

위 코드에서는 Route::domain('m', function () {}) 메서드를 사용하여 액세스 요청을 리디렉션할 수 있는 하위 도메인 이름 m을 설정합니다. 모바일 컨트롤러의 인덱스 방법에.

또한 Route::pattern() 메소드를 사용하여 모바일 매개변수의 기본값을 Mobile로 지정하여 액세스 URL에서 모바일 매개변수를 생략하면 프레임워크가 자동으로 모바일 매개변수 값을 설정하도록 했습니다. 모바일로.

템플릿 호환성

사용자가 더 나은 액세스 경험을 얻을 수 있도록 다양한 단말기에 대해 다양한 템플릿을 제공해야 합니다. 이 기능을 달성하기 위해 어댑터 패턴의 어댑터 클래스를 통해 이를 달성할 수 있습니다.

응용 프로그램 디렉터리 아래의 보기 디렉터리에 두 개의 템플릿 폴더(index와 mobile)를 만들 수 있습니다. 이 폴더는 각각 해당 템플릿 파일을 저장하는 데 사용됩니다.

그런 다음 인덱스 컨트롤러와 모바일 컨트롤러에 각각 $this->view->config('view_path') 메소드를 설정하여 컨트롤러에 해당하는 템플릿 경로를 지정할 수 있습니다. 예를 들어 인덱스 컨트롤러에서는 다음 코드를 사용하여 템플릿 경로를 설정할 수 있습니다.

// 设置模板路径
$this->view->config('view_path', app()->getBasePath() . 'view/index/');

마찬가지로 모바일 컨트롤러에서도 해당 템플릿 경로를 설정해야 합니다. 다만 여기의 템플릿 경로는 모바일 디렉터리의 템플릿 파일이어야 합니다.

// 设置模板路径
$this->view->config('view_path', app()->getBasePath() . 'view/mobile/');

이러한 방식으로 터미널마다 다른 페이지 템플릿을 제공할 수 있습니다.

CSS Media Query

CSS Media Query는 CSS에서 반응형 레이아웃을 구현하는 기술입니다. 이 기술은 다양한 장치 너비, 높이 및 기타 매개변수에 따라 웹 페이지 레이아웃의 적응을 실현할 수 있습니다.

ThinkPHP6 프레임워크는 다중 터미널 호환성을 달성하기 위해 CSS Media Query 기술 사용도 지원합니다. 템플릿 파일에 다음 코드를 작성할 수 있습니다.

// 普通样式
.link {
    text-decoration: none;
    color: #333;
}
// 移动端样式
@media screen and (max-width: 768px) {
    .link {
        color: #0079cf;
    }
}

위 코드에서는 기본적으로 스타일 표시를 위한 공통 스타일 .link를 설정합니다. 동시에 @media screen 및 (max-width: 768px) {}를 사용하여 화면 너비 변경을 모니터링하고 화면 너비가 768px보다 작거나 같을 때 자동으로 모바일 스타일로 전환합니다.

요약

이 기사에서는 ThinkPHP6 프레임워크에서 제공하는 라우팅 규칙, 템플릿 호환성 및 CSS 미디어 쿼리 기술을 사용하여 웹 사이트에 대한 다중 터미널 호환성을 구현했습니다.

이러한 기술을 적용하여 다양한 단말기에 다양한 페이지 콘텐츠와 레이아웃을 제공할 수 있으므로 사용자는 더 나은 액세스 경험과 좋은 사용 경험을 얻을 수 있습니다.

위 내용은 다중 터미널 호환성을 달성하기 위해 ThinkPHP6을 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!