moving photos from resource/static/images to local drive - thymeleaf

I am moving photos from resource/static/images. in spring boot to local drive d:\images
while the photos were in resource/static/images I used the following code to display them in Thymeleaf.
<img th:src="#{/images/one.jpg}">
now I have moved the photos to "d:\images" folder this following code line does not work:
<resources mapping="/resources/**" location="d:/images/three.jpg/" />
the question is, how can I access the photos from local "d:\images" folder?
I am using spring boot with thymeleaf to build a basic web site, to practice the skills I have gained through online courses I have completed. since I am new to creating web site, I am not sure I have any XML file, Spring boot might have created one for me. I was thinking to put the photos in mysql table, but they might make the table heavy to load to web browser. I read somewhere that you can put the photos on the local desk drive such as c: or d: drive. or you put the photos in a folder in server, the problem is have no clue how to do it.
here my html:
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>sport for all </title>
<a th:href="#{index}">Main Page</a>
</head>
<body>
<div>
<h1></h1>Hi
<p>
hello
hello
hello
</p>
<resources mapping="/resources/**" location="d:/images/three.jpg/" />
</div>
</body>
</html>

The simplest solution in Spring Boot would be to use the spring.resources.static-locations property:
spring.resources.static-locations=classpath:/META-INF/resources/,classpath:/resources/,classpath:/static/,classpath:/public/,file:///D:/images/
Documentation
Tutorial
Similar question on SO

Related

Adding new divs (blocks of content) inside OneNote page using the Microsoft Graph API

I am using the Microsoft Graph API to programmatically add content to a OneNote Page on my Office365 OneNote Notebook. For an example page like this:
OneNote snip consisting of Title & 2 separate divs/blocks, this is the generated HTML that I get by making a GET to the pages/{myPageID}/content?includeids=true endpoint
<html lang="en-US">
<head>
<title>Thursday, December 6, 2018</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="created" content="2018-12-06T19:55:00.0000000" />
</head>
<body data-absolute-enabled="true" style="font-family:Calibri;font-size:11pt">
<div id="div:{95790d05-168a-4f61-81a7-5c13e3124069}{4}" style="position:absolute;left:48px;top:115px;width:624px">
<p id="p:{95790d05-168a-4f61-81a7-5c13e3124069}{10}" style="margin-top:0pt;margin-bottom:0pt">It is a jolly good day</p>
</div>
<div id="div:{3a6b78e9-2af8-4a5b-abf8-09871fb6eec5}{20}" style="position:absolute;left:44px;top:180px;width:624px">
<p id="p:{3a6b78e9-2af8-4a5b-abf8-09871fb6eec5}{24}" style="margin-top:0pt;margin-bottom:0pt">Lets do this shall we</p>
</div>
</body>
</html>
I now try adding a new div/block by making the following PATCH using the requests library in Python. The myPageID and access_token are collected previously by making GET requests to the graph API:
patchPageURL='https://graph.microsoft.com/v1.0/users/'+userID+'/onenote/pages/'+myPageID+'/content?includeIDs=true'
patchPageHeaders={
'Content-Type':'application/json',
'Authorization':'Bearer '+access_token
}
patchPageBody=[{
'target':'div:{3a6b78e9-2af8-4a5b-abf8-09871fb6eec5}{20}',
'action':'insert',
'position':'after',
'content':'<div><p> And God said let there be new blocks </p></div>'
}]
patchResp = requests.patch(patchPageURL, headers=patchPageHeaders, json=patchPageBody)
However, I end up with a 400 error as a response to my PATCH request with the following code and message:
code: 20135
message: The entity type is not supported for this operation.
If I change the opening div tag for the content to something like <div data-id="new-div">, I still receive the same 400 error, code 20135.
I am following the instructions from this documentation here. What subtlety is being missed here? There are no authentication or other similar errors. The PATCH works fine if I change the target to body and the action to append but that doesn't make a new div/block and only adds the content as a child of the first div in the page.
Is there a straightforward way to add new blocks/divs as a sibling of existing blocks or even just something as simple as adding a new block at the end of the OneNote page?

PNG files not found in ASAR

I have an Electron (1.7.10) application that is reporting it can't find 5 of 7 PNG files in my ASAR. All 7 PNGs are in the same folder, and 2 of them are displayed on screen fine. The other 5 report net::ERR_FILE_NOT_FOUND.
All src attributes for the img tags are dynamically generated and use relative paths (assets/images/MyImage.png). If I extract the ASAR, I can see the files in there, in the correct folder (as referenced by the src attribute).
If I use the console to set the location of my browser to one of the images (document.location.href = "file:///path/to/app.asar/dist/assets/images/MyImage.png") I get the same results - 2 of 7 show OK.
Before packaging my application (with electron-builder), all images show correctly.
Let me guess, you are building a react SPA using react-router, and BrowserRouter?
If so, use HashRouter instead. Electron does not work with SPA's route by default, because a SPA route changes, but the resource path is always relative to index.html.
I haven't evaluated the other answers, but for my particular case, an extremely solution worked. I don't believe this is well documented, so it might be fairly common for people to still encounter this issue. For my particulars, the relevant problem and solution were identified here.
To address, add <base href='./' /> to the index.html (or whatever your starting html file is that hosts your SPA). This is a complete example of mine:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="./" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<meta
http-equiv="Content-Security-Policy"
content="script-src 'Self' 'unsafe-inline';"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
</html>
const path = require('path');
path.join(__dirname, 'assets/images/MyImage.png');

