[javascript] JavaScript가 비활성화되어 있는지 어떻게 감지합니까?

오늘 아침에 몇 명의 사람들이 JavaScript를 사용하지 않도록 설정했는지에 대한 게시물이있었습니다. 그런 다음 사용자가 비활성화했는지 확인하기 위해 어떤 기술을 사용할지 궁금해졌습니다.

JavaScript가 비활성화되어 있는지 감지하는 짧고 간단한 방법을 아는 사람이 있습니까? 내 의도는 브라우저가 JS를 사용하도록 설정하지 않으면 사이트가 제대로 작동하지 않는다는 경고를 표시하는 것입니다.

결국 JS가없는 경우 작동 할 수있는 콘텐츠로 리디렉션하고 싶지만 시작하려면 자리 표시 자로이 탐지가 필요합니다.



답변

JavaScript 강화 콘텐츠를 제공할지 여부를 결정하려고한다고 가정합니다. 최상의 구현은 깔끔하게 저하되므로 사이트는 여전히 JavaScript없이 작동합니다. 또한 설명 할 수없는 이유로 요소를 사용하는 것이 아니라 서버 측 감지 를 의미한다고 가정합니다 <noscript>.

서버 측 JavaScript 감지를 수행하는 좋은 방법은 없습니다. 대안으로 JavaScript를 사용하여 쿠키설정 한 다음 후속 페이지보기에서 서버 측 스크립팅을 사용하여 해당 쿠키를 테스트 할 수 있습니다. 그러나 쿠키가없는 방문자를 쿠키를 차단하는 신규 방문자 또는 방문자와 구별 할 수 없으므로 전달할 컨텐츠를 결정하는 데 적합하지 않습니다.


답변

여기에 .02를 추가하고 싶습니다. 100 % 방탄은 아니지만 충분하다고 생각합니다.

“이 사이트는 Javascript 없이는 제대로 작동하지 않습니다”라는 메시지를 표시하는 기본 예제와 관련하여 문제는 Javascript없이 사이트가 제대로 작동하는지 확인해야한다는 것입니다. 그리고 일단 그 길을 시작하면 JS가 꺼진 상태에서 사이트가 방탄되어야한다는 것을 깨닫기 시작합니다. 이는 추가 작업의 큰 부분입니다.

그래서 당신이 정말로 원하는 것은 “JS를 켭니다”라고 쓰여진 페이지로의 “리디렉션”입니다. 그러나 물론 메타 리디렉션을 안정적으로 수행 할 수는 없습니다. 제안은 다음과 같습니다.

<noscript>
    <style type="text/css">
        .pagecontainer {display:none;}
    </style>
    <div class="noscriptmsg">
    You don't have javascript enabled.  Good luck with that.
    </div>
</noscript>

… 사이트의 모든 콘텐츠가 “pagecontainer”클래스로 래핑됩니다. 그런 다음 noscript 태그 내의 CSS는 모든 페이지 내용을 숨기고 표시하려는 “JS 없음”메시지를 표시합니다. 이것은 실제로 Gmail 이하는 것처럼 보입니다 … Google에 충분하다면 내 작은 사이트에도 충분합니다.


답변

noscript 블록은 자바 스크립트가 비활성화되면 실행되며 일반적으로 자바 스크립트에서 생성 한 대체 콘텐츠를 표시하는 데 사용됩니다 (예 :

<script type="javascript">
    ... construction of ajaxy-link,  setting of "js-enabled" cookie flag, etc..
</script>
<noscript>
    <a href="next_page.php?nojs=1">Next Page</a>
</noscript>

js가없는 사용자는 next_page링크 를 얻을 수 있습니다-여기에 매개 변수를 추가하여 JS / non-JS 링크를 통해 왔는지 여부를 알 수 있도록 여기에 매개 변수를 추가하거나 JS를 통해 쿠키를 설정하려고 시도하면 JS를 의미합니다 비활성화되어 있습니다. 이 두 가지 예는 상당히 사소하고 조작에 개방적이지만 아이디어를 얻습니다.

몇 명의 사용자가 자바 스크립트를 사용 중지했는지에 대한 순수하게 통계적인 아이디어를 원한다면 다음과 같이 할 수 있습니다.

<noscript>
    <img src="no_js.gif" alt="Javascript not enabled" />
</noscript>

그런 다음 액세스 로그를 확인하여이 이미지가 몇 번 조회되었는지 확인하십시오. 약간 조잡한 솔루션이지만 사용자 기반에 맞는 아이디어를 백분율로 제공합니다.

위의 접근 방식 (이미지 추적)은 텍스트 전용 브라우저 또는 js를 전혀 지원하지 않는 브라우저에서는 제대로 작동하지 않으므로 사용자 기반이 주로 해당 영역으로 스윙하면 이것이 최선의 접근 방식이 아닐 수 있습니다.


답변

이것은 나를 위해 일한 것입니다 : 자바 스크립트가 비활성화되면 방문자를 리디렉션합니다

<noscript><meta http-equiv="refresh" content="0; url=whatyouwant.html" /></noscript>


답변

유스 케이스에 양식 (예 : 로그인 양식)이 있고 서버 측 스크립트가 사용자에게 JavaScript가 사용 가능한지 알아야하는 경우 다음과 같이 할 수 있습니다.

<form onsubmit="this.js_enabled.value=1;return true;">
    <input type="hidden" name="js_enabled" value="0">
    <input type="submit" value="go">
</form>

양식을 제출하기 전에 js_enabled의 값이 1로 변경됩니다. 서버 측 스크립트가 0을 받으면 JS가없는 것입니다. 1을 받으면 JS!


답변

눈에 잘 띄지 않는 JavaScript를 작성하여 다른 방법으로 제안하십시오.

JavaScript가 비활성화 된 사용자에게 프로젝트 기능을 작동시키고 완료되면 JavaScript UI 향상을 구현하십시오.

https://ko.wikipedia.org/wiki/Unobtrusive_JavaScript


답변

<noscript>XHTML에서는 지원되지 않으며 언급 할 필요도 없습니다 .

작업 예 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html>
<head>
    <title>My website</title>
    <style>
      #site {
          display: none;
      }
    </style>
    <script src="http://code.jquery.com/jquery-latest.min.js "></script>
    <script>
      $(document).ready(function() {
          $("#noJS").hide();
          $("#site").show();
      });
    </script>
</head>
<body>
    <div id="noJS">Please enable JavaScript...</div>
    <div id="site">JavaScript dependent content here...</div>
</body>
</html>

이 예에서 JavaScript가 활성화 된 경우 사이트가 나타납니다. 그렇지 않으면 “JavaScript를 활성화하십시오”메시지가 표시됩니다. JavaScript가 활성화되어 있는지 테스트하는 가장 좋은 방법은 JavaScript를 시도하여 사용하는 것입니다! 작동하면 활성화되어 있고 활성화되어 있지 않으면 활성화되어 있지 않은 것입니다.