IP : 3.144.1.100

[오픈소스] svelte sapper 링크 걸기 a href 말고 스크립트로!!

svelte에서 route 를 하기 위해 sapper 을 사용한다. 그런데, 

2가지 spa 의 장점과 seo 를 두루 만족하기 위해 취하는 방법이 단일 방법이 아니라 2가지 방법을 사용하는 것 같다.

 

우선 sapper 을 사용하면 기본 spa가 된다.

그런데

<a href="">링크</a>를 넣으면

href 에 사용된 주소의 폴더가 생성된다.

 

그래서 

외부에서 해당 주소로 바로 접속을해도 무리 없이 접속이 된다.

 

그러나

a href 를 걸지 않고

스크립크로 링크를 걸면 해당 폴더가 생성되지 않는다.

그러면

직접 해당 링크 주소로 접근하면 에러를 뱉어 낸다.

 

그래서 직접 url 접근을 고려한다면 아마도 seo 때문에라도, a href 를 만들어 주던가 아니면, 

다른 방법이 있을 텐데, 이글을 쓸시점에는 아직 검색해보지 않았다. 

찾으면 업데이트 하겠다.

 

스크립트로 링크 거는 방법으로

location.href 를 사용하면 해당 링크가 생성되지 않아서 사용할 수 없다.

 

이때는 goto() 를 사용해야한다.

우선 상단에 import 를 시켜주소

 

import { goto } from '@sapper/app';

사용할 곳에 goto() 를 사용하면된다.

 

앞서 언급하였지만

on:click={()=>goto('/넘길주소')} 이렇게 해줘야 정상 인자를 끌고가서 정상 실행된다.

 

이상한 점은

만약 location.href= 에 들어갈 주소를 미리 a href 로 만들어 줬다면 해당 주소의 폴더가 생성이 되어서

location.href= 로 해도 접근가능하다

반면 a herf 를 하지 않았다면, 해당 폴더가 생성되지 않아서 실행되지 않을 것 같은데,

goto() 를 이용하면 실행이 된다는 점이다.

 

이부분을 생각해보면, svelte 가 route 를 2가지 방식으로 사용한다고 생각할수 있다.

 

한가지는 spa 내부 페이지 오픈 방식이고
또한가지는 폴더 페이지 오픈 방식이다. 

 

아마도 seo 검색을통해 직접 폴더로 접근하는 유저들의 접근을 가능하게 하기 위한 방법인 것 같다.

어쨋든 폴더로 접근하더래도 실행이 되고 그다음은 spa 로 변환되어 실행되는 것 같다.

 

 

0
0
이 글을 페이스북으로 퍼가기 이 글을 트위터로 퍼가기 이 글을 카카오톡으로 퍼가기 이 글을 카카오스토리로 퍼가기 이 글을 밴드로 퍼가기
captcha
자동등록방지 숫자입력

공실장 개발센터

번호 제목 글쓴이 날짜 조회수
16 오픈소스 SVELTEKIT+ CAPACITOR 설치 그리고 안드로이드 스튜디오 빌드 앱실행 관리자 01-28 2,106
15 오픈소스 sveltekit 로그인 관리자 12-19 1,746
14 오픈소스 sveltekit Cloudflare에 배포하면 받듣시 해줘야할 일! 서브도메인 ssl 통신 허용! 관리자 12-09 2,649
13 오픈소스 sveltekit 빌드하고 배포하기 (클라우드플레어) 관리자 12-06 2,860
12 오픈소스 sveltekit 빌드하고 배포하기 클라우드플레어 이용하게된 계기 - 프롤로그 관리자 12-06 3,512
11 오픈소스 svelte + capacitor 에서 https 로 post로 값넘기기 +1 관리자 01-31 2,535
10 오픈소스 svelte routify 에서 layout 상속 재정의 하기 +1 관리자 10-05 2,369
9 오픈소스 svelte + capacitor + cordova + ionic 빌드하고 폰에 올려서 확인하기 관리자 10-05 4,581
8 오픈소스 svelte + capacitor + cordova + ionic 만들기 쉬운 하이브리드앱 조합 관리자 10-05 3,684
7 오픈소스 svelte sapper 링크 걸기 a href 말고 스크립트로!! 관리자 10-01 4,207
6 오픈소스 svelte on:click 사용 방법 주의사항 관리자 10-01 4,732
5 오픈소스 svelte sapper 빌드하고 서버에 올리기 +1 관리자 09-30 4,257
4 오픈소스 svelte ui +1 관리자 08-03 2,105
3 오픈소스 angular vs react vs vue vs svelte? 관리자 08-03 2,565
2 오픈소스 지도형 홈페이지 파일 그누보드 관리자 04-24 2,097
1 오픈소스 지도형 중개업소 홈페이지 보수 계획 관리자 12-05 2,222