B站(bilibili.com)的前端新旧版代码切换是如何实现的?

技术栈:Vue全家桶
目前想做一个类似换肤的功能,但是并不只是替换样式,而是页面结构也发生改动。
看了一下现有的网站发现B站的新旧版切换功能比较类似,靠cookie的intver值控制版本,但是具体的实现方式还是搞不清楚。
目前的想法是在main.js里判断cookie值然后引用不同的router文件进行控制,但总感觉这样代码管理起来很困难,希望有经验或想法的能提点一下思路或者解决方案。感谢!

已解决 悬赏分:70 - 解决时间 2021-12-03 08:27
反对 0举报 0 收藏 0

回答3

最佳
  • @

    b 站新旧版本目测是两套前端代码了,根据 cookie 值后端来决定是走新版的 html 还是旧版的 html 入口。

    支持 0 反对 0 举报
    2021-12-02 11:00
  • @

    这玩意儿是后端 Web 服务器甚至网关层就直接把流量切走了,不是你前端写代码实现的。标准的 A/B Test 方案,业内基本都是一样的,请求首页的时候按照某种策略一部分用户用新版、一部分用户用旧版,可以很方便的观测新版有没有 Bug,然后逐渐加大被分配到新版的比例。

    至于你看到的那个 Cookie,只是用来标识用户被分到 A/B 哪组了而已,省的同一个用户今天打开是新版、明天再打开又变旧版了,避免画风来回切换。

    支持 0 反对 0 举报
    2021-12-02 12:18
  • @
    1. What is a Cookie and what is it used for?

    Cookies are small files that are stored on the user's computer. It is designed to hold user data for some sites, allowing the server to customize the content for such users, whose page code can fetch the Cookie value and send it to the server. For example, the location is stored in the Cookie, and the location is located by default every time you enter the map.

    1. How can I get the contents of Cookie? Can I check the Cookie on my computer?

    Cookies can be obtained through Web Server or client browser. Most browsers can be configured to allow users to access Cookies, but note that Cookies cannot be Shared between different sites. Open the Chrome debug window to view it in the Cookie sidebar of Resource, or enter document.cookie in the console, which is viewed on the computer upstream, and see the following example in another server.

    1. When is the Cookie generated and what is the complete process of generation, transmission and use?

    Writi

    支持 0 反对 0 举报
    2021-12-02 13:31