본문 바로가기

새로운 블로그로 이전합니다
구글블로그 / 네이버블로그
(자료도 점차 이전할 계획입니다.)


정보/IT 정보

구글 드라이브로 자바스크립트 파일 호스팅하기

by 개발자 리브 2023. 3. 2.

구글 드라이브(Google Drive)를 이용하여

자바스크립트 파일을 업로드하고

이를 가져와서 쓸 수 있도록 해보자.

 


 

* 내 PC > 보기에서 '파일 확장명'을

체크하고 시작하는 것을 권장한다.

 

1. 팝업 메시지를 표시하는 간단한 스크립트를

작성하고 파일로 저장한다.

(★ 확장자는 txt 이어야 함)

 

* txt여야 하는 이유는 설명의 마지막에서 확인

 

2. 1에서 작성한 파일을 내 드라이브 영역

드래그 앤 드랍(끌어다 놓기)한다.

 

3. 업로드가 완료되면, 해당 파일을

우클릭하여 공유를 클릭한다.

 

4. 일반 액세스에서 제한됨으로 설정된 부분을

링크가 있는 모든 사용자로 변경한다.

 

5. 링크 복사를 눌러서 파일에 접근할 수 있는

URL주소를 복사한다.

 

6. 복사한 URL에서 파일 ID 부분만 분리하여

위 이미지와 같이 링크를 수정한다.

 

구글드라이브 링크 수정 예시.txt
0.00MB

 

7. 테스트를 위한 HTML 파일을 작성한다.

 

* HTML코드 작성이 가능한 블로그 등이 있으면,

<script src="..."></script> 부분만 있어도 됨.

 

html파일 내용 예시.txt
0.00MB

 

8. 최종결과

JS파일이 정상적으로 로드되면

위와 같이 팝업 메시지가 표시된다.

 


+ 확장자가 txt여야 하는 이유

 

+ 파일의 확장자txt가 아닌 js이면,

위와 같이 다운로드 할 때, 보안절차로 인해

막히는 부분이 발생하여 로딩이 안될 수 있다.

(txt이면, 안 물어보고 바로 다운로드 시작됨)

 

+ 반드시 체크되어야 하는 부분

 

(체크되지 않은 경우)

 

'뷰어' 를 클릭하면, 접근수준 변경할 수 있다.

 

(* 뷰어로 설정해도 js파일 로딩에는 문제없음.)

- 뷰어 : 원본링크에서 보는 것만 가능.

- 댓글 작성자 : 해당 파일에 대해 댓글 작성가능.

- 편집자 : 해당 파일을 수정할 수 있음.

 


[ 참고자료 ]

 

 

Host CSS or JS file on Google Drive

For reference https://smashballoon.com/instagram-feed/standalone/docs/host-on-google-drive/   1) Click on the New button in the top left corner and select File Upload - add your css or js file 2) Once the file is done uploading, right click on the fil

hwpi.harvard.edu

구글 드라이브 링크 변경방법

 

 

Does Google Drive no longer allow JavaScript file referencing from other website?

I just noticed that all my javascript files hosted on Google Drive no longer work, which previously officially allowed by Google. All variables and function calls become undefined (as indicated in ...

stackoverflow.com

파일의 확장자를 txt로 하는 부분
(3번째 답변 확인)

 

댓글