Index.html to EJS file error

Question

I'm beginner with developer, so, i'm sorry if I did some wrong, and tell me how to solve, please...

I create some function's inside .html file, just for test , and work's fine. But, I see examples with EJS module and I can try with them for security. And, I create other archive .ejs with all the code .html file, but, dont work fine, the error in console is:

And my code use jQuery and some archives .js inside /public paste shown in these console errors

My old html file:

<html>
<head>
  <script src="jquery-3.1.1.js"></script>
  <script src="app.js"></script>
  <base href="/">
  <title>XXXXXXXXXXXXXXXX</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta ------ />
  <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
  <link rel="stylesheet" href="css/app.css">
</head>
<body>
  <div id="view-change-button" class="button" onclick="Payloadxxxxxxx.togglePanel(event, this)">
    <img class="option full" src="../img/Chat Button.png">
    <img class="option not-full" src="../img/Code Button.png">
  </div>
  <div id="contentParent" class="responsive-columns-wrapper">
    <div id="chat-column-holder" class="responsive-column content-column">
      <div class="chat-column">
        <div id="scrollingChat"></div>
        <label for="textInput" class="inputOutline">
          <input id="textInput" class="input responsive-column"
            placeholder="Digite algo" type="text"
            onkeydown="xxxxxxxxxxxxxxxxPanel.inputKeyDown(event, this)">
        </label>
      </div>
    </div>
    <div id="payload-column" class="fixed-column content-column">
      <div id="payload-initial-message">
        xxxxxxxxxxxxxxxxxxxxxxxxxxxxxOtherDescription.
      </div>
      <div id="payload-request" class="payload"></div>
      <div id="payload-response" class="payload"></div>
    </div>
  </div>

My new EJS file with HTML and function's code :

 <html>
        <head>
          <script src="jquery-3.1.1.js"></script>
          <script src="app.js"></script>
          <base href="/">
          <title>XXXXXXXXXXXXXXXX</title>
          <meta ------ />
          <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
          <link rel="stylesheet" href="css/app.css">
        </head>
        <body>
          <div id="view-change-button" class="button" onclick="Payloadxxxxxxx.togglePanel(event, this)">
            <img class="option full" src="../img/Chat Button.png">
            <img class="option not-full" src="../img/Code Button.png">
          </div>
          <div id="contentParent" class="responsive-columns-wrapper">
            <div id="chat-column-holder" class="responsive-column content-column">
              <div class="chat-column">
                <div id="scrollingChat"></div>
                <label for="textInput" class="inputOutline">
                  <input id="textInput" class="input responsive-column"
                    placeholder="Digite algo" type="text"
                    onkeydown="xxxxxxxxxxxxxxxxPanel.inputKeyDown(event, this)">
                </label>
              </div>
            </div>
            <div id="payload-column" class="fixed-column content-column">
              <div id="payload-initial-message">
                xxxxxxxxxxxxxxxxxxxxxxxxxxxxxOtherDescription.
              </div>
              <div id="payload-request" class="payload"></div>
              <div id="payload-response" class="payload"></div>
            </div>
          </div>
 <? 
  var numberOrigin = 330;
  function xxxxx(){
     var obj2 = login("xxxxxxxxxx", "xxxxxxxxxxxt321", numberOrigin);
     numberOrigin++;
   }

var obj;

  function xxxx(xxxxxxxxxxxxxxxxxxxx){
  numberOrigin +=1;
 //some codes with ajax
  }

   function otherFunction(){
  //otherFunction code    
   }
?>
   // I need the .js files for my function to work fine
  <script src="js/xxxxx.js"></script>
  <script src="js/xxxxxxxx.js"></script>
  <script src="js/xxxxxxxxxx.js"></script>
  <script src="js/xxxxxxxxxx.js"></script>
  <script src="js/xxxxxxxxx.js"></script>
</body>
</html>

My server.js file:

 #!/usr/bin/env node

    'use strict';

    var express = require('express');  //recuperando biblioteca express
    var x = express(); // executado funçao que o express retorna
        x.set('view engine', 'ejs');

        x.get('/', function(req, res){
        res.render("../public/index"); //the new index.ejs file
        })

    var server = require('./app');
    var port = process.env.PORT || process.env.VCAP_APP_PORT || 3000;

    x.listen(port, function() {
      console.log('Server running on port: %d', port);
    });

The OLD server.js :

#!/usr/bin/env node

'use strict';

var server = require('./app');
var port = process.env.PORT || process.env.VCAP_APP_PORT || 3000;

server.listen(port, function() {
  console.log('Server running on port: %d', port);
});

The app.js:

'use strict';

require( 'dotenv' ).config( {silent: true} );

var express = require( 'express' );  // app server
var bodyParser = require( 'body-parser' );  // parser for post 
var xxxxxxxxxx = require( 'xxxxxxxxxxxxcloud' );  // xxxsdk



//  requires 
var uuid = require( 'uuid' );
var vcapServices = require( 'vcap_services' );
var basicAuth = require( 'basic-auth-connect' );
var http = require( 'http' );

// endpoints
var logs = null;
var app = express();

// Bootstrap application settings
app.use( express.static( './public' ) ); // load UI from public folder
app.use( bodyParser.json() );

// Create the service 
var oneVariable = tes.test( {
  url: 'https://gateway.xxxxxxxxxxxxxxxxxxxxxxx/api',
  username: 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
  password: 'xxxxxxxxxxxxxxx',
  version_date: 'x-12-03',
  version: 'xxx'
} );

// Endpoint to be call from the client side
app.post( '/api/message', function(req, res) {
  var xxxxxxxxxxx = "dxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx4";  
  if ( !xxxxxxxxx || xxxxxxxxx === '<xxxxxxxxx-id>' ) {
    return res.json( {
      'xxxxxxxxxxx': {
        'text': xxxxxxxxxxxxxxxxx'
      }
    } );
  }

function checkxxxxxxxxxx(data) {
  return data.xxxxxxxxxx && data.xxxxxxxx.length > 0 && data.xxxxxx[0].xxxxxx === '[]'
    && data.xxxxx && data.entities.xxxxx > 0 && data.xxxxx[0].entity === 'xxxxx';
}

function xxxxxxxxxxURL(xxx, xxx) {

}

module.exports = app;

Answer 1

Express isn't serving the files inside your public folder. That said, you need to set the public directory with express:

x.use(express.static('public'));

Index.html to EJS file error

Question

1 answers

solution1
2 ACCPTED 2017-01-10 16:46:37

Index.html to EJS file error

Question

1 answers

solution1 2 ACCPTED 2017-01-10 16:46:37

solution1
2 ACCPTED 2017-01-10 16:46:37