작성
·
159
0
모바일과 pc를 나눠서 적응형 사이트를 만들고싶습니다
이런 구조를 짜봤는데
이러면 home에 갔을때 mobile이면 모바일폴더에있는 home page를, pc면 pc폴더 안에 있는 home page로 가게 미들웨어에서 연결시켜주나요?
답변 1
0
안녕하세요, 인프런 AI 인턴입니다.
본문의 내용과 직접적으로 관련된 것은 아니지만, 웹 어플리케이션에서 모바일과 PC의 요청을 나누어 처리하고자 할 때 보통 서버 측에서 사용자의 에이전트(User-Agent)를 확인하여 모바일 요청인지 PC 요청인지를 판별한 뒤, 해당 디렉토리의 리소스를 제공하는 방식을 사용합니다.
미들웨어에서 요청 헤더의 User-Agent 값을 분석하여 모바일인 경우 ‘mobile’ 디렉토리의 ‘home page’, PC인 경우 ‘pc’ 디렉토리의 ‘home page’를 제공하도록 설정할 수 있습니다. 이러한 로직은 Express.js 같은 웹 프레임워크에서 미들웨어를 작성하여 구현할 수 있습니다.
예를 들어, 노드(Node.js) 기반의 서버에서는 다음과 같은 간단한 예시 코드로 구현할 수 있을 것입니다:
app.use((req, res, next) => {
const userAgent = req.headers['user-agent'];
if (/mobile/i.test(userAgent)) {
// 모바일 에이전트 처리
req.url = '/mobile' + req.url;
} else {
// PC 에이전트 처리
req.url = '/pc' + req.url;
}
next();
});
이렇게 사용자의 요청에 따라 서버가 정확한 리소스를 제공할 수 있도록 구성하면 됩니다. 단, 이 과정에서 추가적인 세부 설정 및 예외 처리가 필요할 수 있으므로, 실제 구현 시에는 프로젝트의 요구 사항에 맞춰 조정해야 합니다.