JavaScript에서 세션 변수에 액세스

브라우저를 열고 웹 사이트를 방문 할 때마다 세션이 생성됩니다. 이 기간 동안 브라우저 창이 열릴 때까지 어떤 작업을하든 고유 한 세션 ID, 로그인 세부 정보, 개인 정보 등과 같은 모든 것이 쿠키에 기록되고 저장됩니다. 이러한 세부 정보는 웹 사이트에 액세스하는 사람을 알기 위해 서버와 클라이언트간에주고받습니다.

세션 상태를 사용하여 사용자의username을 ASP.NET 또는 C#에 저장하는 코드를 작성했다고 가정 해 보겠습니다.

protected void Page_Load(object sender, EventArgs e){  
    Session["UserName"] = "John_Wick";  
}

위의 C# 코드에는Page_Load()메서드가 있습니다. 이 메서드는 페이지가로드되는 즉시 호출됩니다. 이 메소드에는 사용자의 사용자 이름을 저장하는 데 사용되는 세션 변수UserName이 있습니다.

JavaScript에서 세션 변수에 액세스

다양한 세션에 접근하는 것은 JavaScript로 쉽습니다. 아래 코드를 사용하여 액세스하는 방법을 살펴 보겠습니다.

아래에는 HTML 문서가 있습니다. head태그 안에 JavaScript 라이브러리 인 jQuery를 사용할 것이므로 jQuery CDN을 추가했습니다. body내부에는 세션 변수에서 가져온 사용자의 사용자 이름을 표시하는 빈div태그가 있습니다. 인사말id가 있습니다. 이id를 사용하여 jQuery 코드 내에서이div를 타겟팅합니다.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- jquery cdn -->
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <title>Session Variable</title>

</head>
<body>

    <div id="greeting"></div>

    <script type="text/javascript">  
        $(function () {  
            var name = 'Welcome ' + ' <%= Session["UserName"] %>'  
            $('#greeting').text(name)  
        });
    </script>  
</body>
</html>

출력:

Welcome John_Wick

script태그에는 페이지가로드 될 때 호출되는 단일 함수 만 있습니다. ASP.NET 또는 C# 언어로 정의한 세션 변수에 액세스하려면이<% = %>태그 내에있는 변수 이름을<%= Session["UserName"] %>으로 전달하면됩니다. 이 태그는 문자열 안에 포함되어 있습니다. 그런 다음 세션 변수 문자열 앞에Welcome이라는 다른 문자열을 추가합니다.

마지막으로 결과를name변수에 저장합니다. 그런 다음 ID가greetingsdiv내부에name변수의 내용을 추가합니다. 그런 다음 웹 브라우저Welcome John_Wick에 사용자의 사용자 이름이 출력으로 표시됩니다.

관련 문장 - Session variable