How to observe another user activities on webpage - javascript

I have to create a web page, where all activity of some user will be seen by second user.
Simply, the second user see everything what the first user is doing at his page.
I know, that It is possible using AJAX or Websockets, but I' m interested in simpler solution.
Do you know any simple solution, which enables to intercept frame of another user?
I had browsed many pages, but I haven't found satisfactory solution.
I assume that I control the source code of this application.
I greatly appreciate your help.

Check out Mozillas TogetherJS.
It is a solution for users interacting with a page together in realtime; it might do what you are trying to achieve.

Related

How to change html content with URL?

I'm a beginner at coding, I know javascript but not super advanced objectd,
I'd like to know how to change html content with its URL. For example,I am on a website like GMAIL, it has different page of registring and logging in. These two pages have different URLs.
What I'd like to know is how do they change the URL along with HTML when I click on the button "Log in". Is this possible through server-side like node.js and express, or just with front-end javascript?
One last thing, do websites have multiple web pages or it's just in one single HTML file?
Well, I have set up a practice project, but I don't know what I am doing.
I changed HTML content with jQuery library but I don't know how to change URL.
First I made a homepage with some text and two links to two forms.
I showed registration form when click on "Sign in", and log in form on "Log in", and hid the homepage with the show() and hide(). The URL doesn't change in order to work with it with express. I tried it with history.pushState() but it messed up things: I can't return to homepage, and it didn't change the URL i wanted based on the form. So i deleted it, and I am stuck and don't know I could find some tutorials online.
My code doesn't contain anything other than what I described.
So, please can you explain to me how websites do that.
And one other thing, my express server now is very slow, it takes nearly 5min to start. I don't know if it's because my pc which is old and not super good unfortunately.
Can you please advice me with some tutorials and tips?
I agree that your question is too broad. Even there is many years invested in unversity to know these stuff well, I believe in self learning, so I will give you some light for your next steps in this world.
Here are some questions you may ask Google or research where ever you want:
There's both applications that hosts entire html documents in a server and reacts to http requirements responding with different ones. These are the first ones in existence.
Today the trend is to host information on distributed servers (Even cloud) as services to interact with just as information repositories, and entire client side applications that handles that information to show to the user in a more interaction friendly way.
So here are 4 first questions you can ask:
How does HTTP protocol works (with html documents e.g.)?
What's the difference between thin client and fat client applications?
What are web services?
How can I do a simple client side application with different routes using a public web service?
There is a lot of information to read about, and that's not the way I learned in university, so I can not tell you that's the right way or even a good one. Anyway, you should consider taking a web programmer beginner course, if you already know about basic algorithmic composition.
Wish you the best in this extensive path...

Software as a Service, Content Delivery Networks and how it all fits together

I'm sure I am running the risk of being told off for being off topic or too vague with this question but after a great deal of research I really don't know where else to start other than the knowledgeable folks on SO.
Here is the general gist of what I want to do:
I have some web software I want to make available to my clients the easiest way possible. From what I have read and understand SaaS is the best option for this. I want to enable customers to sign up, and then copy and paste a segment of code into their site and that is the set up complete. Take this piece of code for example:
setTimeout(function(){var a=document.createElement("script");
var b=document.getElementsByTagName("script")[0];
a.src=document.location.protocol+"myscript.js?"+Math.floor(new Date().getTime()/3600000);
a.async=true;a.type="text/javascript";b.parentNode.insertBefore(a,b)}, 1);
This is code from another site. But from what I understand it asychronously creates script tags and calls an external javascript file from a CDN and appends this to the users web page?
So, if I am right the user will now have a pointer to a javascript file hosted on a CDN. In this file I want to dynamically generate HTML content specific to the user and then append it to the webpage they are viewing. Say this HTML is a form which submits to a database on the CDN via AJAX.
So this is what I want to do. But it is all new to me. I am not even sure if it possible, and whether SaaS using a CDN is the right approach? If anyone could point me to some tutorials or articles about how to set something like this up it would be great. I have done a great deal of research but am finding it to a bit of a minefield of information. It is difficult to know where to start.
Sorry for such a vague question. I will edit and refine as I receive answers to try and clarify things and hopefully help out some other people.
Thanks for your time.
Perhaps look at Google Tag Manager, as a way to inject tags into your content.

Spying activities of another user

