Some explanations about document. Domain

【Abstract]
It is estimated that the problem encountered when imitating Gmail-chat is also caused by document. domain, so I found some information and was more confident after reading it. Because the "no permission" exception is so similar to "Access Denied.

[Full text]
I encountered a problem when I revised the company's original web applications a few days ago. At that time, I needed to extract some of the original applications and replace them with a more general one, the original application interfaces are retained. The original application belongs to the news.mycompany.com domain, and the new application will be deployed to upload.mycopany.com. When I tried to transfer data from a new domain to news.mycompany.com, I encountered an "Access Denied" error message returned by the browser at the front end, find the problem by referring to a large number of English documents found in Google, and specify docment for pages in two domains. the domain attribute partially solves the problem. Later, Google was launched to search for and document. domain-related Chinese documents, but most of the obtained articles are about network security. Few articles mention the document on the specified page. the domain attribute can realize data exchange between two domains, so I decided to write this article, hoping to implement it.

Keywords: JavaScript, domain, Access Denied
Question proposal
When developing a web application, you often encounter the need to transmit data between two frames. The frame here can be a frame in the frameset or an independent window. A common case is that one frame is the subject of the application, and the other frame provides some options for the user to choose. After the user selects the frame, this frame sends the user's choice to the server and transmits some information to the main frame. The information here may be the user's choice or the data returned by the server. It is easy to implement when the content in two frames belong to the same domain, but the problem becomes complicated and tricky when they belong to different domains, this involves the security of data access. If the problem is not solved, an error message "Access Denied" is returned by the browser.
Possible solutions
The following describes how to transmit data between frames in different domains through several experiments.

1. Transmit data between two frames using client scripts (such as JavaScript) and window handles
2. Transmit data between two frames using the dialog box provided by MSIE
3. Transmit data through session using server applications

Solution 1
Using client scripts to implement data exchange between two frames should be one of the most lightweight methods. This will not increase server load or occupy network bandwidth, and data exchange will be completed on the client. Next let's take a look at how client scripts (taking JavaScript as an example) and window handles implement data exchange in a domain.

We use an example to describe the following: If you need to provide a news input interface, you can use it to enter the original news content and embed an image in it. To implement this functional interface, we have designed two frames, or two windows:

1. Main Window: The main editing interface of news content. You can enter the news title, author, news subject, and other content in it. You can also preview the uploaded picture in an image box.
2. Pop-up window: processing image upload interface. You can select a local image for upload. After the upload is successful, it returns the URL of the file on the server to the main window for preview.

For the sake of simplicity, we assume that the content of the two windows is static. The Main Window Corresponds to newsedit.html, And the pop-up window corresponds to imgupload.html (in most cases, the content of both windows should be dynamically generated ).

Newsedit.html is located in the home directory of news.mycompany.com, and its source code is as follows:

