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가greetings인div내부에name변수의 내용을 추가합니다. 그런 다음 웹 브라우저Welcome John_Wick에 사용자의 사용자 이름이 출력으로 표시됩니다.
Sahil is a full-stack developer who loves to build software. He likes to share his knowledge by writing technical articles and helping clients by working with them as freelance software engineer and technical writer on Upwork.
LinkedIn