Skip to content

Instantly share code, notes, and snippets.

@eoureo
Last active March 14, 2023 14:04
Show Gist options
  • Save eoureo/6c418f7586eb317f9ef7aa5312bb15db to your computer and use it in GitHub Desktop.
Save eoureo/6c418f7586eb317f9ef7aa5312bb15db to your computer and use it in GitHub Desktop.
ChatGPT를 써서 만든 Bookmarklet [T](U) - HTTP와 HTTPS에서 되도록 해줘.
javascript:(function() {
var markdown = "[" + document.title + "](" + window.location.href + ")";
var fakeElem = document.createElement('textarea');
fakeElem.value = markdown;
fakeElem.setAttribute('readonly', '');
fakeElem.style.position = 'absolute';
fakeElem.style.left = '-9999px';
document.body.appendChild(fakeElem);
fakeElem.select();
document.execCommand('copy');
document.body.removeChild(fakeElem);
})();
@eoureo
Copy link
Author

eoureo commented Mar 14, 2023

ChatGPT를 써서 만든 Bookmarklet - "페이지 제목과 URL을 마크다운 형식 [T](U) 으로 클립보드에 저장하는 Bookmarklet을 만들어줘"
https://gist.github.com/eoureo/e674e8e322db5d57b5c3419710a74137
Bookmarklet-[T](U).js

위에서 만든 Bookmarklet은 HTTP 프로토콜에서는 안된다.

그래서 다시 ChatGPT를 이용했다.

Q: navigator.clipboard.writeText 를 쓰도록 한 위 bookmarklet은 프로토콜이 https에서는 되는데 http에서는 안된다.

A: 네, 맞습니다. navigator.clipboard API는 HTTPS 환경에서만 동작하며, HTTP 환경에서는 보안상의 이유로 사용이 금지되어 있습니다. 이 문제를 해결하기 위해서는 다른 방법을 사용해야 합니다.
대안으로는, execCommand() 메소드를 사용하는 방법이 있습니다. 이 메소드는 HTTPS 및 HTTP 환경 모두에서 작동합니다. 아래와 같이 수정하시면 됩니다:

"코드 출력"

이 코드는 클립보드에 텍스트를 복사할 때 사용하는 흔한 트릭 중 하나입니다. 일시적으로 textarea 엘리먼트를 생성하고, 거기에 클립보드에 저장하고자 하는 내용을 할당한 후, 해당 textarea 엘리먼트를 선택하고 execCommand('copy') 메소드를 호출합니다.

이 방법은 클립보드에 내용을 저장하기 위해 별도의 권한이 필요하지 않으며, 모든 브라우저에서 작동합니다.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment