I have a Spring boot application. I have 406 Not Acceptable on angular.min.js file if this file is in subdirectory (angular).
200 OK:
<script type="text/javascript" src="../js/angular.min.js"></script>
/src/main/webapp/js/angular.min.js
but 406 Not Acceptable:
<script type="text/javascript" src="../js/angular/angular.min.js"></script>
/src/main/webapp/js/angular/angular.min.js
I solve my problem.
I added a REST service with a path that matches was my angularjs src way. :(
#RequestMapping(value = "/{code}/{width}/{height}", method = RequestMethod.GET, produces = MediaType.IMAGE_PNG_VALUE)
SOLUTION: value = "/api/{code}/{width}/{height}"
Related
I am using express and node.js in backend and ejs templating engine in front-end. My app.js look like this
app.get('/book/:id', (req, res)=>{
var book_id = req.params.id;
console.log('this book :', book_id);
Book.findOne({
book_id
}).then((book)=>{
res.render('book.ejs', {book, title: "Book"});
}).catch((e)=>{
// console.log(e);
});
});
book.ejs file
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="books.js"></script>
</head>
<body style="font-family: arial">
<h1><%= title %></h1>
</body>
</html>
But when i route page to book/1234, I got following log in my server
this book : 1234
this book : jquery-3.3.1.min.js
this book : book.js
Why jquery-3.3.1.min.js and book.js are send to book/:id route? I am only sending book/1234 but jquery-3.3.1.min.js and book.js are also sent to server and causing error.
Browser console log is this
GET http://localhost:3000/book/jquery-3.3.1.min.js net::ERR_ABORTED 500 (Internal Server Error)
1234:1 Refused to execute script from 'http://localhost:3000/book/jquery-3.3.1.min.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.
1234:6 GET http://localhost:3000/book/books.js net::ERR_ABORTED 500 (Internal Server Error)
1234:1 Refused to execute script from 'http://localhost:3000/book/books.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.
Since script links have relative paths, they are loaded from current path, which is /book.
They should either have absolute paths:
<script type="text/javascript" src="/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="/books.js"></script>
Or base URL should be specified:
<base href="/">
You are using relative path in src attribute. Since you are serving the page from /books/<id>, if you use a relative path, browser will understand it as /books/(relative_path_of_resource) and so when it comes across those links it is sending a request to books/jquery.js and books/books.js
You should convert your link to point to the correct static path of the js files. Refer this link - https://expressjs.com/en/starter/static-files.html to see how to serve static files and once you set up the serving, you can change the links to /static/books.js and /static/jquery.js
I think that your book.ejs file is under the route of '/book'. if that so, you script tag like <script type="text/javascript" src="books.js"></script> will access the route of /book/book.js ,not your assets.
so you should set you src attribute like this /book.js and make sure you had made your assets accessible.
I've been playing with nodejs, using websockets to communicate between server and browser.
This is my working client code:
<script src="https://cdn.socket.io/socket.io-1.3.7.js"></script>
<script>
var socket = io();
socket.on('ida',function(data){
console.log(data.news);
socket.emit('vuelta',{news: 'answer'});
});
</script>
Then why if I put
var socket = io();
socket.on('ida',function(data){
console.log(data.news);
socket.emit('vuelta',{news: 'answer'});
});
in a separated client.js file and link it like
<script src="https://cdn.socket.io/socket.io-1.3.7.js"></script>
<script src="client.js" type="text/javascript"></script>
it just doesn't work?
In the browser's console, instead of showing data.news it says: Uncaught SyntaxError: Unexpected token < in client.js:1
It might be that you are not serving the file at all. Be careful to include it in the http server configuration, on your node server file.
I am trying to build simple routing app in angularjs. I have main index.html page with ng-view div and javascript code for routing. Also 2 simple html pages view2.html and view3.html placed in sub folder partials1.
I am getting below error. Please help.
Error: Access is denied.
Error: [$compile:tpload] Failed to load template: partials1/view3.html
http://errors.angularjs.org/1.3.15/$compile/tpload?p0=partials1%2Fview3.html
index.html:
<div data-ng-view></div>
<script src="angular.js"></script>
<script src="angular-route.js"></script>
<script type="text/javascript">
var demoApp = angular.module('demoApp', [ 'ngRoute' ]);
demoApp.controller('SimpleController', function($scope) {
$scope.customers = [ {
name : 'Jon Smith1',
city : 'Charlotte'
}, {
name : 'John Doe',
city : 'New York'
}, {
name : 'Jane Doe',
city : 'Jacksonville'
} ];
});
demoApp.config([ '$routeProvider', function($routeProvider) {
$routeProvider.when('/view1', {
templateUrl : 'partials1/view3.html',
controller : 'SimpleController'
}).when('/view2', {
templateUrl : 'partials1/view2.html',
controller : 'SimpleController'
}).otherwise({
redirectTo : '/view1'
});
} ]);
</script>
view2.html
<div class="container">33333333333333</div>
view3.html
<div class="container">33333333333333</div>
Error: Access is denied tells you that the template is not accessible. Try to open the template in your browser. Something like this: http://my_project/partials1/view3.html. To see the full URL which is used by your app, use a dubug console (XHR tab).
Error: [$compile:tpload] Failed to load template: xyz.html (HTTP status: 404 Not Found)
can be caused by below setting in web.config
<system.webServer>
<handlers>
<remove name="BlockViewHandler"/>
<add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" />
This causes to block any direct request to the file in Views directory. Angular xhr request to this file is blocked by this.
Comment it out and see if things work. Use this with caution as it allows access to your files.
You can also check on this url for more responses: Error: $compile:tpload failed to load template Http status : 404
In my case, the issue is that I added Default Headers such as Accept = 'application/json'. So my routes suddenly stopped working, because those headers were not only applied to my $http.post calls, they were also applied to my Routing... ? Weird.
I had the same error, in my case the web server was written with node js and the uri to get views that were in the specified path with $stateProvider was not created, since for each view/template that is wanted to display an http request of type Xhr GET is made.
As the uri did not exist I obtained a 404 code and this made the browser got into callback that killed him. Make sure your server is returning the requested view. (Translated with google translate)
I am using webapp2 to build a webapp with angularjs. This is the directory structure.
|--test-app
|--lib
|--static
|--js
|--app.js
|--controller.js
|--lib
|--angular
|--angualr-bootstrap
|--index.html
|--app.yaml
|--mainapp.py
But when I try to load the js files in index.html
<!DOCTYPE html>
<html lang="en" ng-app="testApp">
<head>
<script src="/static/js/app.js"></script>
<script type="text/javascript" src="/static/js/controller.js"></script>
</head>
<body>
<div ng-controller="MainController">
IN MAIN
</div>
</body>
</html>
I get these errors:
GET http://localhost:8080/static/js/app.js (404 - file not found)
GET http://localhost:8080/static/js/controller.js (404 - file not found)
I cannot figure out why I am getting these errors.
Here is code for app.yaml
application: test-app
version: 1
runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: /.*
script: mainapp.app
libraries:
- name: webapp2
version: "2.5.2"
Here is code for mainapp.py
class Start(webapp2.RequestHandler):
def get(self):
self.response.headers['Content-Type'] = 'text/html'
self.response.write(open('static/index.html').read())
app = webapp2.WSGIApplication([
('/', Start),
], debug=True)
You must explicitly declare the location of your static content in app.yaml:
handlers:
- url: /static
static_dir: static
handlers:
- url: /.*
script: mainapp.app
See docs for details:
Unlike a traditional web hosting environment, Google App Engine does not serve files directly out of your application’s source directory unless configured to do so.
URL handler path patterns are tested in the order they appear in app.yaml, from top to bottom. In this case, the /static pattern will match before the /.* pattern will for the appropriate paths.
I moved the index.html out of the static folder and then declared explicitly the static url, as said by #Selcuk. And it works nows.
I'm trying to use Brython to run Python code in the browser, and to use websockets in that Python code.
I have working JavaScript code that can connect to the Websocket echo server at http://www.websocket.org/echo.html.
According to the documentation, the function JSObject can be used to manipulate JavaScript objects in Brython, but I can't get it to work using either ws = JSObject(WebSocket("ws://echo.websocket.org/")) or ws = JSObject(new WebSocket("ws://echo.websocket.org/")).
How can I make a simple "Hello World" example connecting to the echo server, in Python code, using Brython?
See also How to import library using Brython for using libraries that aren't built in to Brython (including the usual Python standard library).
Here is an example using the built-in websocket() function, included in py_websocket, and the server echo.websocket.org :
<html>
<head>
<meta charset="iso-8859-1">
<script src="/src/brython.js"></script>
<script type="text/python3">
def on_open():
# Web Socket is connected, send data using send()
data = doc["data"].value
if data:
ws.send(data)
alert("Message is sent")
def on_message(evt):
# message received from server
alert("Message received : %s" %evt.data)
def on_close(evt):
# websocket is closed
alert("Connection is closed")
ws = None
def _test():
global ws
# open a web socket
ws = websocket("wss://echo.websocket.org")
# attach functions to web sockets events
ws.on_open = on_open
ws.on_message = on_message
ws.on_close= on_close
def close_connection():
ws.close()
</script>
</head>
<body onload="brython(1)">
<input id="data">
<button onclick="_test()">Run WebSocket</button>
<p><button onclick="close_connection()">Close connection</button>
</body>
</html>
The code should be self-explanatory. The Brython site needs to be completed with more documentation about web sockets