개시하다

응답 디자인이 아닌 PC용 뷰와 스마트폰용 뷰를 분리해 설치하는 경우가 있다고 생각한다.
그때는 일반적으로 Action Pack Variants를 사용하고 Controller로 장치마다view를 전환하는 방법을 사용합니다.
하지만 PC 페이지 앞에서만 사용할 수 있습니다.js로 업데이트하는 등 PC와 스마트폰으로 Controller를 분리하고 싶을 때 등이 있다.
이 기사에서는 각 장치가 Controller를 전환하는 방법에 대해 설명합니다.

방법

대략적인 방법은 다음과 같다.
1. 리퀘스트에서 사용자가 접근하고 있는 장치를 판단합니다
2. Louting을 사용하는 constraints는 PC용 Controller와 스마트폰용 Controller로 나뉜다
환경 확인

Ruby 2.5.5
Ruby on Rails 5.2.3

차리다

PC와 스마트폰 각각의 Controller와 View를 준비합니다.
app/controllers/pc_page_controller.rb

class PcPageController < ApplicationController
    def index
    end
end

app/controllers/smartphone_page_controller.rb

class SmartphonePageController < ApplicationController
    def index
    end
end

app/views/pc_page/index.html.erb

PC用のControllerから表示されました。

app/views/smartphone_page/index.html.erb

Smartphone用のControllerから表示されました。

장치 확인 액세스 중

이번에는 rack-user_agent의gem를 사용하여 설비를 판정한다.
Gemfile에 추가rack-user_agent.
Gemfile

gem 'rack-user_agent'

아래와 같이 리퀘스트를 확장해서 장치를 판단할 수 있는 방법이 추가되어 간단하게 판정할 수 있습니다.

class HomeController < ApplicationController
    def index
        request.from_pc?         #=> true
        request.from_smartphone? #=> false
    end
end

기타 기능은 Giithub의 창고를 참조하세요.
k0kubun/rack-user_agent: Rack::Request extension for handling User-Agent

constraints를 사용하여 루트 설정하기

constraints를 사용하면 일치하는 루트의 조건을 설정할 수 있습니다.
참조: 라우팅 Rails 설명서

기본용법

config/routes.rb

get 'photos/:id', to: 'photos#show', constraints: { id: /[A-Z]\d{5}/ }

/photos/A12345 등 경로photos#show입니다만,/photos/893이 일치하지 않기 때문에 부르지 않습니다.

자체 Constraint 작성

constraints는 자신의 Constraint를 만들어서 유연한 판단을 할 수 있습니다.
matches?만약 방법이 진짜로 되돌아온다면, 이 루트와 일치합니다.
app/constraints/smartphone_constraint.rb

class SmartphoneConstraint
    def self.matches?(request)
        request.from_smartphone?
    end
end

config/routes.rb

get '/', to: 'smartphone_page#index', constraints: SmartphoneConstraint
get '/', to: 'pc_page#index'

이렇게 설정하면,routes.왜냐하면 rb에서 순서대로 판정이 돼요.
스마트폰으로 방문하면 smartphone_page#index호칭, 그 외에pc_page#index호칭이 붙는다.

확인

PC에서 액세스하는 경우

스마트폰에서 액세스하는 경우

잘 돌리고 있어요

끝말

기존 Rails 애플리케이션의 프런트엔드는 Vue입니다.js로 업데이트하고 싶어서 PC 페이지만 가져오려고 이번 방법을 썼어요.
기본적으로 모든 장치가view만 전환하는 것은 이해하기 쉽지만, Controller도 전환이 필요하다면 이런 방법은 어떻습니까?
Github: boronngo/rails-sp-routing