Embedding Image To HTML from Database - html

I have a scaffold which is used to update frontend information of the Home# Index. I'm unable to add the image int he given theme formate.
<section id="home" class="no-padding parallax mobile-height wow fadeIn" data-stellar-background-ratio="0.5" style="background-image:url(<%= image_tag detail.banner.url %>);">
Thanks.

It seems that details.banner.url evaluates to external url of placehold.it/1920x1200. If that's where the image is (which I doubt) you have to add http:// to the link, because right now it is looking for a placehold.it folder and not server address. If you're trying to read a file from your server, details.banner.url clearly returns the wrong path. If you want to put the image in the database then look into ActiveStorage or Paperclip.

Please go through this rails guide for asset pipeline
According to this guide, your code will be like this:
style="background-image:url(<%= asset_path detail.banner.url %>);"

Related

html page can't find asset from Go web server

I have a Go HTTP web server and I'm loading static assets like so:
http.Handle("/assets/", http.StripPrefix("/assets/", http.FileServer(http.Dir("assets/"))))
The directory assets exist at the directory the web server is running, and the image file assets/images/logo.svg exist.
If I try going to http://localhost/assets/images/logo.svg it redirects to http://localhost/.
From an HTML page I have the following:
<img src="assets/images/logo.svg">
This fails to load the image.
I then tried the following as well with no luck:
<img src="./assets/images/logo.svg">
<img src="//localhost/assets/images/logo.svg">
Unsure what I'm doing wrong to host static files and being able to use them from html.
EDIT
I've added the code for everything here.
Along with a photo showing the broken images.
Try to modify the line from:
http.Handle(
"/assets/",
http.StripPrefix(
"/assets/",
http.FileServer(http.Dir("assets/")),
),
)
to
http.Handle(
"/assets/",
http.StripPrefix(
"/assets/",
http.FileServer(http.Dir("./assets/")),
),
)
Please note, your img->src should be something like this assets/images/logo.svg
EDITED:
The below image is the response to the comment link:

Thymeleaf email image not displayed

I'm using Thymeleaf with Spring Boot.
I'm trying to send a mail with a html template.
The mail is ok, the variable thymeleaf in the template are replace it's perfect, but, my only one problem is that the image are not displayed. It's just like if the image doen't exist.
The html template and the image ( Picture.png ) are on the same folder.
In the template I have try these multiples tries :
<img src="Picture.png" />
<img src="#{Picture.png}" />
<img th:src="|cid:${imageName}|" /> // by passing the "Picture.png" in the imageName variable
<img th:src="#{Picture.png}" />
But nothing is working, I need help thanks !
I answer my own question because I suceed to resolve the problem :
Just put like that <img src="cid:imageName"/> in the html file
Checkout the Thymeleaf's documentation especially the part for context-relative and server-relative url patterns.
If your project root directory is called myapp and you deploy it into a Tomcat server, your application will probably be accessible as http://localhost:8080/myapp, and myapp will be the context name.
So assuming the folder containing both the image and the html is located at:
myapp/resource/assets/(html and Picture.png exists)
the correct code to dynamically fetch the image is:
<img src="resource/assets/Picture.png" th:src="#{resource/assets/Picture.png}" />

get a resource path in MFC

I am trying to build HTML in my MFC application using class CHtmlEditView.
So I want to add an image, currently I am using <img align=\"baseline\" alt=\"\" src=\"C:\\cry.png\" border=\"0\" hspace=\"0\"> and its working all fine.
Now, I have to replace this src=\"C:\\cry.png\" local path. So I have added this to resources and <img align=\"baseline\" alt=\"\" src=\"\\res\\smiley.png\" border=\"0\" hspace=\"0\"> its not getting image path. I am not sure how to give a path a image from resources. I have seen LoadBitmap() and LoadImage() but do know how to get a relative path of resource.
Your target URL will be something like this: res://yourapplication.exe/agent.png
Please note that you will need to import your image resources just like this:
Go to Resource View
right click and select Import context menu option
select your image file
Please note that as the result you should have the following in your .rc file:
STARTPAGE.HTML HTML "res\\startpag.htm"
AGENT.PNG HTML "res\\agent.png"

Path resolution in Web application when AngularJs is accessing and MVC4 server

I am trying to create a modular applications by mixing the ASP.Net MVC4 and AngularJS. what MVC does is that it allows us to have a path separation like below.
Home screen
http://127.0.0.1:81/
when a user logs in, i provide them with a base path as below
`http://127.0.0.1:81/shipper/#/operations/home`
or
`http://127.0.0.1:81/client/#/orders/home`
so I get a base screen template per type of user and from then on it is a SPA that takes over on the template which sometimes share a common view based om the need.
now the issue i am having is that when i have to reference any server object like image on the web server that are all located in the root\themes\images\image1.jpg
the image URI in the fiddler is getting resolved to http://127.0.0.1:81/client/themes/images/image1.jpg
instead of
http://127.0.0.1:81/themes/images/image1.jpg
which obviously means this will fail.
my HTML looks like below:
<img class="media-object" src="themes/images/img180x120.png" />
is there a way I can override this to force it to ignore the /shipper or /client from the path ?
Regards, Kiran
As i turns out just preceeding the url with a / will make it a path relative the the host server.

Failed to load gived URL

i want to place images in my project web pages
i dont know how to point\path to the correct address of the image
i put the image in all of those folders but yet i dont see the image and
when i inspect it with fire bug i see that the browser failed to load the url.
<img src="../calendar_schedule.png"> <img src="calendar_schedule.png">
<img src="admin/calendar_schedule.png">
only when i use this path i can see the image - but it cant be the way
<img src="http://localhost:2734/Admin/Style/calendar_schedule.png">
If you use
<img src="Admin/Style/calendar_schedule.png">
it will append to your url like this:
http://localhost:2734/ExamplePage1/Admin/Style/calendar_schedule.png
You can use with first / to append directly to hostname
<img src="/Admin/Style/calendar_schedule.png">
And it looks like this:
http://localhost:2734/Admin/Style/calendar_schedule.png
As I understand, you want to avoid using of server host part. You can do the next:
<img src="/Admin/Style/calendar_schedule.png">