Angular 2 pass JSON object to new window - javascript

I need to pass JSON object in new window which is opened using window.open()
I have requirement to display stored data in database into new window. At the same time i need to pass a JSON object which is available in current open window to this new window.
Possible ways I had :
Can save json in cookie before open new window, and read it in
ngOnInit() then remove it from cookie.
Can pass required data in URL, but i have large JSON object
Please guide if we can do this by any another approach.
Thank you.

You can use localStorage too instead of cookies. I don't think you have better options if you have to use window.open().
To keep each component functionality self-contained I would use a service to get the json based on the id.

I think you can use Window.postMessage. window.open will return a Window object that you can call postMessage on; in the new window, you'll want to listen for the "message" event on the global window object.
Note that IE8 and IE9 don't support it for windows, only (i)frames.

Instead of cookies or localstorage, how about you use the window object you get when open the window.
var opened_window = window.open('someurl_here');
opened_window.json_data = JSON.stringify(this.local_json_data);
In the child window, you can access the data as part of your window object.
//Inject your window into this component (#Inject('Window') window maybe)
this.new_json_data = JSON.parse(this.window.json_data);
I think this should work.

Related

How to use window.open with state data (React)

I'm trying to replace history.push to window.open (to of course open in a new tab). I tried to use query params to access my state's data to be fetched in the new tab.
window.open(`/${db}/endpoint?var1=${link.var1}&var2=${link.var2}`)
Anyone has a tip for this problem? Thank you!
If you use window.open then the script will be loaded from scratch in a new tab (will not be connected to the previous tab in anyway), so either you have to load data from local storage if you want to share some data between sessions or tabs.

How to store window references in a cookie?

I'm opening a window as
winRef = window.open(......);
Then I'm storing the above winRef in cookie so that I can get the reference to child window even if the parent refreshes.
That didn't work because when I tried to save winRef in cookie it just saves the text representation/string of the object so you only have "[object Window]" as string, it's not an object.
Is there any way to store the window reference as a cookie? If it's not possible then what are some other possible methods which I can use?
PS: I think storing just the window name instead of window object in the cookie can solve the issue but it can't be done in my case, I can't provide window names, basically the window is an online editor, if I give a particular name to it then user can't open multiple online editors as it will always reload the currently opened window.
Ultimate goal: Retrieving references to child window if the parent refreshes
First excuse me for my poor English ;-)
A possible workaround for this problem is to set a name in the window.open function (eg: popup = window.open(URL, popup_window, specs, replace)
Then save popup in a cookie.
When retrieving the cookie, you'll get the [object Window] as you said.
eg: popup = getCookie('popup');
After just do the following :
if (popup == null) {
//No popup
} else {
//Popup exist, retrieving is ref
popup = window.open("" ,"popup_window");
}
Just reuse the window.open function, just with the same name (popup_window) and no other arguments, as this window already exist no further actions will be performed just returning the popup_window ref.
Variables are abstractions that live on primary memory (aka RAM) and in the scope of a running process or thread. You just can't store them anywhere else.
Particularly, cookies are plain text. They are sent as HTTP headers and they're often stored in text files. So to answer your question: no, you cannot store a JavaScript object of type window in a cookie.

Is it posible to open a window then close the window in javascript?

I am not sure how to get by this one. I am using openId with the dotnetopenauth library.
I have some predefined provider that when clicked does a jquery post to the server and does a request to the provider.
I get the url back from provider and I do window.open(....) and open it as a new window with a predefined height and width.
Now they log in and do all that great stuff. Now the provider sends me their information to a controller method that I specified.
Now after I authenticate them I want to go to a new page. However I want to the page to open in the main window and no the window that I opened with window.open(). I want that closed and gone.
I can't get it to work. It will just start using that window.open() window to load all the pages in and I don't want that.
So I no clue what to do.
You just need to keep a reference to the first window around:
var oauthWindow = window.open(....);
later:
oauthWindow.close();
It's a complicated piece of work to get right, to be sure.
A couple of good examples are:
NerdDinner (source)
DotNetOpenAuth ASP.NET MVC 2 project template

Detect if a form POST browser window is open in Javascript?

I have a form post method, which is used to show a new page. Its done this way so that the arguments used cannot be seen in the location bar.
Each window is given a unique name, but I want to be able to detect if this browser window is already open, so that calling this form again will not force that current browser window to auto-fresh.
Any suggestions?
I assume you're opening new windows in Javascript. So, assign a variable name to your new window (e.g. var newWin1 = window.open(...))
Then test to see if the document of your window exists:
if(newWin1.document) { alert("Window is open!"); }
else { alert("Window is gone!"); }
For a security note: people can still see the post data you're sending with any HTTP header tool. Check out LiveHTTPHeaders for Firefox (or a million others) to see what I mean.
Another note: Not sure what you're doing, but people don't like when a webpage does things without them asking it to (like opening windows). You may want to consider improving your design to a more user-friendly method.

Request-URI Too Large window.open - workaround

I am opening a window and passing set of parameters to it. In this case, I am sending json string. At time, the info is toolarge, and Request-URI Too Large occurs.
window.open('../pssops21/php/createPhonePdf.php?strSelectedItems='
+ strSelectedItems + '&strQBNumbers=' + arrQBNumbers, 'mywindow',
'resizable=1, scrollbars=1, left=80,top=60, width=650, min-height=400')
Window.open does not have option to post. Jquery ajax only posts info retrieves, results and does not open a new window.
Are there any methods to do this?
Thanks.
Unfortunately this is tricky situation in web applications. The limit on the size of a URI is typically dictated by the browser you are using and the option to POST data is not a standard available. As for doing an Ajax post and then "loading" the results, is typically not supported for security reasons.
A workaround I have used in the past is to make it a two-step process. Basically use Ajax to post your json data to the server. As a response, have the server send back some kind of token to retrieve the stored data. Then, use that token as a parameter to the new window you are opening, who can then retrieve the data.
I know it is a little bit more work to get the data over to your new page, but it does eliminate these size/security restrictions, and is a cross-browser safe.
You could open a new window to a temporary page, then POST from that page in the new window using a form filled out by JavaScript in the original page.
You could use a hidden form that has your destination page as its target. Use hidden fields for your post values, and submit the form using the Javascript submit() method.
I believe this will only work if you're trying to redirect the current window, not open a popup, although there may be a way around that restriction as well.
Rather than embedding information to pass to the window in the querystring, you can use javascript directly. Using window.opener on the newly opened window, you can access info from the child page:
var selItems = window.opener.strSelectedItems;
Keep in mind that strSelectedItems in this case would need to be globally scoped in the parent page. To keep things clean, I would consider functions on the main page that will return the information the child page needs.

Categories