I have searched extensively for what seems a rather simple question but found no answers. Does anybody know how to reference a webpage created in Node Red running on IBM Bluemix? Here is my flow...
My http in node is referencing "/temp1" but when I type my bluemix address with "/temp1" at the end I get the error "Cannot GET /temp1". This seems so remedial I am sure that it is just a setting or missing characters in the reference. Thank you so much for your help. Here is my web page html by the way...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Test Home HVAC Zone Control</title>
</head>
<body>
<h2>
WebSocket Test
</h2>
Outside Temperature: <input id="display_external_temperature" type="text" value="0"></input><br>
Media Room:<br>
Set Temperature: <input id="mr_set_temp" type="text" value="0"></input><br>
Current Temperature: <div id="mr_temp">0</div><br>
Humidity: <div id="mr_humidity">0</div><br>
DC Voltage: <div id="mr_vcc">0</div><br>
Status: <div id="status">unknown</div>
</body>
</html>
You need to set an appropriate header, add for example a function node after your html one with:
msg.headers={"Content-Type":"text/html"}
return msg;
Here is a modified flow:
[{"id":"d6ed730e.41fab8","type":"http in","z":"f0084239.95c63","name":"/temp","url":"/temp","method":"get","swaggerDoc":"","x":88.5,"y":425.40000915527344,"wires":[["6b3a011d.14e8d"]]},{"id":"6b3a011d.14e8d","type":"template","z":"f0084239.95c63","name":"html","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<!DOCTYPE html PUBLIC \"-//W3C//DTD HTML 4.01//EN\">\n<html>\n <head>\n <title>Test Home HVAC Zone Control</title>\n </head>\n <body>\n <h2>\n WebSocket Test\n </h2>\n Outside Temperature: <input id=\"display_external_temperature\" type=\"text\" value=\"0\"></input><br>\n Media Room:<br>\n Set Temperature: <input id=\"mr_set_temp\" type=\"text\" value=\"0\"></input><br>\n Current Temperature: <div id=\"mr_temp\">0</div><br>\n Humidity: <div id=\"mr_humidity\">0</div><br>\n DC Voltage: <div id=\"mr_vcc\">0</div><br>\n Status: <div id=\"status\">unknown</div>\n\n\n </body>\n</html>","x":283.49998474121094,"y":416.40000915527344,"wires":[["9ac696a6.89a578"]]},{"id":"9ac696a6.89a578","type":"function","z":"f0084239.95c63","name":"setHTTPheader","func":"msg.headers={\"Content-Type\":\"text/html\"}\nreturn msg;","outputs":1,"noerr":0,"x":514.2000122070312,"y":419.20001220703125,"wires":[["dc5c1338.e50888"]]},{"id":"dc5c1338.e50888","type":"http response","z":"f0084239.95c63","name":"/temp","x":745.4999847412109,"y":405.8000030517578,"wires":[]}]
Related
local index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<form action="/sign" method="POST">
<input v-model="zip" id="zip" type="text">
<input type="submit" value="Submit">
</form>
{{ zip }}
</div>
<script>
const App = new Vue({
el: '#app',
data: {
zip: ''
},
})
</script>
</body>
</html>
We open this in chrome. After entering something in the input box, we can see in the chrome console that v-model is correct:
App.zip and document.querySelector('#zip').value are the same.
If we then navigate to a new site (www.google.com, etc.), and then hit back on the browser to go back to the index.html file,
App.zip = ''
and
document.querySelector('#zip').value is = to what we put in before.
Is this documented and expected? Can we make it so that App.zip tracks this correctly?
Thanks.
That's back-forward cache (at least the implementation on Chrome).
In a real scenario bfcache is disabled because the app is either on https or because it's not cached (header Cache-Control: no-cache, max-age=0, must-revalidate, no-store)
I could not comment, I wrote as an answer because my score was not enough. I think you should take a look here. https://vuex.vuejs.org/
I'm developing a RESTful API with Spring Boot as backend and an Angular 9 frontend. Upon user registration, a verification email is sent, in which the user needs to click on a link to verify their account. Functionally, all is set and working. However, the HTML is never rendered despite having Content-Type set to 'text/html' and charset to UTF-8. I'm using Thymeleaf to generate the HTML:
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html charset=UTF-8" />
</head>
<body>
<header>TooManyThoughts</header>
<section>
<p th:text="#{registration.mail.greeting(${#messages.msg('mail.greeting.title.' + user.personalData.title.representation, user.personalData.firstName, user.personalData.lastName)})}"></p>
<p th:text="#{registration.mail.preamble}"></p>
<p>
<a th:text="#{registration.mail.link}"
th:href="#{http://localhost:8081/auth/register/email/verify/{id}/{key}(id = ${user.id}, key = ${user.emailValidationKey}, send='auth,login', verified='email')}"></a>
</p>
<p>
<span th:text="#{registration.mail.clue01(${user.credentials.username})}"></span>
<span th:text="#{registration.mail.clue02}"></span>
</p>
<p th:text="#{registration.mail.catchphrase}"></p>
<p th:text="#{registration.mail.goodbye}"></p>
<p>
<span th:text="#{registration.mail.signature01}"></span>
<br>
<span th:text="#{registration.mail.signature02}"></span>
</p>
</section>
<footer></footer>
</body>
At the time of writing, all frameworks used are in their latest versions. Currently, I'm sending the email to my personal gmail account. When googling the issue, I've found some rendering issues with gmail, but they've all been old and from around 2011 or so. The only other posts and entries I could find were about setting Content-Type and charset properly, which in my opinion I've done.
I'm kinda stuck here since two days with what I believe should be a very basic issue, so any help is highly appreciated.
Thanks to Andrew's hint on using setContent() instead of setText() for javax.mail.Message, I realized that I've never actually set the content type of my email anywhere in the code. I'm not using javax.mail but springframework.mail.javamail, so I had to look for a solution and I found it here. The working code now looks like this:
public EmailVerificationModel sendMail(final EmailVerificationModel model) {
final MimeMessagePreparator msgPreparator = mimeMessage -> {
final MimeMessageHelper msgHelper = new MimeMessageHelper(mimeMessage, "UTF-8");
msgHelper.setFrom("petesideburner#gmail.com");
msgHelper.setTo(model.getCredentials().getEmail());
msgHelper.setSubject(this.mailBuilder.subject(model));
msgHelper.setText(this.mailBuilder.build(model), true);
};
this.mailSender.send(msgPreparator);
return this.verificationMailSent(model);
}
All that I had to do was to pass true as 2nd argument to Spring's MimeMessageHelper.setText() method. The hidden quirks of method signatures. Personally, I prefer more distinct names for methods and variables, and so for better readability of my code I've changed it to:
public EmailVerificationModel sendHtmlMail(final EmailVerificationModel model) {
final boolean html = true;
final MimeMessagePreparator msgPreparator = mimeMessage -> {
[...]
msgHelper.setText(this.mailBuilder.build(model), html);
};
this.mailSender.send(msgPreparator);
return this.verificationMailSent(model);
}
Fixed: Thanks to #Sajeetharan, it was discovered that amongst other things the function the expression was attempting to display, GenerateRef, was broken and causing the issue.
I understand this is a reasonably common question but so far my following of other posts or tutorials has not been able to fix my issue with getting {{}} to display the result.
I am trying to make a simple web app to take in a new request. This is given a randomly generated ID which is then presented in a table and is what I'm having problems displaying in the table. Despite following tutorials and attempting to debug it I am unable to, probably as I am very new to Angular and HTML. Apologies in advance.
angular.module('ReqWebApp', [])
pegasusWebApp.controller('ReqAppController', function ReqAppController($scope) {
$scope.GenerateRef = ["RF" + date.now()]
});
<!DOCTYPE html>
<html ng-app="ReqWebApp">
<head>
<meta charset="UTF-8">
<title>New Request</title>
<script src="../../app.js"></script>
<script src="../../bower_components/angular/angular.js"></script>
</head>
<body ng-controller="ReqAppController">
<p><span>Add New Request | Accept <input type="checkbox" name="accept"> | Decline <input type="checkbox" name="decline"></span></p>
<table border="1">
<tr><th>REF : {{GenerateRef}}</th> <th>Producer Reference : <input type="text" name="prodRef"></th></tr>
<tr><th>Producer :
<select>
<option>EXAMPLE</option>
<option>EXAMPLE</option>
</select></th> <th>Producer Site : <input type="text"></th>
</tr>
</table>
</body>
</html>
The script locations should be working locally for me (I have tested this) as I am using Bower and Node to install, maintain and run AngularJS and the project. I have tried setting out the AJS controller several different ways so far according to different tutorials and Stack Overflow posts and this is the current rendition as it was the most up to date I could find.
Also worth noting is there have been some edits to the snippet from the code I'm running and some typos or other errors may be a result of me changing variable names to post here.
Thanks to anyone taking the time to read through.
You need to have it as,
var pegasusWebApp = angular.module('ReqWebApp', [])
pegasusWebApp.controller('ReqAppController', function ReqAppController($scope) {
$scope.GenerateRef = ["RF" + date.now()]
});
you are missing the declaration part. also angular reference should be loaded before loading app.js
<script src="../../bower_components/angular/angular.js"></script>
<script src="../../app.js"></script>
DEMO
var pegasusWebApp = angular.module('ReqWebApp', [])
pegasusWebApp.controller('ReqAppController', function ReqAppController($scope) {
$scope.GenerateRef = ["RF" + new Date()]
});
<!DOCTYPE html>
<html ng-app="ReqWebApp">
<head>
<meta charset="UTF-8">
<title>New Request</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body ng-controller="ReqAppController">
<p><span>Add New Request | Accept <input type="checkbox" name="accept"> | Decline <input type="checkbox" name="decline"></span></p>
<table border="1">
<tr><th>REF : {{GenerateRef}}</th> <th>Producer Reference : <input type="text" name="prodRef"></th></tr>
<tr><th>Producer :
<select>
<option>EXAMPLE</option>
<option>EXAMPLE</option>
</select></th> <th>Producer Site : <input type="text"></th>
</tr>
</table>
</body>
</html>
Or, if that's impossible for some reason, a simpler question: how can I get the physical directory of the current file from a layout page?
this.VirtualPath will refer to the virtual path of the layout file itself, and this.NormalizePath(".") will only get the virtual path of the directory containing the layout file.
I just want to be able to have a site that doesn't have the possibility of relative links suddenly not working just because some guy typed http://example.com/index/some/other/junk for no reason.
EDIT to show you what I mean:
TestLayout.cshtml
<html>
<head>
<title>Test Page</title>
</head>
<body>
<div style="background: grey">
#Request.RawUrl<br />
#Request.Url.AbsolutePath<br />
#Request.Url.AbsoluteUri<br />
#Request.Url.LocalPath<br />
#Request.CurrentExecutionFilePath<br />
#Request.FilePath<br />
#Request.Path<br />
#VirtualPath<br />
</div>
<div style="background: red">
#RenderBody()
</div>
</body>
</html>
Test.cshtml
#{
Layout = "TestLayout.cshtml";
}
#Request.RawUrl<br />
#Request.Url.AbsolutePath<br />
#Request.Url.AbsoluteUri<br />
#Request.Url.LocalPath<br />
#Request.CurrentExecutionFilePath<br />
#Request.FilePath<br />
#Request.Path<br />
#VirtualPath<br />
If you go to http://example.com/Test/random/junk/at/the/end, you'll find that the only lines that correctly trim all the cruft are the two #VirtualPath lines - however, the VirtualPath property of the layout page is TestLayout.cshtml. How do I access Test.cshtml's VirtualPath property from within TestLayout.cshtml?
So, after many, many hours, I've figured it out.
No, you cannot disable the automatic URL routing of ASP.Net WebPages - it's baked in to the WebPageRoute class. The only way to disable it is to disable WebPages entirely.
There are two ways that you can access the VirtualPath of the parent .cshtml file from a child layout.
You can manually parse the URL. This is fairly involved, although all the work has been done already in the WebPageRoute.cs file, so you can just nick it with a few tweaks. The problem is that you can only get the VirtualPath of the topmost parent page.
You can extend the WebPage class, overriding the ConfigurePage method, and store the argument for later use. Example code follows:
CustomWebPage.cs
using System.Web;
using System.Web.WebPages;
public abstract class CustomWebPage : WebPage
{
private WebPageBase _parentPage;
public WebPageBase ParentPage { get; private set; }
protected override void ConfigurePage(WebPageBase parentPage)
{
ParentPage = parentPage;
}
}
TestLayout.cshtml
<html>
<head>
<title>Test Page</title>
</head>
<body>
<div style="background: grey">
Inside the layout page!<br/>
VirtualPath is: #VirtualPath<br />
Parent's VirtualPath is: #ParentPage.VirtualPath
</div>
<div style="background: red">
#RenderBody()
</div>
</body>
</html>
Test.cshtml
#{
Layout = "TestLayout.cshtml";
}
Inside the main test page!<br />
VirtualPath is #VirtualPath
Output:
Inside the layout page!
VirtualPath is: ~/TestLayout.cshtml
Parent's VirtualPath is: ~/Test.cshtml
Inside the main test page!
VirtualPath is ~/Test.cshtml
Hi I am using MVC Mailer to manage creating and sending emails in my application. It will create and send the email fine but any html I insert inside the body in the layout is not in the email.
Mailer
public class Mailer : MailerBase, IMailer
{
public aMailer()
{
MasterName = "_EmailLayout";
}
public virtual MvcMailMessage RequestAccess(RequestAccessViewModel viewmodel)
{
ViewData.Model = viewmodel;
return Populate(x =>
{
x.Subject = "RequestAccess for Data";
x.ViewName = "RequestAccess";
x.To.Add("AppTeam#groups.hp.com");
x.From = new MailAddress(viewmodel.Email);
});
}
}
I am setting it to use _EmailLayout here, I cahnged the name after seeing that there was an issue with naming it _Layout because it would conflict with any other files named _Layout.
_EmailLayout
<html>
<head>
</head>
<body>
<h1>Mailer</h1>
#RenderBody()
Thanks
</body>
The contents of the H1 tag or "Thanks" are not in the email
Access.cshtml
<h3>"This is a Application email." </h3>
<p>#Model.Message</p>
<br/>
<p>Regards</p>
<p>#Model.Name</p>
<p>Business Area: #Model.BusinessArea</p>
Email Source
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii"><title></title>
</head>
<body>
<p> Hi jeff test,</p>
<br>
<p>Thank you for your enquiry about the Application.</p>
<br>
</body>
Has anyone come across this issue before? When I debug my application I can see that it is going into the _EmailLayout but I don't know why the HTML in that files is not rendered.
After posting the following issue on the github page for MVC Mailer
Changing the layout code to this fixed the problem
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
Mailer
#RenderBody()
Thanks
</body>
</html>
I'm not sure why this fixed the problem but it did.