Browse Another Website Inside MVC Application

I have an existing web application which I want to display inside my new application, so as to the complete application works inside the new application.
In the image i've attached google.com so on search of something is should show the result or even open the website.
I'm not sure how to achieve that.
One way I found is IFrame, so would I to know any other possibilities are their as I do want to use IFrame
Attaching an Image for an example
Thanks in advance.
Maybe you can use something like fancybox tools. http://fancyapps.com/fancybox/#examples
But usually these tools are also using iframes. Maybe you can find another way for fancybox.
edit:Embed an External Page Without an Iframe?
edit 2: did you try this?
http://www.felgall.com/noiframe.htm
<html>
<head>
<title>example</title>
</head>
<body>
Ilker Test
<br />
<!--[if lte IE 6]>
<object classid="CLSID:25336920-03F9-11CF-8FD0-00AA00686F13"
data="http://www.w3schools.com/html/html_examples.asp" style="height:800px; width:1200px; overflow:hidden;">
</object>
<![endif]-->
<!--[if gte IE 7]><!-->
<object type="text/html" data="http://www.w3schools.com/html/html_examples.asp"
style="height:800px; width:1200px;">
<p>Alternate text.</p>
</object>
<!--><![endif]-->
</object>
</body>

Rails app not accessible through subdomain

I have deployed a Rails 4 app onto a digitalocean server.
Stack is Nginx-Unicorn-Ubuntu 14.04.
I have a domain at say abc.com ( and this domain has another website hosted elsewhere )
I created a subdomain called support.abc.com, and pointed it to the digitalocean server.
When i head to support.abc.com, I get this result:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>support.abc.com</title>
</head>
<frameset rows="100%,*" border="0">
<frame src="http://<ip address of droplet>" frameborder="0" />
<frame frameborder="0" noresize />
</frameset>
<!-- pageok -->
<!-- 03 -->
<!-- -->
</html>
When I access the app through the IP address of droplet, the app works fine.
Only when I head to support.abc.com I get the above page, which is basically a blank page.
How do i make it work?
Found a solution.
The problem wasn't with Rails.
The client had "forwarded" the subdomain to the IP instead of adding an A record.

"Object reference not set to an object" when starting out with Cassette

I'm trying to get started with Cassette via NuGet. I'm having issues with it in my app so I rolled back and tried it in a new empty ASP.NET MVC 3 web application.
However, the problem persists. Following the documentation page "Easy to use", I simply can't get it to work. Here's the exception along with a bit of the stack:
"Object reference not set to an instance of an object."
[NullReferenceException: Object reference not set to an instance of an object.]
Cassette.CassetteApplicationContainer.get_Application() +6
Cassette.Views.Bundles.Reference(String assetPathOrBundlePathOrUrl, String pageLocation) +14
ASP._Page_Views_Shared__Layout_cshtml.Execute() in d:\Dave\Documents\Visual Studio 2010\Projects\CasetteTest\Views\Shared\_Layout.cshtml:2
System.Web.WebPages.WebPageBase.ExecutePageHierarchy() +207
I simply followed the two steps in the documentation and this is what I get. What am I doing wrong?
This is what my _Layout.cshtml file looks like:
#{
Bundles.Reference("Scripts/jquery-1.5.1.min.js");
Bundles.Reference("Scripts/modernizr-1.7.min.js");
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>#ViewBag.Title</title>
<link href="#Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
</head>
<body>
#RenderBody()
#Bundles.RenderScripts();
</body>
</html>
I figured it out.
I included the Cassette.Views package which does not create a default CassetteConfiguration.cs file that bundles each script and each css file in its own bundle. That's what triggered the NullReferenceException. In order to get it to work, you'll need to add the Cassette.Web package instead. In my defense, the package descriptions in the NuGet gallery are not clear and one is led to believe that the Views package is required for MVC and the other for WebForms.
The next problem was that I referenced the minified '.min.js' scripts which are not picked up by the bundler (it seems).
Cannot reproduce the issue.
4 simple steps allowed me to get a fully working prototype in less than 30 seconds:
Create a new ASP.NET MVC 3 project in Visual Studio
Install-Package Cassette.Web
Index.cshtml:
#using Cassette.Web
#{
Bundles.Reference("~/Scripts/jquery-1.5.1.js");
Bundles.Reference("~/Scripts/jquery-ui-1.8.11.js");
Bundles.Reference("~/Content/site.css");
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>Web App</title>
#Bundles.RenderStylesheets()
</head>
<body>
<div>Hello World</div>
#Bundles.RenderScripts()
</body>
</html>
Hit Ctrl+F5 to run the project

Resources