在用户登录或未登录时实现条件导航栏的策略

<!-- 未登录时的导航栏 -->
<nav id="nav-logged-out">
  <a href="/login">登录</a>
  <a href="/register">注册</a>
</nav>

<!-- 登录后的导航栏 -->
<nav id="nav-logged-in" style="display: none;">
  <a href="/profile">个人资料</a>
  <a href="/settings">设置</a>
  <a href="/logout">注销</a>
</nav>

// 检查用户登录状态的函数
function checkLoginStatus() {
  fetch('/api/check-login')
    .then(response => response.json())
    .then(data => {
      if (data.isLoggedIn) {
        document.getElementById('nav-logged-out').style.display = 'none';
        document.getElementById('nav-logged-in').style.display = 'block';
      } else {
        document.getElementById('nav-logged-out').style.display = 'block';
        document.getElementById('nav-logged-in').style.display = 'none';
      }
    });
}

// 页面加载时检查登录状态
window.onload = checkLoginStatus;

# 示例使用Flask框架
from flask import Flask, jsonify, request

app = Flask(__name__)

@app.route('/api/check-login', methods=['GET'])
def check_login():
    # 这里假设使用Session来管理登录状态
    is_logged_in = 'user_id' in session
    return jsonify({'isLoggedIn': is_logged_in})

if __name__ == '__main__':
    app.run(debug=True)