In the world of Express, the res.write function showcases the magic of HTML elements contained within

Currently diving into web app development, I have ventured into using express and implemented the following code snippet:

app.post("/", function(req, res) {

  var crypto = req.body.crypto;
  var fiat = req.body.fiat;
  var amount = req.body.amount;

  var options = {
    url: "https://apiv2.bitcoinaverage.com/convert/global",
    method: "GET",
    qs: {
      from: crypto,
      to: fiat,
      amount: amount
    }
  };
  request(options, function(error, response, body) {
    var data = JSON.parse(body);
    var time = data.time;
    var price = data.price;
    res.write("Current time is: " + time);
    res.write("<p> Your " + amount + " " + crypto + " is worth " + price + 
    " " + fiat + "</p>");
    res.send();
  });
});

However, upon running my server and sending a POST request, the output on the page appears as follows:

Current time is: 2019-06-29 18:50:35 <p> Your 2 BTC is worth 23954.24 USD</p>

I am aware that res.write() should not render HTML, resulting in visible tags as text.

Have I made an error with my code? How can I rectify this issue so that HTML tags do not display as text on the page?

Your assistance is greatly appreciated :)

Answer №1

Experiment with any of the following code snippets above this line:

res.write("Displaying current time: " + time);

  • res.writeHead(200, {'Content-Type': 'text/html'})
  • res.header('Content-Type', 'text/html')
  • res.type('text/html')

If the issue persists, consider clearing the cache as well.

This is straight up vanilla nodejs. Learn more about it here: https://nodejs.org/api/http.html#http_response_writehead_statuscode_statusmessage_headers

Answer №2

res.write("<html><p> Your " + amount + " " + crypto + " is worth " + price + 
" " + fiat + "</p></html>");

this solution should resolve the issue. incorporating html tags around the paragraph elements should do the trick.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Efficient Checkbox Implementation in ActiveAdmin for Rails 3.1

This query actually encompasses two related inquiries. Enabling "Select all" functionality - In the realm of formtastic, which is used by Active_admin to render forms, how can I implement a button that selects all checkboxes present on the page? While ...

Utilize the failure of Travis due to issues with a Git submodule to improve

I am facing an issue with my Angular project that has a git submodule for the backend. When I build the project on my local machine, it is successful. However, when I try to build it on Travis, it fails. npm ERR! enoent ENOENT: no such file or directory, ...

Object displaying no visible illumination

Recently, I've been experimenting with this project, and after some trial and error, I've managed to get things working to some extent. As a novice in JavaScript, I'm unsure if the issue I'm facing has a simple solution. The problem is ...

The react-native-video-controls package was used in React Native. When the onBack event was triggered, it successfully navigated back to the initial screen. However, upon returning

https://i.stack.imgur.com/GsS3d.png https://i.stack.imgur.com/HYBOU.png Attached are screenshots showing the issue I am experiencing with my video player. When I click the back button, the screen does not return to its initial state and the flatlist items ...

Provide input to npm when running "my command" and utilize that input within my functions

Consider the contents of app.js const { doCoolStuff } = require("./api/myApi"); // grab parameter from command line and store it in "myParam" doCoolStuff(myParam); ... // more code And Package.json: { "name": "------ ...

Why isn't the page redirecting if the query is unable to locate the user?

Why does the application freeze when it fails to find a user, instead of redirecting to the main page? How can this issue be resolved? User.findOne({_id: userid}, function(err, user) { if(err) { res.redire ...

Utilize React.js ThemeProvider to dynamically change themes based on routing

Hey everyone, I have a question regarding changing the theme provider based on the route in my code snippet: const rootElement = document.getElementById('root'); ReactDOM.render( <ThemeProvider theme="MyThemes.default& ...

Enhancing TypeScript builtin objects in Netbeans using a custom plugin

While in the process of converting JavaScript code to TypeScript, I encountered a challenge with extending built-in objects using Object.defineProperty, such as String.prototype. Object.defineProperty(String.prototype, 'testFunc', { value: funct ...

Display the X button solely once text has been inputted into the textbox

I have integrated a text clearing plugin from here in my project to allow users to clear the input field by clicking on an X button. However, I want to modify the code so that the X button only appears when there is text entered in the textbox. I attempt ...

While it includes a new section, it fails to refresh the navbar

Upon clicking the button to add a new section, the section gets added successfully. However, the navbar does not get updated as expected. It should dynamically update the navbar to display both the existing sections and the new section added using JavaScri ...

How can I use vanilla JavaScript to retrieve all elements within the body tag while excluding a specific div and its descendants?

My goal is to identify all elements within the body tag, except for one specific element with a class of "hidden" and its children. Here is the variable that stores all elements in the body: allTagsInBody = document.body.getElementsByTagName('*&apos ...

Run a targeted command on AWS Beanstalk

I have a unique node.js application that specifically functions with sqlite. I am interested in conducting a 'proof of concept' on AWS ElasticBeanstalk without the need to adjust the node.js app to be compatible with a supported database Prior ...

Alas, an error has occurred with eslint npm. The elusive 404 Not Found reared its head once more when attempting to access the es

I'm currently in the process of organizing my JavaScript code and preparing to transition to TypeScript. I recently set up node.js, npm, and eslint on my Ubuntu 20.04 system. After doing so, I executed npm -init and eslint -init. $ npx eslist util.js ...

Strategies for extracting data from multiple Textareas in React

I am facing an issue with a form that contains multiple textarea elements (specifically 3). The problem is that when I type in one textarea, the content is automatically filled and updated in the other textareas as well. This behavior is not desired. I h ...

Blending ASP.NET Core 2.0 Razor with Angular 4 for a Dynamic Web Experience

I am currently running an application on ASP.NET Core 2.0 with the Razor Engine (.cshtml) and I am interested in integrating Angular 4 to improve data binding from AJAX calls, moving away from traditional jQuery methods. What are the necessary steps I need ...

Import a picture file into Photoshop and position it at a designated location

I need assistance with developing a function that can load an image and position it at specific x, y coordinates in Photoshop. Below is the code I have so far: var docRef = app.activeDocument; function MoveLayerTo(fLayer, fX, fY) { var Position = fLaye ...

Discovering a way to monitor keyup and keydown occurrences in JavaScript on an iPhone

Looking to track keyup/keydown events in JavaScript on iPhone browsers. My goal is to automatically move the focus to the next form element after the user has inputted the maximum number of characters in a text box. ...

Ember.js encountering an "Access-Control-Allow-Origin" error with Ajax

Seeking opinions on how to resolve the Access-Control-Allow-Origin issue in this simple Ajax code snippet. Attempts to define the Ember "Access-Control-Allow-Origin": "* " have been unsuccessful. Has anyone with a similar problem found a solution? The URL ...

Streaming data from BigQuery to the front-end using Express

Trying to extract a query from BigQuery and stream it to the frontend has been quite a challenge. In the Node.js environment with Express, one would assume it should look something like this: app.get('/endpoint', (req, res) => { bigQuery.cr ...

Modifying multiple objects with Vue's V-Model

When utilizing the mounted function in Vue to assign two different objects in the data area and bind one of them to a form, an unusual issue arises: Both objects change when input values are entered in the form For example: <template> <v-card ...