빈 수수께끼 사이트'therskroll.com'

10116 단어 HTMLhttptech
https://therickroll.com/
이런 사이트가 있어요.방문 후...
image.png
(Chrome과 Edge에는 아무것도 표시되지 않을 것 같습니다. Firefox를 사용하십시오.)
image.png
image.png
릭롤러만 유튜브로 리디렉션된 사이트인데, 사실 이 사이트는...
image.png
왠지 반응이 허전하다.
보아하니 이 사이트는 신비의 힘에 끌린 것 같다.
어때요?신비의 힘, 대단하군.감사합니다.

비밀을 폭로하다


미안합니다.
그래서 나는 진지하게 쓰고 싶다.
내가 먼저 조사해 볼게https://therickroll.com/.
image.png
(repl.it가 호스트인가...)
이상한 편지가 몇 개 있네.
HTTP/1.1 200 OK
CF-Cache-Status: DYNAMIC
CF-RAY: 6ff556570fa88391-KIX
Connection: keep-alive
Content-Encoding: gzip
Content-Type: text/html; charset=utf-8
Date: Thu, 21 Apr 2022 10:11:44 GMT
NEL: {"success_fraction":0,"report_to":"cf-nel","max_age":604800}
Report-To: {"endpoints":[{"url":"https:\/\/a.nel.cloudflare.com\/report\/v3?s=GrBx1yPeepXgmC80kPvO%2FJifLZdr00XV4tNbsjbYvSKd15G0RHWyQszRg%2BvFSobq7vn%2BH6bHyy%2BJghZllmYCF9fA5OM9%2B89Fnv1eDfJoU4esecj1xZBDh9yaCOviUXPn8WTvTDd3h4D1fijkvqk%3D"}],"group":"cf-nel","max_age":604800}
Server: cloudflare
Transfer-Encoding: chunked
alt-svc: h3=":443"; ma=86400, h3-29=":443"; ma=86400
expect-ct: max-age=2592000, report-uri="https://sentry.repl.it/api/10/security/?sentry_key=615192fd532445bfbbbe966cd7131791"
　
　　link: <style.css>; rel=stylesheet;
　　refresh: 5; url=https://www.youtube.com/watch?v=dQw4w9WgXcQ
　
replit-cluster: hacker
diff http인 경우 강조 표시되지 않아 들여쓰기)link 편지봉투를 찾아봤어요.
HTTP의 링크 실체 헤더 필드는 HTTP 헤더 내의 하나 이상의 링크를 직렬화하는 수단을 제공합니다.의미상 HTML의 요소와 같다.
https://developer.mozilla.org/ja/docs/Web/HTTP/Headers/Link
링크 헤더에 스타일.css가 적용되는 것 같습니다.
style.css 봤어요.
/* ... */
head { 
+  display: block;
+  background-image: url(https://media.giphy.com/media/Ju7l5y9osyymQ/giphy.gif);
  height:20rem;
  width:20rem;
  background-repeat: no-repeat;
  background-size: cover;
  border: 5px solid #fff;
  border-radius: 10px;
  border-style: dashed;
}

body::before {
  display: inline-block;
  padding-top: 3rem;
+  content: "Never gonna give you up...";
}
헤드를 표시하고 요소를 추가하는 모습.헤드는 display: block로 표시된 거죠.
다음은 refresh...가고 싶은 곳
image.png
MDN에 기재되지 않았습니다.html refresh header 조사에 따르면 MDN의 Meta 태그가 인기를 끌고 있다.
<head>
  <meta http-equiv="Refresh" content="0; URL=https://example.com/">
</head>
http-equiv는 HTTP 제목의 이름이며, Refresh는 눈썹으로 방향을 바꿀 수 있다.
Sinatra로 간단한 서버 구축
require "sinatra"

get "/" do
  headers "Refresh" => "5; URL=https://example.com"
  "Hi!"
end
dist.gif
성공을 재정비하다.

결론

  • CSS 및 리디렉션은 HTTP 헤더를 통해 수행
  • 헤드 표시 및 레이아웃 만들기
  • MDN에 없음Refresh 제목
  • Link Firefox 외부에서 비동작 제목
    • 감사합니다.하면, 만약, 만약...
    Lambda 개발 시 주의해야 할 제품군 ④
    Cesium 입문부터 포기 10: 공의 뒷면에 있는지 판단점

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage