I was wondering if there was anyway I could make another browser within my webpage. Basically I want this browser to be an interactive area on my webpage (about half the page).
The main page should be able to detect where every click was made within the mini browser.
Is there some apis that would help me out? Or would my best bet be to stream a remote desktop?
Programming your own browser engine in Javascript will take you years, and it will inevitably be slow, cumbersome, and prone to errors. Furthermore, your Javascript cannot really have direct access to other website's HTML code, it will have to go through your own server anyway.
You can use an
<iframe>
tag. To detect clicks and mouseovers, you could transform the HTML on your server first, potentially adding "onclick" events. This would let you have XSS access too, and cookie control.
You can embed another page within yours using an <iframe>. Once you do, however, you can't control much of what happens within it, or detect where clicks are made, unless the page within the iframe is from the same domain, for security reasons.
You could try the <iframe> tag.
No, it really can't work that way. My suggestion would be to embed an iframe and then control it using JavaScript. However, you won't be able to control it very well (like, for example, limiting where the user can browse with it).
Related
I saw How to hide html source & disable right click and text copy? . One of the answers say use ctrl+u to view the source. But, using shortcut.js I can override ctrl+u as well. How do I view source in that case.
There is no way to prevent this. Someone could easily download the page using a non-browser tool like curl or wget, or log all HTTP traffic with Wireshark.
Use this. http://www.fiddler2.com/
Depends on the browser, but you can go to View -> Page Source in most to view the source. You cannot override that, however.
Furthermore, it's considered bad practice, and someone could also just as easily override the functionality through a tool like Firebug.
You can't stop people. It will be passed over the network, and sniffable through Fiddler, or someone can use a text based browser, or disable Javascript entirely, or look through their cache folder for the files they downloaded from your site.
You cannot stop people from seeing your source.
Well it's not possible to prevent users from seeing your script. But what you can do is to make it mire harder that user quits trying after few common methods.
I recommend you to load an initial page. Then load the whole page by using ajax. You can show a friendly loading gif too. This technique has following adanages,
browsers don't show generated HTML. Developers knw how to see this. But Normal user will not find it easily
if any user just press Ctrl+u it'll show the initial page.
wget, curl tool will not work at the first time.
additionally you can obfuscate the main page (which you are going to load by Ajax).
It's nearly impossible to stop people fetching the HTML from your website. I don't see any reason you'd want to hide it in the first place anyway. Hiding something?
Want to view the source no matter what javascript is being used to hide it? cURL the page.
Even if you disable right-click, you can still do a snapshot by pressing the prt scrn key on your keyboard then pasting it into an image editor.
You can't disable it. There are ways to encrypt it, but way more trouble than it's worth.
It's impossible to hide the source, HTML and Javascript are interpreted languages, that mean the browser will "compile" the code on the clients machine.
i search online but can't get satisfactory result
i want to protect images on my website, i know i can disable save as, right click.
the real question is can we Disable Clipboard & Print Screen with JQUERY or java script.
so no image copy from print screen.
thanks
Not from a webpage.
Even if you were able to disable these from within a browser, it will only stop a casual user. If you make a resource available on a public server (as you must in order to let a casual user view it), there really is no way to stop someone from retrieving that resource. After all, you actually want the user to retrieve the resource.
No. I am pretty sure you can't do that. Print screen is a part of the OS, not the browser. I would hope that web sites weren't able to mess with my OS like that.
You can certainly throw roadblocks in front of people trying to download an image, but short of watermarking, there isn't a great way to prevent people from getting your image (that I know of) if you make it available online.
No you can´t. And you can´t disable right click in a bullet proof way either.
The only way to protect your images is by watermark them.
Print Screen is a function of the operating system, and as such, cannot be disable by a webpage.
Actually, you can't disable anything. I know you technically can, but most browsers have an option to not allow disabling of those things. And really, worst case scenario, anyone can view the source of your site and copy the image's url.
In short, don't worry about it so much. Some people will copy your images, but this is nothing new on the internet, so you'll just have to learn to live with it. The only thing that any of your work will do is annoy some people, and make other people have to try a little bit. So, it's really best to not do anything. Place a copyright notice on your site and most people won't try to blatantly steal from you.
The only way to do what you're requesting is to incorporate OS-embedded DRM into your content (think HDCP). This can prevent even screenshots from being done but will severely limit your audience and is an absolutely horrible idea - don't do it!
If you really want to protect your images, the best way to do it is with watermarks and providing very low-quality images on your website and the high-quality stuff in some other way. The watermarks aren't a perfect solution but many consider them good enough.
Well there is no direct way to do that, but I used javascript to hide the content whenever the user hovers outside the website. This forces the user to actually activate your page to be able to see its content. This will activate the javascript that prevents prnt scrn too.
I am looking for a way to improve the workflow in a PHP based CMS. There is a lot of switching between the editor mode and the preview mode of the page. The editor mode is huge to load, and so I would like to open the preview mode in a different window.
I don't want to use new windows or an iframe within the current window to keep the workflow simple and to avoid confusion.
Is there a way to explicitly open a new tab (not window), and to jump to that tab from a document, in Firefox? The number of users is limited, so there is the possibility to set up the client with the necessary extensions / permissions.
I know Firefox can be forced to open all links in tabs, but I think that won't cut it, as I still can't address and focus the newly opened window.
Thanks for all the great answers everyone. I have now enough material to decide whether I'll take the greasemonkey approach, rely on the user to set up "open in tabs" and address the window by name, or use a "inline" HTML solution as so many of you suggested. I am accepting the answer that I feel went most effort into.
There is no way to force a window to open as a tab. It's all dependent on the user's preference settings.
I second the answers that say you should do this in HTML using Javascript. Then it can work in all browsers that support JS.
I would put two divs on the page and show/hide each div depending on which tab is selected. If you are clever about this you could trap the click on the tab and determine if the user left-clicked or middle-clicked. If they left click you load that tab on the page. If they middle-click you let the browser open a new tab/window (according to the user's prefs, don't try to force it), and leave the current window unchanged (that is, don't switch to the new tab). The action for clicking on the tab would be to use AJAX to load the contents of the remote document and put it into the tab. Use Javascript to modify the URL before submitting the AJAX request so that the server knows to send a web page fragment instead of the whole page.
The advantage of this dual-natured solution is that the tabbed approach will work the way you want it to work for the majority of cases, but for users with, say, two screens, or who prefer switching between browser tabs, they will still have the flexibility to work in multi-window mode. This can all be done without any browser extensions and it should work equally well in IE as well as Firefox, Opera, etc. Avoid locking yourself into one browser, even one as excellent as Firefox. One day a customer will need to use Opera or Safari and you'll be stuck.
You say you don't want to use an iframe to avoid confusion. Now I don't know about the layout of your website, but I've been using the approach that the editor opens in its own div right next to the content being edited and the content is being live updated as you edit. No need to change tabs.
(If the window is too narrow there are HTML tabs Edit and Preview)
It does not seem to add confusion to the user and for me this approach works really well. Maybe it's worth considering in your case.
What about using iframes and JavaScript?
I know you said you want to avoid 'confusion using iframes', but in my opinion if you really need to load different pages at the same time this is the best option.
In theory, you could create your own tab system using javascript or even better, using jQuery, because its UI module offers pretty cool tab control.
For every tab you could load separate "headerless-footerless" version of your specific admin page inside <iframe> element. If user wanted to modify something different, he will simply click on the tab and bring different iframe.
All this could also be done using AJAX, but iframe solution is quite easy as you just need to load ready page and all postbacks are already handled by original page and separated from master-admin-page.
You might also need to play a little bit to set correct height of your iframe to fit all the content without scrollbars, but this again, is just bit of javascript.
Nope, there's no way to force the opening of a new tab, simply because this would be unsupported by un-tabbed browsing
You can only set it to open a new window, not a new tab.
Greasemonkey springs to mind - a quick google gives open in tabs on left click. I think you could modify that so it only runs on one particular page, and you'd be up up and away.
This question made me wonder if HTML 5 allows that sort of specification, and it doesn't (nothing in one of the other hyperlink attributes, either). A new browsing context is a new browsing context, there's no way to express a preference for tab over window or foreground over background.
You can't force a tab, but if you use a target with a specific name, like target="my_cms_window", many browsers will open this as a new tab. Additionally, they will remember the name and if you use the target repeatedly, put the contents in the same tab. I have found that this works pretty well in the real world.
I want to open a file dialog via FileReference.browse() but I get #2176 error which means that this action can only be invoked upon some user interaction. I'm aware of security considerations but in my scenario I have a thin flash movie which merely displays an image and the whole UI is in javascript (I heavily use javascript <-> actionscript communication).
So the question is - do you think it would be possible to invoke FileReference.browse() upon the user interaction coming from javascript?
No. If it is anything like accessing the clipboard, then you are stuck out of luck. I have tried all sorts of hacks to get around that, from setIntervals to using apply, I even tried using a ByteArray to manipulate code directly. No soap.
For that matter, you'll have to upload the file to a server using FileReference (unless you're using AIR). This is really annoying if you need to have Flash look at it.
The problem is that when Flash makes this type of decision, they are not making those aspects of the classes accessible by code directly. The code responsible for actually accomplishing these things is locked in the native code which is built into the FlashPlayer. We're black-boxed out.
Back when Adobe first updated their security model, and in turn broke quite a few running flash based upload services, there was a
pretty
big
stink.
I believe that some people were working around the new limitation by essentially creating a transparent flash movie, and overlaying on top of an otherwise normal HTML element, to 'trick' the user into giving the flash app input from which to trigger the interaction (where they think they are clicking on a simple html button labeled 'upload' they are actually clicking on the invisible flash element sitting on top of it.)
I've not tried this method myself, but it may give you a direction in which to search for a solution that might work for you.
Isn't this the purpose of object and embed tags in html? When you say the whole UI is in javascript I am assuming you are using html markup as well, though I guess this may not necessarily be the case.
How to embed a flash file in html
How to start a flash file with javascript
Ok. I've found this link: Flash Player 10 FileReference Changes. Apparently there's no workaround for this limitation. I guess I'll have to display a prompt for the user from within the flash movie, so that he/she can "interact" and allow to open the dialog.
I've created a tool that is used with a fairly popular music retailer.
The tool provides an enhanced search feature (transparent last.fm results, no ads, no lameness, nothing creepy) and I've found the most useful and unobtrusive way to display the search is as a toolbar using the much maligned iframe. This allows users to load search without stealing the users focus.
Not being a particularly big fan of iframes I thought it would be trivial to add a “close this frame” (ala Google image search) link allowing users to quickly and easily regain control of their browser.
However unlike google, I doen't know what the location of the content in the iframe is (only where it started, via src).
So now I find myself in world of XSS and all the security related concerns.
Using Javascript I've added 'back' and 'forward' buttons with the history object called from links in the parent (when a user does a search the results load into the iframe, so the back button allows them to go back to the primary site after their done using/perusing the search results).
Is there any way to call the current location within the iframe and reload the page (now sans frames) to that location?
I've checked PHP $GLOBAL/$_SERVER variables to see I might get lucky. I understand that there are security concerns, but I don't see how this particular function would be any different then history.back() where the browser makes the call itself without 'notifying' my parent frame.
I know I can retrieve the src location from the iframe itself, but of course that presumes the user doesn't navigate beyond this page, and if they do they don't mind losing their current location and being redirected back to page called initially by the frame (...ah...).
It almost seems like frames are designed to steal windows with no means for gracefully 'breaking out' and preserving integrity of the users session.
No wonder people hate them. :)
On Google image search when you remove the frame it functions as you currently propose, by returning to the original frame source. For XSS reasons, finding the current location shouldn't be possible, and if it was it would be considered a bug and fixed in subsequent browser patches, so it might not be best to rely on such a quirk if one existed. A way to elegantly break out without revealing location would be nice, though. This might be something you can propose to the HTML5 group.
Not that it would really be all too helpful, but the closest you can come is detecting if someone actually left the original frame source page. When you navigate a frame the history object maintains entries, and if your original history length when the page loads is greater than the history length when someone clicks "Break out of this frame...", then you know they were browsing in the frame.
I appreciate both you (hal10001) and Zach taking the time to answer. It appears I'm suck (as I suspected) because of the xss security concerns.
I suppose I could simply wrap all the content within a php based proxy, but that would clearly entering the creepy zone, not to mention the added latency and what-not.
I'll keep spinning the idea incase I do come across something sane and usable, but until then I guess I'll just use the slightly less freindly approach of promoting the original frame and wiping out their current location (and if they don't like I can revisit the iframe/toolbar situation.
Thanks again!