Rails - 會話變量不會持續

Question

我想將我的側邊菜單的狀態保存在rails會話變量中，這樣如果我的用戶摺疊側面菜單，那麼當視圖更改時，該摺疊狀態將會持續。我有我的js設置，以便一個uncollapsed狀態將發送「0」到控制器，並且如果側面菜單處於摺疊狀態，ajax將發送一個「1」到控制器操作。如果控制器操作收到「1」，我希望在我的應用程序中設置會話變量。

我目前有一個ajax請求到相應的控制器操作，摺疊的side-nav成功發送一個「1」，但會話變量似乎不會持續。以下是我在控制檯中看到，當側導航處於摺疊狀態：

控制檯： （當邊導航是摺疊）

Started POST "/dashboard/side_nav_state" for 10.0.2.2 at 2015-06-02 15:58:08 +0000 
Processing by DashboardController#side_nav_state as */* 
    Parameters: {"hide_side_nav"=>"1"} 
Completed 200 OK in 2ms (Views: 0.2ms | ActiveRecord: 0.0ms) 

（當側導航已展開。）

Started POST "/dashboard/side_nav_state" for 10.0.2.2 at 2015-06-02 16:02:56 +0000 
Processing by DashboardController#side_nav_state as */* 
    Parameters: {"hide_side_nav"=>"0"} 
Completed 200 OK in 2ms (Views: 0.2ms | ActiveRecord: 0.0ms) 

的JavaScript：

的sendSideNav();函數實際上發送1或0到控制器。如您所見，collapsedSideNav();函數發送1.如果您查看sendSideNav();函數，您可以看到1被傳遞到ajax請求中的數據鍵值對。

// collapsible side-nav functionality 
function collapsedSideNav(){ 
    $('.side-nav').toggle(300); 
    $('#collapse-side-nav').css('display', 'none'); 
    $('#expand-side-nav').css('display', 'inherit'); 
    $('.container').animate({ 
    'padding-left' : 0 
    }, "slow"); 
    $('.row').css({ 
    'max-width' : '98%', 
    'margin-left' : '1.15rem' 
    }); 
    sendSideNavStatus(1); 
}; 

// expandable side-nav functionality 
function expandedSideNav(){ 
    $('.side-nav').toggle(325); 
    $('#expand-side-nav').css('display', 'none'); 
    $('#collapse-side-nav').css('display', 'inherit'); 
    $('.container').animate({ 
    'padding-left' : 200 
    }, "slow"); 
    $('.row').animate({ 
    'max-width' : '95%', 
    'margin-left' : 'auto' 
    }); 
    sendSideNavStatus(0); 
}; 

// sends the state of the side-menu (if not default) to the controller so it can be stored in a session 
// 1 for true, and 0 for false. 
function sendSideNavStatus(trueOrFalse){ 
    $.ajax({ 
    url: '/dashboard/side_nav_state', 
    method: 'POST', 
    data: {hide_side_nav: trueOrFalse} 
    }); 
}; 

// DOM Events for collapsing and expanding side-nav 
$('#collapse-side-nav').click(function() { 
    collapsedSideNav(); 
}); 
$('#expand-side-nav').click(function() { 
    expandedSideNav(); 
}); 

ROUTES

post 'dashboard/side_nav_state' 

控制器動作

def side_nav_state 
    session[:hide_side_nav] = params[:hide_side_nav] == "1" 
    render json: {success: true} 
end 

編輯：

我應該注意，所有的T他正在我的儀表板控制器中發生。無論我在哪個控制器中，我都希望這個會話持續下去。這可能嗎？我知道你不能路由到你的應用程序控制器，這就是爲什麼我將邏輯設置到儀表板控制器的原因。我不確定這裏的解決方案是什麼。

Answer 1

對於任何最終有這個問題但無法找到答案的人，我終於會得出如何解決問題的結論。

我發現rails會話主要用於後端邏輯（用戶身份驗證，用戶首選項等等）。我上面的代碼的問題是，我的JavaScript沒有收到任何地方的會話變量。。會話變量設置正確並且持久，但是因爲我需要會話變量所採用的JavaScript，所以讓變量具有一定的意義。

一個解決方案可能是我設置一個post終點並創建第二個ajax請求。但是，這會創建大量額外的代碼，包括另一個終點，以及另一個控制器操作，以及javascript。

因爲Rails沒有真正提供讓JavaScript與會話變量交互的好方法，所以對於這個特定的問題，我決定在客戶端100％處理問題並創建瀏覽器cookie會更好。我使用了cookie.js庫並相應地設置了cookie。我完成的代碼最終看上去像這樣：

JAVASCRIPT：

$(document).ready(function(){ 
    Cookies.get(); 
    initializeSideNav(); 
}); 

// Checks the current status of the side menu 
function initializeSideNav() { 
    if (Cookies.get("collapsed-side-nav") === "true") { 
    collapsedSideNav(); 
    } 
} 

// collapsible side-nav functionality 
function collapsedSideNav(){ 
    $('.side-nav').toggle(300); 
    $('#collapse-side-nav').css('display', 'none'); 
    $('#expand-side-nav').css('display', 'inherit'); 
    $('.container').animate({ 
    'padding-left' : 0 
    }, "slow"); 
    $('.row').css({ 
    'max-width' : '98%', 
    'margin-left' : '1.15rem' 
    }); 
    Cookies.set('collapsed-side-nav', true, {path: '/'}) 
    console.log(Cookies.get()); 
}; 

// expandable side-nav functionality 
function expandedSideNav(){ 
    $('.side-nav').toggle(325); 
    $('#expand-side-nav').css('display', 'none'); 
    $('#collapse-side-nav').css('display', 'inherit'); 
    $('.container').animate({ 
    'padding-left' : 200 
    }, "slow"); 
    $('.row').animate({ 
    'max-width' : '95%', 
    'margin-left' : 'auto' 
    }); 
    Cookies.set('collapsed-side-nav', false, {path: '/'}); 
    console.log(Cookies.get()); 
}; 

// DOM Events for collapsing and expanding side-nav 
$('#collapse-side-nav').click(function() { 
    collapsedSideNav(); 
}); 
$('#expand-side-nav').click(function() { 
    expandedSideNav(); 
});