在 JavaScript 中訪問會話變數

Sahil Bhosale 2023年10月12日
在 JavaScript 中訪問會話變數

每當你開啟瀏覽器並訪問網站時,都會建立一個會話。在此期間,直到你的瀏覽器視窗開啟,無論你做什麼,諸如唯一會話 ID、登入詳細資訊、個人資訊等所有內容都將被記錄並儲存在 cookie 中。這些詳細資訊在伺服器和客戶端之間來回傳送,以瞭解誰正在訪問網站。

假設你已經編寫了一個程式碼,在會話狀態的幫助下將使用者的 username 儲存在 ASP.NET 或 C# 中。

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

在上面的 C# 程式碼中,我們有一個 Page_Load() 方法。該方法將在頁面載入後立即呼叫。該方法有一個會話變數 UserName,用於儲存使用者的使用者名稱。

在 JavaScript 中訪問會話變數

在 JavaScript 中訪問各種會話很容易。讓我們看看如何在以下程式碼的幫助下訪問它。

下面我們有一個 HTML 文件。在 head 標籤內,我們新增了一個 jQuery CDN,因為我們將使用 jQuery,一個 JavaScript 庫。在我們的 body 中,我們有一個空的 div 標籤,顯示從會話變數中獲取的使用者使用者名稱。它有一個 greetingsid。使用這個 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 變數中。然後我們將 name 變數的內容新增到具有 greetings id 的 div 中。然後它將在網路瀏覽器 Welcome John_Wick 上顯示使用者的使用者名稱作為輸出。

作者: Sahil Bhosale
Sahil Bhosale avatar Sahil Bhosale avatar

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

相關文章 - JavaScript Variable