preface

Some time ago, I wrote an article about how I used these three small tools to help my sister improve 100% development efficiency, which introduced how to use the three most basic front-end knowledge to help partners improve daily development efficiency.

This article, however, takes just three minutes to read and you don’t need to learn three gadgets to get there:

How can you use four lines of least technical code to solve the most practical problems and increase development efficiency by 100%

Of course, the most important thing is that little sister gives you a bang

background

Most companies will have security checks for opening web pages in the APP (the general test environment will open the check), and links that do not conform to the security policy are not allowed to be opened. Although this eliminates security risks, it seriously affects development efficiency and experience in some scenarios.

For example, next to the little sister recently encountered a problem:

Due to the security restrictions of the company’s PC client, it is not possible to directly open the local link (the following three types) for web debugging, which is quite troublesome and worrying in the development stage and when using local code to debug problems on the line.

http://192.168.35.220:8080/yuer-talent-center/index/talent/singer

http://127.0.0.1:7001

http://localhost:8080
Copy the code

Previous solutions

Target page (debug page) : http://192.168.35.220:8080/yuer-talent-center/index/talent/singer

Auxiliary page: uat-h5.xxx.com/yuer/voice-…

As shown in the figure above, the direct configuration link cannot pass the security check, and the jump to the target page can be completed by using a page that can pass the security check and adding a button to the page.

What’s the problem?

You need to modify the code for another project, add a button jump event, and then publish the project. This process will add irrelevant logical code to another project, and need to wait for its release, the process is long.

1. Forgot to delete the code, easy to cause online quality problems; 1. Cannot directly verify, need to wait for another project release completionCopy the code

Redirect resolution

The source of the problem is that the client will do a security check on opened links. Local links do not meet the security standards, so they are not opened. We need to solve this problem from the perspective of bypassing the check. Reduce step 1 above and directly configure the address of the page to be debugged.

Solution 1

Push the client test environment without security verification, and the online environment should not be removed.

Advantages: Once and for all, test environment local links always support access

Disadvantages: The online environment is not supported, and when you need to debug an online problem using native code, you still can’t solve it

Solution 2

Develop a service with a domain name, real-time proxy to the local development resources, and then through the configuration of the domain name to debug the page

Advantages: Both test and online environments can be directly proxy to the local, bypassing PC security checks.

Disadvantages: large development workload, no manpower support in a short time

Solution 3

Develop a page redirection function, PC side access is legitimate links, through the server redirect to the target page, bypass PC security check

Advantages: once and for all, both testing and online support, and the redirection function domain name is the Intranet link, no external exposure of potential security risks, the development of small workload

Disadvantages: did not think of disadvantages 😄

Four lines of implementation code

The idea is to add a 302 redirection function to the existing public Node service

Configure the routing

router.get('/redirect', redirect.redirect)
Copy the code

controller

async redirect() {
  const { redirectUrl = ' ' } = this.ctx.query
  redirectUrl && this.ctx.redirect(decodeURIComponent(redirectUrl))
}
Copy the code

Yeah, it's just those four lines of code

Is it too simple, so simple that it is outrageous, hateful, and spitting!! Not a bit technical

Is it too simple, so simple that it is outrageous, hateful, and spitting!! Not a bit technical

Is it too simple, so simple that it is outrageous, hateful, and spitting!! Not a bit technical

How to use

Just add the link you want to jump to on the redirect link

// If the URL has Chinese characters, EncodeURIComponent is needed at https://test-fe.xxx.com/redirect?redirectUrl=yyy // for example https://test-fe.xxx.com/redirect?redirectUrl=http%3A%2F%2F192.168.35.220%3A8080%2Fyuer-talent-center%2Findex%2Ftalent%2F singerCopy the code

At the end

In addition to open sen, or open sen, today’s dream is sweet 😄, I wish you a happy Mid-Autumn Festival in advance, good night!