I want to write page, which enables spying activity of another user.
Two users watches the same page, which is very simple (vertical scrollbar, inputs, buttons, checboxes...).
Each actions performed by first user on his page is immediately seen for second user.
For example, if first user clicks button, then second user watches that click on his own page (pages of both user looks identically).
Simply, second user can see everything what the first user is doing (in real time)
Of course, I assume, that I control the code of this webpage.
And my questions:
Is there a simple way to do that, or I have to write handler for each event and send data to second user using Ajax Web Sockets explicitly?
Is it possible to intercept the frame of another user without necessity of handle each action?
I wrote basic version of this spying program, which is based on websockets. Each action performed by first user is send to another user.
After receiving a message, program parse data, and invokes appropriate method, so I have the same behaviour on both pages.
It works correct, but using this approach it would be more complicated task if I want to do that without complete the knowledge of page
(In my version users have the same html content, so I can apply these method).
All in all, I am looking for simpler solution (without neccessity of handling each event).
I had browsed about 50 webpages, articles and answers at Stack Overflow by now, but haven't found anything that talks about simpler solution
(My friend asked similar question, but there are only few answers).
I'm not interested in full solution, I hope that you give me some valuable hints or apparent links.
Maybe I didn't enter correct phrase...
Thank you for your help
Your question is most probably getting downvoted because it sounds malicious. Rather than asking a question with the word 'spying' in the title, I would use the word 'collaborate' instead. From what I just read above, it seems that what you want to do is work on the same screen as another client, not 'spy' on them.
Anyhow, to answer your question:
Have you come accross togetherJS before? This is a plugin which allows real time collaboration between 2 or more users. Your entire DOM actions will show up on a partner's screen, so you will no longer need to write event handler actions for each element within your DOM. The project is also hosted by mozilla, so you don't even have to host a realtime server yourself to make use of the plugin. Win!
There are some brilliant demos on the project webpage demonstrating the plugin's use. Check out the collaborative drawing demo for a simple, yet effective example.
As for actually integrating the plugin into your website, it couldn't be easier. Simply include the hosted script on your page like this:
<script src="https://togetherjs.com/togetherjs-min.js"></script>
Then initialise the plugin on your website. This can be done in a document ready event, or by using a button as you see in the example:
<button onclick="TogetherJS(this); return false;">Start TogetherJS</button>
Now when you want to start a collaboration session, simply invite another client to your page and you will both be able to see what happens on the page between both users in live time.
Hope this helps you out.

Take a screenshot of whole screen using html5/javascript?

I am looking to take a full screenshot through a webpage, outside of the browser window. Basically, I am trying to build a help tool for both web-based apps and offline programs, and as a part of this I would like to be able to take screenshots from a webpage so the user does not have to download a program to take a screenshot/upload it to our website.
I am aware there may not be a solution to this, but if there was that would be awesome!
Cheers in advance
There are ways to achieve what you want to do in part. However, it is important to know that they do require user permissions.
You also ask if a web page can take a screenshot outside of a browser window- this is a huge breach of privacy and I would advise against implementing anything that goes down this route. For what your trying to do, it is always best to have user consent.
If you interest is in saving the user time and giving the user a more seamless experience, consider one or more of these options:
You can use one of several JavaScript plugins/ API's to allow to user to select portions of what they see on the web page and then upload it to you. For instance, you can do this on YouTube. Go to youtube.com and scroll to the bottom of the page and click Help and then Send feedback. Here you can enter text as well as "highlight" portions of the page and send them to YouTube. To achieve something like this, look into something like html2canvas.
Give your user quick access to the download pages for tools like Snipping Tool for Windows. This way, if they don't have it on their machine already, at least they don't have to go looking for it.
From my experience in dealing with customers, many of them don't even know that things like Snipping Tool exist on their machine. Perhaps, an FAQ or help section that would guide the user would be useful.
In summary, it is possible through a web page to "screenshot" what is on a web page itself but nothing I have come across that allows you to capture anything outside of the web browsers context.
This is definitively not possible using only HTML5/JavaScript. You would have to involve a browser plugin such as Flash, a Java applet or perhaps a Firefox add-on.
Note: I'm assuming you mean taking a screenshot of the entire monitor, not just the browser window.

how to restrict user to copy web content

