我使用nodeJS(和express和EJS)来做一些模板html渲染,但是即使我的HTML页面没有任何问题,当我浏览nodeJS时它很奇怪......
https://image.noelshack.com/fichiers/2018/08/6/1519493923-capture.png
这里是我的nodeJS服务器(完整代码):
// EXEMPLE :
//function site(name, url, img_path, description, refcode){
// this.name = name;
// this.url = url;
// this.img_path = img_path;
// this.description = description;
// this.refcode = refcode;
//}
var placeholder = require("./site_placeholders.js");
var mapSite = placeholder.siteMap;
//EXPRESS
var express = require('express');
var app = express();
app.get('/', function(req, res) {
res.setHeader('Content-Type', 'text/plain');
res.end('Vous êtes à l\'accueil');
});
app.get('/site-list', function(req, res){
res.setHeader('Content-Type', 'text/plain');
res.end('Vous êtes à la liste des sites');
})
mapSite.forEach(function(value, key){
app.get('/site/' + key, function(req, res){
res.render('template.ejs', {name: value.name, imgpath: value.img_path, desc: value.description, url: value.url, refcode: value.refcode});
//res.setHeader('Content-Type', 'text/plain');
//res.end('Vous êtes sur la page du site' + value.name + " | " + value.url);
})
})
app.use(function(req, res, next){
res.setHeader('Content-Type', 'text/plain');
res.send(404, 'Page introuvable !');
//PAGE 404
});
app.listen(8080);
这里是template.ejs的代码:
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>FluxReferalls | Detailled Informations : <%= name %> </title>
<meta name="description" content="Demo of Material design portfolio template by TemplateFlip.com."/>
<link href="https://fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="https://code.getmdl.io/1.3.0/material.indigo-red.min.css" rel="stylesheet">
<link href="/styles/main.css" rel="stylesheet">
<style>
.copyContainer{
color: red;
}
</style>
</head>
<body id="top">
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
<header class="mdl-layout__header mdl-layout__header--waterfall site-header">
<div class="mdl-layout__header-row site-logo-row">
<span class="mdl-layout__title">
<div class="site-logo"></div>
<span class="site-description">FluxReferalls | Home</span>
</span>
</div>
<div class="mdl-layout__header-row site-navigation-row mdl-layout--large-screen-only">
<nav class="mdl-navigation mdl-typography--body-1-force-preferred-font">
<a class="mdl-navigation__link" href="/index.html">Home</a>
</nav>
</div>
</header>
<div class="mdl-layout__drawer mdl-layout--small-screen-only">
<nav class="mdl-navigation mdl-typography--body-1-force-preferred-font">
<a class="mdl-navigation__link" href="/index.html">Home</a>
</nav>
</div>
<br><br>
<main class="mdl-layout__content">
<section class="section--center mdl-grid site-max-width" style= "padding-bottom: 2%">
<div class="section--center mdl-cell mdl-card mdl-shadow--4dp portfolio-card">
<div class="mdl-card__media">
<img class="article-image" src="/img/<%= imgpath %>" border="0" alt=""> <!-- URL A REMPLACER PAR IMAGE DU SITE EN QUESTION ! -->
</div>
<div class="mdl-card__title">
<h2 class="mdl-card__title-text"><%= name %></h2>
</div>
<div class="mdl-card__supporting-text">
<%= desc %>
</div>
<br>
<div class="mdl-card__actions mdl-card--border">
<a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent" href="<%= url %>" target="_blank"> Go ! </a>
<button id="copy" type="button" class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent">Copy Ref Code !</button>
</div>
</div>
</section>
<textarea readonly="readonly" id="to-copy" style="border:none; color: black; width: 100%; text-align: center; font-size: 3em"><%= refcode %></textarea> <!-- A REMPLACER PAR LE CODE SUR LE SITE EN QUESTION ! -->
<footer class="mdl-mini-footer">
<div class="footer-container">
<div class="mdl-logo">Contact us to add your gambling website : <a href="../contact.html" target="_blank">Click here !</a>
| © FluxMining 2018, Design inspired by : <a href="https://templateflip.com/" target="_blank">TemplateFlip</a></div>
<ul class="mdl-mini-footer__link-list">
<li></li>
<li><a href="terms.html" target="_blank">Privacy & Terms</a></li>
</ul>
</div>
</footer>
</main>
<script src="https://code.getmdl.io/1.3.0/material.min.js" defer></script>
<script>
var toCopy = document.getElementById( 'to-copy' ),
btnCopy = document.getElementById( 'copy' );
btnCopy.addEventListener( 'click', function(){
toCopy.select();
document.execCommand( 'copy' );
return false;
} );
</script>
</div>
</body>
</html>
&#13;
即使我打开控制台,它看起来像是无法处理的,但这是正确的路径......
如果它无法工作,我肯定会在PHP中这样做......
度过一个美好的夜晚, 〜TBD