How to insert a picture into an HTML page so that it is not a separate file
- Hola si, tengo el siguiente problema puedo combinar dos archivos por ejempllo troyano.exe con hola.jpg hago copy /b troyano.exe + hola.jpg trauma.jpg ahi ya lo tengo oculto pero despues quiero que al clikiar el trauma.jpg (donde esta hola.jpg y troyano.jpg) se ejecuten ambos, como hago por favor y si es con un archivo bat que debo poner en el archivo bat gracias.
- You can hide exe in jpg, but it won't run when user views it. Find a better hideout for your virus;P 'Those people who think they know everything are a great annoyance to those of us who do.'
You can just embed the.exe in the assembly as a byte array which is accessible as a property. Two steps to get it and save it to disk, instead of the monstrosity with magic strings you've suggested. Here's a page on how to create strongly typed resources in VS. – user1228 Aug 17 '10 at 12:40. The programs for embedding an exe file to a jpg are for sharing it secretly, not for spreading viruses as long the name is.jpg and not.jpg.exe or.com the picture is being displayed and no display software will execute any embedded.exe (or whatever) file, it would be ignored. Concerning your actual question ('how is it possible to embed executable code in an image'). Yes, it is possible to execute code via a specially crafted image provided it is opened in a vulnerable program. This can be done by exploiting an attack like a buffer overflow. But these specific hackers were most probably not clever enough for this.
by Christopher Heng, thesitewizard.com
I was asked by a visitor if it was possible to embed an image into an HTML file, so that the picture was inline and partof the page itself, and not a separate file that had to be downloaded (or in his particular case, distributed).He wanted his page to be self-contained, so that he could distribute it as a single file instead of multiple fileswith the HTML page separate from the pictures displayed on it.
This facility is available in all modern browsers, and is known as a data URL.
You will need to know someHTMLand CSS (although you don't need to be an expert or anything like that), otherwise you will find this articleincomprehensible.
If you are reading this page because you only want to insert an image into your web page, and not do the more esoterictask of making the page self-contained, you should follow the standard method used by everyone, includingthesitewizard.com. For example, if you have a picture with the filename of 'mypicture.png', place it in the samedirectory as your web page, and insert the following HTML code into that page:<img src='mypicture.png'>
Yes, it's that simple, although you may also want toadd a description of the picturein the 'alt' text for accessibility and search engine reasons. The method described below is not for normal situations,and comes with its own disadvantages. If you don't have any special requirements, and have no idea which method to use, stickwith the simpler code given in this section instead. It is what nearly all of the websites on the Internet do, and it is reallythe best method to use in normal circumstances.
In addition, if you're not sure how to insert the image code given in this section, you probably should just usea visual web editorto do the job. I have separate tutorials showing how to do this, describing every step in great detail, forExpression Web(a free web editor from Microsoft),BlueGriffon (anopen source web editor), and many others.
Embedding a picture into a self-contained web page does not prevent people from copying yourimages. The usual way of saving an image from a web page still works: for example, they can right click it andsave it from the pop-up menu, or drag and drop the image from the page to their desktop. They can even viewthe source code of the page, copy the image code, save it as a separate file and convert it back into anormal picture. And so on. In other words, this is not a method designed to guard your pictures, overand above the usual copyrightprotection.
It's just a different way of inserting pictures into a web page, with its own advantages and disadvantages.
Possible Reasons for Embedding a Picture
It's useful for HTML email messages, since you can embed pictures into the message sothat they show up when your recipients view it. You will then not need to have a web server somewhere to host the picture,since everything is self-contained. The message will also display properly even if your visitors haveset their email programor web email service not todisplay images hosted externally.
If you are distributing a document in HTML format to someone (eg on a USB drive, or together with your computerprogram as its documentation), it may be handy to have everything in a single file. That way, you will avoid problemswith your recipients/users not copying all the files needed for the document to be displayed properly (and thencomplaining that your page is broken).
I'm sure that there are other reasons people embed pictures as well.
Disadvantages of Embedding Pictures
Before you rush out to embed every single picture because you think it is such a novel thingto do, consider this.
Additional Work and Maintenance Chore
It adds extra steps that you need for each picture you embed. And if you make changes to your image,you will have to go through all the steps again. Contrast this with the normal method, where it'sjust a matter of replacing the existing file with the new one.
The Effective Image File Size Increases
The textual equivalent of your image takes up more space than the original one. That is becauseevery byte in the original picture is now represented by the more limited character set ofsmall and capital letters, numbers and the '/' and '+' characters.
An analogy may be helpful here: it's as though previously you had a vocabulary of (say) 30,000 wordsto describe a particular object. So you could use the most apt word to say what you needed to say(eg, 'that is a green frog'). But if you are restricted to a rudimentary vocabulary of (say) 100 words,the same description will have to be very much longer, because you will need a whole paragraph to replacethe precise terms you previously used (eg, the words 'green' and 'frog' are no longer in yourvocabulary, so you even have to explain the colour and describe the animal in simpler terms).
Note that this is just an analogy. The real situation is actually not as dire as a reduction of Englishvocabulary, since the bytes used for an image have a limited range that can be more easilyexpressed with alternatives than genuine human language, which must encompass everything. But the basicnotion that you're expressing something with a more limited 'language', and therefore need to say moreto accomplish the same result, stands.
Your Bandwidth Increases
It adds to the bandwidth used by your web pages. Firstly, as mentioned earlier, your images will take upslightly more space when converted. Secondly, web browsers cannot cache the embedded images to reduce theamount they download each time. So if your image is shared by other pages on your site, the entire imagehas to be re-downloaded with each page every time, since it is part of the page itself.
This adds to your site's data traffic usage and the bandwidth used by your visitors (which may be a concernif they are using a mobile phone on a metered data plan).
Old browsers (eg, Internet Explorer) do not support data URLs in HTML files. It is supported, however,in the current versions of Microsoft Edge, Firefox, Chrome, Safari and the Android browser.
File Size Limits
In general, for maximum compatibility, you should only embed small pictures. There are no requirements inthe standards specifying the size a web browser should support, so browsers vary in what they can handle. Forexample, Microsoft Edge limits the size of the embedded data to 4 GB.
But even if there are no file size constraints, this HTML facility was not really meant to be used for largeimages.
Steps to Embedding Your Image
Convert Your Image to Its Text Equivalent
Before you can embed the image, you will have to get the text equivalent of the image. How this is done depends onthe operating system you're using.
If you use Windows, open a command prompt. You can do this in Windows 7 by clicking the Start menu, typing 'command prompt', and clicking the 'Command Prompt' line that appears. It should probably also work the same way in later versions of Windows.
You will be deposited at a line that says something like 'C:Userschristopherheng>'. Don't worry if it doesn't say exactly that; the name that appears after 'Users' depends on your Windows account name.
Now navigate to the folder containing your image. For example, if you placed your picture or photo on your desktop, type the following command and hit the ENTER key when you are done.
To convert the file, we will use a built-in command line program called 'certutil' that comes with Windows. I'm not sure which is the earliest version of Windows that has this, but my Windows 7 machine has it preinstalled, so I suppose it should be available on Windows 8, 8.1, 10 and later too.
Let's say that your file is called 'mypicture.png'. Type the following line into the command prompt, followed by the ENTER key.certutil -encode mypicture.png mypicture.txt
Certutil will proceed to create a file called '
mypicture.txt' containing the text equivalent of your image. This text representation of your picture is in something known as the Base64 encoding, which is used for a wide variety of things on the Internet, such as email.
Mac OS X, Linux and BSD users
There are numerous commands available on Unix-type systems to convert the image to its textual form, including 'openssl', 'uuencode', 'perl', 'base64' and probably more. I will only describe the procedure for using 'base64'.
If you use Mac OS X, and your image is called 'mypicture.png', the command line is:
On Linux and BSD systems, it is:base64 mypicture.png > mypicture.txt
Mac users will need to run the Terminal application to be able to type that command. I'm sorry, but I don't have a Mac, so I can't tell you how to do that. Linux users should just open up a shell or terminal window (but if you are a Linux user, you probably don't need me to tell you that).
You will also need to change to the directory where the picture is saved, before invoking base64. The command to do this is '
cd [path]', where 'cd' means 'change directory' and '[path]' stands for the full path, that is, the directory name starting from the topmost '/' directory. For example, if your picture is saved as '/home/chris/images/mypicture.png', type '
cd /home/chris/images' to go to that directory.
The base64 command line given earlier creates a text file called
mypicture.txtcontaining a representation of your image in something known as Base64 encoding. The latter is widely used on the Internet for a number of things, including email.
Whichever system you're using, at the end of this step, you will have a file called '
Insert the HTML into Your Web Page
Open your web page in an editor. If you use a visual web editor (eg,Expression Webor BlueGriffon),switch it into its Code or Source mode.
In the place where you will normally insert '
<img src='mypicture.png'>', start by typing thefollowing instead:
Notice that the last character on that line is a comma. Do not omit that.
mypicture.txtin a plaintext editor. For example, if you use Windows, doubleclick the file and it will probably open up in Notepad (unlessyou have associated another editor with the '
You will notice that the file contains numerous lines with letters, numbers, and the occasional '/' and '+'. If you usedthe Windows 'certutil' program, you will also see a line that says '-----BEGIN CERTIFICATE-----'and one that says '-----END CERTIFICATE-----'. Ignore these two lines. That is, do not copy them. Theyare not part of the image. Certutil includes them because it is primarily a program written to deal withSSL/TLS certificates, the stuff your site uses when it isaccessed with HTTPSinstead of HTTP. We're merely using its base64 generation capability to convert images so that wedon't have to download and install an extra program.
Copy each line from the file and append it to the end of the
imgline. Do not leave any space orcreate new lines. Although the Base64 encoded text in
mypicture.txtare separated into many lines,join all of them into a single continuous line with no embedded spaces.
You can see an example of this by viewing the source code for this page for the picture below.For example, in Firefox, type Ctrl+U (ie, hold down the Ctrl key while typing 'u') to open a tab containing the HTML source.Scroll down to (or search for) the image tag below this paragraph. And yes. It's a very long line. And that is despitethe original image being only 885 bytes long (the encoded version is 1,181 bytes, a 33% increase in size).
If your image is in the JPEG format (with a '
.jpeg' file extension), use'
image/jpeg' instead of '
image/png'. Likewise, if it is a GIF picture (with a '
.gif'extension), use '
image/gif'. This string is technically known as the MIME type, and it tells the browserthe type of data that follows.
Note: if you are using a plain text editorthat wraps lines automatically, disable that function. Otherwise it may reformat it into multiple lines, possibly breaking yourcode.
After appending the data, end the '
<img src=' line with'>
That is, put a quotation mark to match the earlier one in the
srcattribute, thenclose the
imgtag. I know this is obvious, but I'm mentioning it in case you forget to do itafter the long and arduous task of pasting the lengthy Base64 encoded line.
That's it. When you view the page in a browser, it should show the image in the usual way.
Copyright © 2018-2020 Christopher Heng. All rights reserved.
Wartune lvl 70 gear. Get more free tips and articles like this,on web design, promotion, revenue and scripting, from https://www.thesitewizard.com/.
Do you find this article useful? You can learn of new articles and scripts that are published onthesitewizard.comby subscribing to the RSS feed. Simply point your RSS feed reader or a browser that supports RSS feeds athttps://www.thesitewizard.com/thesitewizard.xml.You can read more about how to subscribe toRSS site feeds from my RSS FAQ.
This article is copyrighted. Please do not reproduce or distribute this article in whole or part, in any form.
It will appear on your page as:
Embed Exe In Pdf
Embed Exe In Jpg Free
thesitewizard™, thefreecountry™ and HowToHaven™ are trademarks of Christopher Heng.
This page was last updated on 1 December 2020.