When it comes to cross-page communication, the first thing that comes to mind is the a tag, window.open, and iframe. Let’s talk about the general business scenario first. The background management system designs the topology map of switches, routers, etc. (open a new window when creating it, and save the design topology map in the new window and feed it back to the parent window for the next step), and the foreground user interface displays the background creation. The topology map is for operation (embedded iframe). The topology map uses mxgraph, which is integrated with the vue project, which is not shown here. Then, all kinds of painful problems followed.
The related functions in the background include design and preview. The design is an interactive process. Click to create > go to the creation page > add other relevant information (title, description, file, etc.) > click the design topology map to open a new window > load topology data in the new window > Design Save > Notify the main window, the new window is closed > Click Save to complete the creation of the main window; the preview process is to click Preview > Get topology map parameters through the interface, open a new window according to the parameters, and display the topology map.
The function of the foreground is to present each topology map newly created in the background to the user, and the user can achieve the purpose of training by operating the topology map.
Then, let’s talk about the problems encountered between them. Although the scenes may be different, the description of the scenes will always make people feel foggy unless they have experienced it in person, but the subdivisions to the implementation steps are all real Cut the hole, maybe can help, if the problem is similar.
To be honest, I don’t really like this iframe. How should I put it? First, this window will be blocked before the content of the iframe is loaded, and the game experience is extremely poor; The windows opened by the iframe have complete control over the parent window, and they can do whatever they want by calling window.openner, but on the other hand, unless they are of the same origin, it will not stay cool; thirdly, there is a called ligerui The front-end framework (I heard that it was very popular in the past few years, many traditional old projects of the company use this), and each component in it is iframe at every turn.