I need to embed both pdf-files and images in my html-page, however, due to the fact that my html contains a form and the user has to be able to decide whether he would like to upload a pdf-file or an image, I need a flexible solution regarding how to embed either a pdf-file or an image with the same code.
I read that I could possibly use the <object/> tag, however, I also read that that's not a very "elegant" and possibly slow solution.
I also considered to use <embed/> which, as of right now, is the best solution I could come up with. Unfortunately I couldn't find out about if it's a very conventional solution or not.
I can't seem to find very much resources regarding this topic online, hence why I'm asking here. Are there any other/better ways to embed a pdf- or image-file in an html page?
Edit: I want top display the pdf kind of like a file. Also, I don't want the user to be able to resize the pdf in the viewer
I'm sure this is better suited to a comment, however I'm new and am working on unlocking that feature.
...however,
due to the fact that my html contains a form and the user has to be
able to decide whether he would like to upload a pdf-file or an image...
What are you using for the form (query language & database management)?
(PHP, Django, MySQL, MongoDB, etc)
Are there any other/better ways to embed a
pdf- or image-file in an html page?
I would recommend using embed or iframes. You are correct in thinking that the object tag is not an elegant solution, since you are dealing with images.
Edit: I want top display the pdf kind of like a file. Also, I don't
want the user to be able to resize the pdf in the viewer
Easy to do with iframes. There's a lot of hate when it comes to iframes. As you seem to plan on using it as a tool to display a file within a page, then I believe using an iframe here is just fine.
Check out this link on iframes. (will also tell you how to keep the user from resizing it)
Related
There is a website called file2hd.com which can download any type of content from your website including audio, movies, links, applications, objects and style sheets. Of course this doesn't work for high profile websites such as Google, but is there there a type of method I can use to cloak content on my website and prevent this?
E.g. Using a HTML Code, or using .htaccess method?
Answers are appreciated. :)
If you hide something from the software, you also hide it from regular users. Unless you have a password-protected part of your website. But even then, those users with passwords will be able to fetch all loaded content - HTML is transparent. And since you didn't provide what kind of content are you trying to hide, it's hard to give you a more accurate answer.
One thing you can do, but it works just for certain file types, is to server just small portions of a file. For example, you have a video on your page and you're fetching 5-second bits of the video from the server every 5 seconds. That way, in order for someone to download the whole thing, they'd have to get all the bits (by watching the whole thing) and then find a way to join the parts... and it's usually just not worth it. Think of Google Maps... and Google uses this/similar technique on a few other products as well.
In my web application, a user may make a post with images, embed videos and text with different styles. I want to generate a preview for the post to show it on the front page of the web application. It demands that it doesn't take too much space and as clear as possible.
I know that I need to parse the post html first and may extract image elements first. My consideration for the text is simply to extract all plain texts and show part of them.
Could someone provide other advice, methods or resource about this problem?
As I understand, you want to render a HTML page into an image? You should use some layout engine, such as WebKit or Gecko on server side.
Another option is to use some third-party online tool for these previews. But rendering the page is pretty hard process, because of it's time complexity and memory space requirements for storing images. I have found these services:
http://www.thumboo.com/
http://www.thumbalizr.com/
http://www.zubrag.com/scripts/website-thumbnail-generator.php
I am thinking to create an website that generates HTML through a wizard.Finally, I want to make the users to buy the generated HTML source if they like what they see.
But I don't want to let the users to steal the HTML, CSS and JS that I use to create the effect they want.
I want a technique which is immune to Firebug and Right Click -> View Page Source.
Any thoughts ?
edit: I remember something about iframes or frameset, but I'm not sure how to fool the browser and Firebug to execute the code without updating their capability of showing that source code. A popup is also a possible solution.
edit 2: html hosted in silverlight ? will you use it ?
The best thing you can do is to just obfuscate your code. Trying to hide the source is not going to work (for ex: if you disable right click-> view source that doesn't stop them from using the menu or saving the page or using a shortcut key or writing an app to stream the http request into a file and open that, etc).
Firstly, depending on what you are doing you can have the HTML code loaded through JS after the page load (AJAX).
As far as your JS goes:
Free Obfuscator
Not Free Obfuscator
In the end though, there is no stopping someone who really wants to get that source. Even obfuscated code can be rebuilt (though it's hell on wheels painful depending on how good the obfuscator is).
To really protect the sample HTML from prying eyes, you'd need to render it on the server-side and only pass image data to the client. If you want the user to be able to interact with the sample as if it were a normal Web page, you'll also need to send their pointer and keyboard inputs to the server and update the displayed image when necessary. At that point, though, you're basically making an HTTP-based version of VNC. This is definitely possible, but I don't think it will be easy, and I doubt there are any existing software packages to let you do this. If I were you, I'd rethink my business model a bit.
Sending XSL-templated XML to the browser may be enough fool some, and it will work more or less the same in many modern browsers including IE6 (maybe even 5.5).
But really, trying to hide the HTML code isn't going to work if anyone halfway serious wants to get it.
I am thinking to create an website that generates HTML through a wizard.
Finally, I want to make the users to buy the generated HTML source if they like what they see.
If this is what you need you might consider the possibility of creating a preview of the page as an image, and provide the download of the source only after the user agreed and paid. There is no magic way to let a browser display a code that you can't see.
You can make a video, showing the functionality and upload the same, which may help users to view / feel it.
In my rails app I have a need to save some webpages and display them to the user as images. For example, how would I save www.google.com as an image?
There is a command line utility called CutyCapt that is using the WebKit-Rendering engine to render HTML-Pages into various image formats. Maybe this is for you?
http://cutycapt.sourceforge.net/
Prohibitively difficult to do in pure Ruby, so you'd want to use an external service for this. Browsershots does it, for example, and it looks like they have an api, although I haven't used it myself. Maybe someone else can chime in with alternative but similar services.
You'll also want to read up on delayed_job or something similar, to make sure you're accessing those page images as a background task and that it doesn't interfere with your actual application.
You can't do it easily (probably can't do it at all).
Each page is just a text - html data. The view you want to make an image of is a rendered page. Browser renders the page using tonns of techniques like html parsing, javascript parsing, css parsing, font rendering, etc.. To make the screenshot of google page - you would need to do all the rendering somewhere in memory and then take a screenshot of rendered page.
That task is almost impossible (there is nothing fully impossible).
If you are really eager to donate tonns of time to accomplish that task - you should do this steps:
1) Find some opensource rendering engine. Firefox would do.
2) Find some way to communicate between ruby-on-rails and that engine.
3) Wire it all together and see the results.
However, I see steps 1 and 2 as nearly impossible.
Firefox addon:
https://addons.mozilla.org/en-US/firefox/addon/1146/
Is there a way to embed only a section of a website in another HTML page?
Example: I see an answer I want to blog about, so I grab the HTML content, and splat it in somewhere, and show only that, styled like it is on stackoverflow. Basically, I want to blockquote the section of the page with original styling, if that makes sense. Is that something the site itself has to provide, or can I use an iframe and tell it to show only a certain element or something crazy? Open to all options, but I want it to show up as HTML, not as an image (that's really a last resort).
If this is even possible, are there security concerns I need to aware of?
Don't think image should really be last resort. You have no control over the HTML/CSS of the source page, so even if you craft a solution (probably by using JavaScript to parse out the desired snippet) there is no guarantee that tomorrow the site doesn't decide to change its layout.
Even Jeff, who has control over the layout of stackoverflow.com, still prefers to screen-capture the site, rather than pull in the contents live.
Now if your goal was to have the contents auto-update, that would be a different story. But still, unless you use some agreed-upon method of sharing content, such as RSS, your solution would be very fragile.
The concept you are describing is roughly what is called a "purple include" or "transclusions". There is a library out there for it, but its not exactly actively developed. Here's a couple ajaxian articles on it.
I'd recommend using a server side solution with Python; using urllib2 to request the page, then using BeautifulSoup to parse out the bit that you need. BeautifulSoup has a very flexible selection api with which you can craft heuristics for the section you are interested in.
To illustrate:
soup = BeautifulSoup(html)
text = soup.find(text="Some text on the page that is unlikely to change")
print soup.parent.prettify()
That way if the webmaster later changes the markup on the page, your scraping script should still work.
On client side <iframe> is the only practical option. It is possible to scroll it, but it might not work in the long term, because it's technically close to clickjacking attack.
There's also cross-site XHR, but requires opt-in from destination site, and today works only in few latest browsers.
Getting HTML on server side is easy (every decent web framework has ability to download page and parse HTML and you can use XPath/XSLT or DOM to extract bit you want).
Getting styles however is going to be tricky – CSS rules may not work with HTML fragment taken out of context. You'd have to parse CSS, extract and transform rules or use browser and read currentStyle of every node.
Obviously you have to heavily filter HTML you extract to avoid XSS. It's harder than it seems.
If you don't need to automate this, a good HTML+CSS WYSIWYG editor might be able to extract content fragment with styles.
That sounds like something that IE8's Web Slices would be perfect for. However, it's only available in IE8, and the site of origin would have to implement for you to be able to take advantage of it.