我在tomcat docker容器中导入了一个war ...但我在Windows上使用Eclipse + Xampp(apache,mysql)创建了这个web-app。
在Windows上一切正常,在ubuntu上,当我指向我的第一个html页面时,加载时,会出现以下错误:
Uncaught TypeError: $.cookie is not a function
at HTMLDocument.checkLoggedRedirectToLogin (manageSessionAndCookie.js:29)
at fire (jquery-2.js:3187)
at Object.fireWith [as resolveWith] (jquery-2.js:3317)
at Function.ready (jquery-2.js:3536)
at HTMLDocument.completed (jquery-2.js:3552)
这是我最初的html页面:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>SAVA Simple Audio/Video Application</title>
<!-- modal javascript -->
<script type="text/javascript" src="bootsnip/jquery/jquery-2.js"></script>
<script type="text/javascript" src="bootsnip/js/modal.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/manageSessionAndCookie.js"></script>
<!-- css form login -->
<link href="bootsnip/css/ModalLogin.css" rel="stylesheet">
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/grayscale.css" rel="stylesheet">
<script type="text/javascript">
// Crea una nuova richiesta
function newXMLHttpRequest() {
var request = null;
var browser = navigator.userAgent.toUpperCase();
if(typeof(XMLHttpRequest) === "function" || typeof(XMLHttpRequest) === "object") {
request = new XMLHttpRequest();
} else if(window.ActiveXObject && browserUtente.indexOf("MSIE 4") < 0) {
if(browser.indexOf("MSIE 5") < 0) {
request = new ActiveXObject("Msxml2.XMLHTTP");
} else {
request = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return request;
}
// Callback: è stata editata la casella di testo login_username
function validaInput() {
console.log ("chiamata validaInput() ajax");
var login_name= document.getElementById("login_username");
if (login_name.value != "") {
var req = newXMLHttpRequest();
req.onreadystatechange = function() {
if (req.readyState == 4) {
if (req.status == 200) {
gestisciRisposta(req.responseXML);
}
}
};
var url_validate_name = getUrlServlet ("Validate_Name?email=") + escape(login_name.value);
req.open("GET", url_validate_name, true);
req.send(null);
// req.open("POST", "Validate", true);
// req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
// var params = "id=" + escape(ricerca.value);
// req.send(params);
}
}
// Gestisci la risposta (asincrona) dal server
function gestisciRisposta(responseXML) {
if(responseXML.getElementsByTagName("risposta").length > 0) {
var risposta = responseXML.getElementsByTagName("risposta")[0];
var output = document.getElementById("icon-login-msg");
output.innerHTML = "";
if(risposta.childNodes[0].nodeValue == "valido") {
// L'id esiste
output.setAttribute("style", "color:green");
output.appendChild(document.createTextNode("esiste"));
} else {
// L'id non esiste
output.setAttribute("style", "color:red");
output.appendChild(document.createTextNode("non esiste"));
}
}
}
</script>
</head>
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
<!-- Navigation -->
<nav class="navbar navbar-custom navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
<i class="fa fa-bars"></i>
</button>
<a class="navbar-brand page-scroll" href="#page-top">
<i class="fa fa-play-circle"></i> <span style="color:grey;" class="light">Using WEBRTC </span>
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-right navbar-main-collapse">
<ul class="nav navbar-nav">
<!-- Hidden li included to remove active class from about link when scrolled up past about section -->
<li class="hidden">
<a href="#page-top"></a>
</li>
<li>
<a style="color:white;" href="#" class="page-scroll" role="button" data-toggle="modal" data-target="#login-modal">Sign in/Sign up</a>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<!-- Intro Header -->
<header class="intro">
<div class="intro-body">
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h1 style="color:grey;" class="brand-heading"> SAVA</h1>
<p style="color:grey;" class="intro-text">A free, interactive, modern audio/video application.<br>Created by Antonio Bosco, Pierpaolo Castellano.</p>
<a href="#about" class="btn btn-circle page-scroll">
<i class="fa fa-angle-double-down animated"></i>
</a>
</div>
</div>
</div>
</div>
</header>
<!-- Footer -->
<footer>
<div class="container text-center">
<p>Copyright © Sava 2016</p>
</div>
</footer>
<!-- jQuery -->
<script src="js/jquery.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<!-- Plugin JavaScript -->
<script src="js/jquery.easing.min.js"></script>
<!-- Custom Theme JavaScript -->
<script src="js/grayscale.js"></script>
<!--********************************************* Login and register form *********************************************-->
<!-- BEGIN # MODAL LOGIN -->
<div class="modal fade" id="login-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header" align="center">
<!-- <img class="img-circle" id="img_logo" src="http://bootsnipp.com/img/logo.jpg"> -->
<img class="img-circle" id="img_logo" src="https://secure.royalcaribbean.com/royalgifts/assets/img/icons/login-icon.png">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
</button>
</div>
<!-- Begin # DIV Form -->
<div id="div-forms">
<!-- Begin # Login Form -->
<form id="login-form">
<div class="modal-body">
<div id="div-login-msg">
<div id="icon-login-msg" class="glyphicon glyphicon-chevron-right"></div>
<span id="text-login-msg">Type your username and password.</span>
</div>
<input id="login_username" class="form-control" type="text" placeholder="Email" onkeyup="validaInput()" >
<input id="login_password" class="form-control" type="password" placeholder="Password" required>
</div>
<div class="modal-footer">
<div>
<button type="submit" class="btn btn-primary btn-lg btn-block">Login</button>
</div>
<div>
<button id="login_register_btn" type="button" class="btn btn-link">Register</button>
</div>
</div>
</form>
<!-- End # Login Form -->
<!-- Begin | Lost Password Form -->
<form id="lost-form" style="display:none;">
<div class="modal-body">
<div id="div-lost-msg">
<div id="icon-lost-msg" class="glyphicon glyphicon-chevron-right"></div>
<span id="text-lost-msg">Type your e-mail.</span>
</div>
<input id="lost_email" class="form-control" type="text" placeholder="E-Mail (type ERROR for error effect)" required>
</div>
<div class="modal-footer">
<div>
<button type="submit" class="btn btn-primary btn-lg btn-block">Send</button>
</div>
<div>
<button id="lost_login_btn" type="button" class="btn btn-link">Log In</button>
<button id="lost_register_btn" type="button" class="btn btn-link">Register</button>
</div>
</div>
</form>
<!-- End | Lost Password Form -->
<!-- Begin | Register Form -->
<form id="register-form" style="display:none;">
<div class="modal-body">
<div id="div-register-msg">
<div id="icon-register-msg" class="glyphicon glyphicon-chevron-right"></div>
<span id="text-register-msg">Register an account.</span>
</div>
<input id="register_name" class="form-control" type="text" placeholder="Name" required>
<input id="register_surname" class="form-control" type="text" placeholder="Surname" required>
<input id="register_username" class="form-control" type="text" placeholder="Username" required>
<input id="register_email" class="form-control" type="text" placeholder="E-Mail" required>
<input id="register_password" class="form-control" type="password" placeholder="Password" required>
</div>
<div class="modal-footer">
<div>
<button type="submit" class="btn btn-primary btn-lg btn-block">Register</button>
</div>
<div>
<button id="register_login_btn" type="button" class="btn btn-link">Log In</button>
<button id="register_lost_btn" type="button" class="btn btn-link">Lost Password?</button>
</div>
</div>
</form>
<!-- End | Register Form -->
</div>
<!-- End # DIV Form -->
</div>
</div>
</div>
<!--********************************************* END # MODAL LOGIN *********************************************-->
</body>
</html>
虽然这是js / jquery.cookie.js:
/*!
* jQuery Cookie Plugin v1.4.1
* https://github.com/carhartl/jquery-cookie
*
* Copyright 2013 Klaus Hartl
* Released under the MIT license
*/
(function (factory) {
if (typeof define === 'function' && define.amd) {
// AMD
define(['jquery'], factory);
} else if (typeof exports === 'object') {
// CommonJS
factory(require('jquery'));
} else {
// Browser globals
factory(jQuery);
}
}(function ($) {
var pluses = /\+/g;
function encode(s) {
return config.raw ? s : encodeURIComponent(s);
}
function decode(s) {
return config.raw ? s : decodeURIComponent(s);
}
function stringifyCookieValue(value) {
return encode(config.json ? JSON.stringify(value) : String(value));
}
function parseCookieValue(s) {
if (s.indexOf('"') === 0) {
// This is a quoted cookie as according to RFC2068, unescape...
s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\');
}
try {
// Replace server-side written pluses with spaces.
// If we can't decode the cookie, ignore it, it's unusable.
// If we can't parse the cookie, ignore it, it's unusable.
s = decodeURIComponent(s.replace(pluses, ' '));
return config.json ? JSON.parse(s) : s;
} catch(e) {}
}
function read(s, converter) {
var value = config.raw ? s : parseCookieValue(s);
return $.isFunction(converter) ? converter(value) : value;
}
var config = $.cookie = function (key, value, options) {
// Write
if (value !== undefined && !$.isFunction(value)) {
options = $.extend({}, config.defaults, options);
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setTime(+t + days * 864e+5);
}
return (document.cookie = [
encode(key), '=', stringifyCookieValue(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
// Read
var result = key ? undefined : {};
// To prevent the for loop in the first place assign an empty array
// in case there are no cookies at all. Also prevents odd result when
// calling $.cookie().
var cookies = document.cookie ? document.cookie.split('; ') : [];
for (var i = 0, l = cookies.length; i < l; i++) {
var parts = cookies[i].split('=');
var name = decode(parts.shift());
var cookie = parts.join('=');
if (key && key === name) {
// If second argument (value) is a function it's a converter...
result = read(cookie, value);
break;
}
// Prevent storing a cookie that we couldn't decode.
if (!key && (cookie = read(cookie)) !== undefined) {
result[name] = cookie;
}
}
return result;
};
config.defaults = {};
$.removeCookie = function (key, options) {
if ($.cookie(key) === undefined) {
return false;
}
// Must not alter options, thus extending a fresh object...
$.cookie(key, '', $.extend({}, options, { expires: -1 }));
return !$.cookie(key);
};
}));
这是js / manageSessionAndCookie.js:
var BASE_URL = 'http://localhost:8080/AtApplicazione/template/';
var BASE_URL_SERLVET = 'http://localhost:8080/AtApplicazione/';
var BASE_NODEJS = 'http://localhost:8181/videoPage.html?room_name=';
/*var BASE_URL = 'http://192.168.43.159:8080/AtApplicazione/template/';
var BASE_URL_SERLVET = 'http://192.168.43.159:8080/AtApplicazione/';
var BASE_NODEJS = 'http://192.168.43.159:8181/videoPage.html?room_name=';*/
function getUrl(url) {
return BASE_URL.concat(url);
}
function getUrlVideoChat(url) {
return BASE_NODEJS.concat(url);
}
function getUrlServlet(url) {
return BASE_URL_SERLVET.concat(url);
}
/*redirect to login if cookie is not defined*/
$(document).ready(
function checkLoggedRedirectToLogin() {
var name = $.cookie('name');
console.log ("name:" + name);
if(name == undefined) {
window.location.replace(getUrl("index1.html"));
}
});
function getEmail (){
return $.cookie('email');
}
function getSurname (){
return $.cookie('surname');
}
为什么会出现此错误?为什么在Windows上没有这个错误(在Windows上我用apache和mysql运行xampp)?
我必须告诉我在Ubuntu中,我不是mysql容器,而是这个托管我的war文件的tomcat。