<! -- File: newsedit.html (http://news.mycompany.com/NewsEdit.html) -->
<HTML>
<Head>
<Title> the content editing interface </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312">
<Script language = "JavaScript">
<! --
/* Openwin is used to display the content of imgupload.html in a pop-up window */
Function openwin () {// open window
Url = 'HTTP: // news.mycompany.com/upload/imgupload.html ';
Newwindow = Window. Open (URL, "imgupload", "Height = 135, width = 300 ");
If (! Newwindow. opener) newwindow. Opener = self;
}
-->
</SCRIPT>
</Head>

<Body>
<H2> edit your content here </H2>
<! -- Call the background application newsedit to save news content -->
<Form action = "http://news.mycompany.com/newsedit" method = "Post"
Name = "addnews">
<! -- News title -->
Title: <input type = "text" name = "title"> <br>
<! -- News author -->
Author: <input type = "text" name = "author"> <br>
The content <br>
<! -- News content -->
<Textarea name = "contentbody" Cols = "100" rows = "10"> </textarea>
<Br>
<! -- Click Connect to open a small window for uploading images -->
<A href = "javascript: openwin ()"> upload image file </a>
<Br>
<! -- Userimg is used to preview the uploaded image file. -->

<Br>
<Input type = "Submit" name = "savecontent" value = "Submit">
<Input type = "reset" name = "clearcontent" value = "reset">
</Form>
</Html>

Imgupload.html is located in the upload subdirectory of news.mycompany.com. Its source code is as follows:

<! -- File: imgupload.html
Http://news.mycompany.com/upload/ImgUpload.html -->
<HTML>
<Head>
<Title> imgage upload interface </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312">
</Head>

<Body>
<H2> Image Upload </H2>
<! -- Call the background application to process uploaded images -->
<Form action = "http://news.mycompany.com/upload/imgupload" method = "Post"
Enctype = "multipart/form-Data" name = "Upload">
<! -- Select a local file -->
<Input type = "file" name = "imgfile">
<Input type = "Submit" name = "Submit" value = "Upload">
</Form>
</Html>

1. Newsedit: In the home directory of news.mycompany.com, receives POST requests and stores the news elements on the editing interface to the background database.
2. Imgupload: Located in the upload sub-directory of news.mycompany.com, receives the user's POST request, uploads the local image file to the server, and returns the complete URL of the image file.

The following is the page content returned after the POST request is processed by imgupload. The content is displayed in the pop-up window occupied by imgupload.html:

<HTML>
<Head>
<Title> File Upload successfully </title>
</Head>
<Body>
<H3> File Uploaded successfully! </H3>
<Script language = "JavaScript">
<! -- Get the handle of the main window -->
Parwin = self. opener;
<! -- Obtain the reference to the IMG element and assign it to the src attribute of the IMG element with the URL of the uploaded file
Value, so that you can preview on the client -->
<! -- To simplify the problem, we will directly write the reference to the IMG element in the program -->
Parwin. addnews. userimg. src = "http://news.mycompany.com/img/2003_07/06/1057478464859.gif ";
</SCRIPT>
</Body>
</Html>

Now, our first experiment has been successful. The experiment results show that when the content in the two frames belongs to the same domain, there is no problem in using client scripts and window handles to transmit data. Next we extract imgupload.html and imgupload from news.mycompany.com, deploy them to the corresponding directory of img.mycompany.com, and modify the URL when imgupload.html is used in newsedit.html. In this way, when we try to use JavaScript to transmit data from img.yourcompanu.com to bbs.yourcompany.com, the "Access Denied" error box will pop up in the browser, indicating that we have violated his security policy, and the data cannot be transmitted normally.

The error message "Access Denied" is displayed because:

"Why do I still encounter the" Access Denied "error even if my two pages belong to the same domain ?" If this is the case, check whether the content in the pop-up window always belongs to the same domain. Check whether your imgupload.html calls applications in other domains, and the application re-writes the content in the window. If so, your pop-up window will deteriorate and it will last belong to another domain, of course, you will encounter an "Access Denied" error.

Yes, some browser developers and development groups have made some adjustments to the original policy when developing high-version browsers. These adjustments have brought us a glimmer of vitality: when two pages exchange data, the browser first compares the domain attributes of the two pages. If the domain attributes are the same, the Browser allows data exchange between them, otherwise, the error "Access Denied" is returned.

By adding the above statement, you can blind the browser and exchange data between pages in two different domains. However, it should be noted that the preceding statement is valid only when it is added to all files for data exchange. It does not work if it is added only to files in a domain. In addition, it is recommended that the declaration part be inserted to the "What is the limit code for using this method ?" There are still many restrictions on using this method to transfer data between different domains, mainly as follows:

Solution 2: Let's take a look at whether the dialog box provided by MSIE can solve the problem of data exchange between two domains. First, let's briefly introduce the MSIE dialog box: the showmodaldialog and showmodelessdialog methods provided by MSIE can be used to display a modal or non-modal dialog box in a single frame. Both methods use a URI parameter to specify the content in the dialog box frame; the optional parameter varguments is used to pass Parameters of any type (including array type) to the dialog box frame. The optional parameter sfeatures is used to define the Display Effect of the dialog box frame, such as location and font. Note that the Netscape Navigator, Mozilla, and opera browsers do not have the corresponding method, that is to say, several other browsers except MSIE do not support the showmodaldialog or showmodelessdialog display dialog box. If you are interested, here is an article to teach you how to simulate a modal dialog box in other ways, for details, see Simulating Modal Dialog windows.

"So I can not blind the browser by forcibly specifying the document. Domain attribute of two pages as in solution 1, so that the two pages belong to the same domain ?" Some people have put forward this idea, and I have tried to do so, but it still ends in failure: forcibly specify document on two pages. after the domain attribute is configured, the dialog box does not recognize the parameters passed from the home page, no matter whether the two pages belong to the same domain or not.

1. Main.html: deployed in a.mycompany.com. Two other files are referenced by calling showmodaldialog.
2. Localdialog.html: deploy it with main.html at a.mycompany.com
3. Remotedialog.html: deployed on B .mycompany.com. Its content is exactly the same as that of localdialog.html.

When main.html calls the showmodaldialog method, varguments passes the parameter "Can you hear me? ", You want the dialog box to receive this parameter. If the dialog box receives this parameter, it calls window. the Alert () operator prints this message, and then returns a result to main.html: "Yes I do, I hear you from" + document. domain parameters if main.html receives the result returned by the dialog box, it also calls window. alert () prints the result.

The source code of localdialog.html(remotedialog.html) is as follows:

<HTML>
<Head>
<Title> A remote dialog </title>
<SCRIPT>
<! --
// Document. Domain = "mycompany.com ";

Onload = function (){
VaR ARGs = Window. dialogarguments;
Alert ("You send me:" + args. content );
Btncan. onclick = function (){
Window. returnvalue = "Yes I do, I hear you from" + document. domain;
Close ();
}
}
-->
</SCRIPT>
</Head>

<Body>
Im here, Im a dialog <br>
I will return something to the main window <br>
<Input id = "btncan" type = "button" style = "text-align: center;" value = "close">
</Body>
</Html>

1. Main.html can normally receive the results returned from the dialog box. Whether the dialog box is a.mycompany.com or B .mycompany.com, or whether the document. Domain attribute is set or not;
2. When document. domain parameters are not set, localdialog.html can normally receive the parameters passed from main.html. However, if document. domain parameters are set, the parameters read by localdialog.html become null.
3. Regardless of whether the document. Domain attribute is set or not, the parameters passed from main.html in remotedialog.html are always null.

Unfortunately, the results of the experiment tell us that this cross-domain data exchange cannot be achieved through the dialog box.

Note (2004-12-28): You may get different test results during the test, because with the update of IE or the effect of patches, this cross-Origin data exchange behavior may be adjusted. The response does not always receive the data returned from the B .mycompany.com-affiliated dialog box. Only when both of them set the document. Domain attribute to mycompany.com and main.html can they receive the results returned by the dialog box. See related discussions: About showmodaldialog "even though there is no mention in the documentation of passing arguments or returning a value being blocked in the cross-domain case, I think that may be actually have changed as the consequence of one of the * identical * ie upgrades and/or security patches."

In summary, in the three solutions described above, apart from the fact that solution 2 is not yet able to exchange data between frames in different domains, it has been proved that solution 1 and solution 3 are feasible, however, the two solutions have their own advantages and disadvantages:

In addition, if you have other options, thank you very much for informing me via email to fill in the gaps in this regard. Thank you!

References

1. What does the IE "access is denied" error mean?
2. The http://www.dannyg.com/ref/jsminifaq.html#q15 property: Document: domain
3. Http://www.powermct.co.kr/teched/ecma/doc_domain.html writing cross-domain Web Applications
4. Http://www.knownow.com/support/devguide/Tutorials/Cross_Domain.html
5. Why do I get "Access Denied"-error in IE when calling a function in another frame?
6. Http://www.faqts.com/knowledge_base/view.phtml/aid/1524/fid/127 about showmodaldialog
7. Http://www.codecomments.com/IE_Scripting/message180995.html