Cross-origin access solution for Web Applications

Anyone who has worked on AJAX development across multiple websites knows that if we want to use Ajax on website a to obtain specific content on website B, if website a and website B are not in the same domain, a cross-origin access problem occurs. Cross-origin access of AJAX is a common problem for existing Ajax developers.

For cross-origin access, IE prompts a warning box to remind you. If a user adds the website to a trusted website or lowers the security level, ie will not remind you of this issue.

If Firefox or other non-Microsoft browsers encounter cross-origin access, the solution is to reject access.

Some people say that IE is a mainstream browser, as long as it can be used normally. Although Ie can handle this problem, there is a premise that you can either click yes after the warning box pops up on the page (click NO to execute the Ajax call ), you can either add the website to a trusted site. These two methods are common in the application of enterprise management systems, because the system administrator can use administrative means to ensure user behavior. However, this approach does not work for website or portal development on the Internet.

I recently encountered this problem. I need to finish some special effects on the main window after cross-origin access, search for some materials, and perform compatibility tests in different browsers, several feasible solutions are found:

1. Web proxy method. That is, the cross-origin access requests to website B generated when you access website a are submitted to the specified page of website a. The page replaces the user page to complete interaction and return appropriate results. This solution can solve most of the Cross-origin access problems that can be considered at this stage, but requires website A to provide support for Web Proxy. Therefore, website a and website B must work closely together, in each interaction process, the server load of website a increases and the session status cannot be saved on behalf of users.

2. On-demand mode. Mymsn portal uses this method, but mymsn does not involve cross-origin access. Dynamically control the generation of SCRIPT tags. You can call cross-origin pages by modifying the src attribute of SCRIPT tags. This solution has the defect that the get method is adopted when the src attribute of the script completes the call. If the string passed during the request is too large, it may fail to run normally. However, this solution is very suitable for aggregation portals.

3. IFRAME mode. After checking a post about cross-origin access on javaeye, he mentioned that he has used IFRAME to solve cross-origin access problems. The IFRAME method can be used to submit and obtain data. However, because the parent window cannot interact with the Child Window (in the case of cross-origin access, this interaction is denied ), therefore, the effect on the parent window cannot be completed.

4. Local User dump mode: the feature that IE is attached to the Windows platform provides us with an IFRAME-based "Bypass" solution using memory, that is, data can be transmitted between two windows Windows through the windows clipboard on the client. You only need to set interval on the receiving side for polling. After obtaining the result, you can clear interval. The platform independence of FF determines that it does not support the clipboard method. In the previous versions of FF, the plug-in vulnerability has been fixed, so FF cannot complete the dark Data Warehouse through memory. Because the file operation FF does not provide support (data transmission cannot be completed through cookie cross-origin), this technical method can only be used in IE.

5. My own method to solve this type of problem: in combination with the previous methods, when accessing website a, I first request website B to complete data processing, and then obtain the desired result based on the returned ID. The disadvantage of this method is also obvious, and the load of website B is increased. The session is also maintained, and the interaction between website a and website B is enhanced. Most importantly, this solution satisfies all my needs.

To sum up, I recommend the on-demand method when you can select the above scheme. This method can solve most of your problems without submitting a large amount of data.