I am creating a web site and my client demands to restrict user to copy TEXT displayed on the web page.how can I do that? I am using PHP and HTML in my application.
Not trying to be rude, but why do people keep asking this? If you want people to be able to see the information, then you cannot prevent them from copying it. Any kind of javascript nonsense to prevent right-clicking or selection or whatever else will not stop determined thieves and will annoy legitimate users.
As mentioned by every answer previously, there's no way to prevent someone from being able to use the copy from your site. Even if you use methods to restrict direct copy and paste, there are always screenshots, OCR or good old writing by hand.
Looking at it from a different perspective...if the content is sensitive and your client doesn't want it distributed, you COULD add it to a section of your site that requires registration and authentication to access. By doing this you could require that users agree to terms and conditions on registration which explicitly deny permission to reproduce any of the content from the site.
Just a thought.
As every other answer has said, there is nothing technically you can to to prevent people from copying the text of your page. For the text to be display to the user, you must send it to the user's computer, which means they can copy it.
However, you can legally prevent them from copying the text with a service like CopyScape
Copyscape is dedicated to protecting
your valuable content online. We
provide the world's most powerful and
most popular online plagiarism
detection solutions, ranked #1 by
independent tests. Copyscape's
products are trusted by millions of
website owners worldwide to check the
originality of their new content,
prevent duplicate content, and search
for copies of existing content online.
Copyscape provides a free service for
finding copies of your web pages
online, as well as two more powerful
professional solutions for preventing
content theft and content fraud:
Copyscape Premium provides more
powerful plagiarism detection than the
free service, plus a host of other
features, including copy-paste
originality checks, batch search, case
tracking and an API
Copysentry provides comprehensive
protection for your website by
automatically scanning the web daily
or weekly and emailing you when new
copies of your content are found.
Read more on their site.
you can force people to call a phone number to hear the text of your website, a great solution if you do not want people to copy/paste the text of your webpage
Basically, you cannot. Even if there was a way to restrict user from copy & paste the text, they can always just grab the screen and translate it somehow into text.
I'd recommend not to try restrict users in any way. It's not really friendly and people usually hate it. If you want to create some private content, just make people to log in, do some ACL check and hope that they won't copy it somewhere else. You could also consider using some kind of license to prevent people from "stealing" your content.
Even if he was to build the system in flash the user could still hand write out the content if they desperately wanted it, like everyone else said its impossible to stop a determined person from getting your content, unless of course you don't display it.
No, AFAIK, there is no way you can achieve that. Unless you're building the whole thing in Flash or other non-HTML plugin contents.
The short answer is that you can't (easily) do this - if it's visible in the browser then it is obtainable somehow. This is particularly the case if you are just displaying text.
And it all gets back to "Why"? If the information is secret, don't show it to someone in the first place. If you're concerned about copyright violation, as others have said, once someone sees the text, even if you somehow came up with a brilliant technical solution that prevented them from copying the text in any way (which I doubt is possible), they could always write it down by hand, or take a picture of the screen with a digital camera and then OCR it. In the digital age, your protection against copyright violation is more legal than technical: if somebody steals your material and resells it, sue them.
Depending on the nature of your material, you may be able to make it awkward for people to get it all on one screen. Like, if you were running an on-line phone book and you were afraid of people stealing your listings, instead of displaying some large number of listings on one giant page -- all the "A"s or whatever -- you could require people to enter search terms and only show two or three possible hits at a time. Then if someone wanted to steal your listings, they would have to spend thousands of hours entering every imaginable search term. Now that I think of it, I was using some phone book site the other day that gave me a listing of names and addresses that were possible matches, but then I had to click on each one to get the phone number. At the time I thought "dumb nuisance", but now it hits me: they probably had the same idea that I briefly thought was original. Anyway, if your material is a database of individual factoids, this could be practical. If it's an article on the economic history of Lithuania or some such, making the user seach for it in tiny pieces is just going to make people abandon you and look elsewhere.
Personally, I've taken the philosophy that I just don't care. I've had many occassions when I've done Google searches on subjects that interest me and turned up articles that I've written, on sites that never asked my permission. I once even found an article that I wrote on one of those pre-written student papers web sites. (Not that any student would just paste his name on it, print it off, and hand it in, of course. They are "for research purposes only". I'm sure if they knew of students claiming this as their own work they would take down the site immediately.) So an article that I published on the web, available to anyone for free, these people were now charging dishonest students $25 to download! My reaction was, Way cool! It's one thing when others quote you, but you've really reached the big time when others plagiarize you!
This is not possible.
You cannot prevent someone from getting the information if you're sending it to them so they can see it. A user can simply view the source of the HTML and see what the text is and copy it from there and there's nothing you can do to stop them.
Implementing anything in JavaScript is completely ineffective since anyone can just disable JavaScript in their browser and get around it, and you'll only end up annoying your users.
The only way to prevent someone copying the text from a web page is to not put it on the web page in the first place.
If you presented content via images, or flash, and prevented the ability to save as that might be a solution. I found some resources you might find useful in protecting images here and some information on "preventing" print screen here.
Unfortunately, there is no easy solution for your question, as once the content is delivered to the user, they have ultimate control over the information (who's preventing them from taking an actual picture of the site?).
Well, the PHP has nothing to do with it, as that's server-side. You might be able to cook up something in javascript (it's fairly easy to disable right-click; it may also be possible to disable text highlighting), but it's fairly easy to get around this. Failing all else, the user might view source, though that can be encrypted too:
document.write(base64decode('encoded string containing entire HTML document'));
This is, frankly, both annoying and pointless. Anything that's available to the user can be taken somehow. Even flash isn't immune. (There are browser plugins available to take videos out of flash.)
You may want to look at your target audience as well to help determine how you want to make it harder (since you can't realistically prevent it)..
For the simple user just disabling the right click may be good enough to prevent it. Slightly more work would be to do as others had suggested and create an image. With the image you'd probably want to set a background-image on a DIV or something since you can easily drag images, using the IMG tag, straight from the page onto you desktop, or wherever. From there you could use Flash, or some other RIA, or maybe even SVG/VML..
Anyone who knows how to do a screen capture really narrows down what you can feasibly implement :(
<script type="text/JavaScript">
//script to bar copying of website contents
function killCopy(e){
return false
}
function reEnable(){
return true
}
document.onselectstart=new Function("return false"){
if (window.sidebar){
document.onmousedown=killcopy
document.onclick=reEnable
}
};
</script>

Categories