WONDER's Notes

遇到的问题

按照 LineageOS 官网指南操作，需要先将手机升级至一加 7 最新的官方系统氧OS12，然后再使用 fastboot 进行 OEM BootLoader 解锁，但解锁过程中遇到报错：(remote: 'Device cannot be unlocked for technical reason.')。

经查阅 reddit，无法正常解锁的问题需要回退版本至氧OS11或更早版本，解锁 OEM BootLoader 后再升级回氧OS12，升级完成后再按照 LineageOS 官网操作。

The conclusion is that it is not recommended to flash a third-party ROM.

Unlocking the Bootloader

Before flashing a third-party ROM, you need to unlock your phone’s bootloader.

1. Navigate to 【Settings】 -> 【My device】 -> 【Detailed info and specs】. Tap 【MIUI version】 ten times to enable 【developer mode】.

2. Navigate to 【Settings】 - 【Additional settings】 - 【Developer options】 - 【MI unlock status】. Bind your XiaoMi account to device.

   After bind your XiaoMi account to device, you will receive a notification that you can unlock your bootloader after 7 days(168hours).

   Avoid tapping it repeatedly, as it resets the countdown, requiring another 168 hours of waiting.

3. Download miflash_unlock_7.6.727.43.zip from the official XiaoMi unlock site. Unzip the file, and log in with your XiaoMi account. (Note: Some computers might require driver installation if prompted).

4. Power off you phone, then press 【power】 + 【volume -】 to enter fastboot mode. Connect your phone to your computer via USB cable. Click 【unlock】 in the miflash_unlock software. Keep in mind that this operation will erase your data, so make a backup if you needed.

Getting Start

Installation

We’ll download Rust through rustup, a command line tool for managing Rust versions and associated tools.

Command Line Notation

Lines that you should enter in a terminal all start with $. You don’t need to type the $ character; it’s the command line prompt shown to indicate the start of each command. Lines that don’t start with $ typically show the output of the previous command. Additionally, PowerShell-specific examples will use > rather than $.

问题描述

在访问网站链接时，我们通常不会注意链接的末尾是否加了/，如果我们没有加/，那么 Nginx 会自动使用 301 重定向，帮我们加上/，以确保访问的是目录。

若 Nginx 前端还有其他服务（如负载均衡），且这个服务的端口与 Nginx 服务端口不一致时，Nginx 的自动重定向就会导致端口错误。

例如443端口为负载均衡服务，8080端口为 Nginx 服务，对443的访问最终都回落到了8080下，那么我们访问https://www.example.com/foo时，由于链接最后没加/，Nginx 会自动重定向补/，我们期待的结果是https://www.example.com/foo/，但实际结果为http://www.example.com:8080/foo/，重定向带上了原始服务的端口。

If you are facing issues with the transition of a element from height: 0 to height: auto, resulting in a jerky or stuck animation, there is a simple solution to this problem.

The problem arises because the final height of the element is unknown as it depends on the content inside it. CSS transitions work by calculating the difference between the initial and final states of a property and animating that difference over a specified duration. However, since the final height of the element is not known in advance, the browser cannot calculate the difference and therefore cannot create a transition between the two states.

If you’re upgrading Node.js to version 18 and your old code repository, built using an earlier version of Node.js, is no longer running properly due to changes in the dependencies within the node_modules folder, don’t worry. Let’s explore some solutions to fix this problem.

Can’t Install Properly

If you’re having trouble running npm install properly, and you have already tried running npm cache clean --force, deleting node_modules folder, package-lock.json file and then running npm install again, but still encounter issues due to dependencies version conflict in the new peer dependencies’ rule. You can try this command instead:

npm install --lagacy-peer-deps

Introduction

The element is positioned according to the normal flow of the document, and then offset relative to its nearest scrolling ancestor and containing block (nearest block-level ancestor), including table-related elements, based on the values of top, right, bottom, and left. The offset does not affect the position of any other elements.

This value always creates a new stacking context. Note that a sticky element “sticks” to its nearest ancestor that has a “scrolling mechanism” (created when overflow is hidden, scroll, auto, or overlay), even if that ancestor isn’t the nearest actually scrolling ancestor.

An HTTP cookie (web cookie, browser cookie) is a small piece of data that a server sends to a user’s web browser. The browser may store the cookie and send it back to the same server with later request. Typically, an HTTP cookie is used to tell if two requests come from the same browser – keeping a user logged in, for example. It remembers the stateful information for the stateless HTTP protocol.

Cookies are mainly used for three purposes:

1. Session management: logins, shopping carts, game scores, or anything else the server should remember.

2. Personalization: user preferences, themes, and other settings.

3. Tracking: recording and analyzing user behavior.

为什么推荐使用 flex 缩写语法

CSS 官方文档明确推荐 flex 属性使用缩写语法，因为单值属性所对应的计算值根据开发者日常使用进行了优化。按照以往经验，缩写语法缺省值应该使用默认值。但 flex 语法不同，单值缩写与双值缩写都是截然不同的计算结果。另外一个原因则是 flex 长语法有更高的理解成本，门槛较高，因此更推荐使用单值缩写语法。

使用 flex 缩写语法的场景

Questions

When you have deployed your own gitlab service on web, you may need to use a custom SSH port to clone, pull, or push your code from or to your server. The default SSH port 22 is used by the system SSH service, so you must choose another port for your gitlab service.

After you get everything done, you may find that you can’t clone your repository because of the access error. If you check carefully, you will find that the default git url is scp-like syntax. You can’t change port to your custom SSH port.

git clone user@hostname:/path/to/repo.git

output

ssh: connect to host [hostname] port 22: Connection timed out
fatal: Could not read from remmote repository.

Please make sure you have the correct access rights and the repository exists.