Error in console:
Error with getting users from service. Response with status: 404 Not Found for URL: http://localhost:8080/ChatApp/GetAllUsersServlet
Same problem occurs when I deployed the external project somewhere, so with url: http://java.cyclone2.khleuven.be:38034/ChatApp/GetAllUsersServlet You can see for yourself is a working url with json in it, but stil 404 error.
Angular code expecting json from servlet running on local server:
export class UserService {
// private usersUrl = 'api/users'; // mock api
private usersUrl = 'http://localhost:8080/ChatApp/GetAllUsersServlet'; // external users from local server
private headers = new Headers({'Content-Type': 'application/json'});
constructor(private http: Http) { }
getUsers(): Promise<User[]> {
return this.http.get(this.usersUrl)
.toPromise() // Http.get returns RxJS Observeable, converted to Promise here
.then(response => response.json().data as User[]) // .data for mock inMemoryDataService
.catch(this.handleError);
}
What Servlet returns:
[{"fname":"TestFname","password":"test","gender":"Female","name":"TestName","id":1,"email":"[email protected]","age":21,"username":"Test","status":"offline"},{"fname":"Test4Fname","password":"test","gender":"Female","name":"Test4Name","id":4,"email":"[email protected]","age":21,"username":"Test4","status":"offline"},{"fname":"Test3Fname","password":"test","gender":"Female","name":"Test3Name","id":3,"email":"[email protected]","age":28,"username":"Test3","status":"offline"},{"fname":"Test2Fname","password":"test","gender":"Male","name":"Test2Name","id":2,"email":"[email protected]","age":22,"username":"Test2","status":"offline"}]
This exact thing in a mock api, does give correct result:
import { InMemoryDbService } from 'angular-in-memory-web-api';
export class InMemoryDataService implements InMemoryDbService {
createDb() {
let users = [{"fname":"TestFname","password":"test","gender":"Female",
"name":"TestName","id":1,"email":"[email protected]","age":21,"username":"Test","status":"offline"},
{"fname":"Test4Fname","password":"test","gender":"Female",
"name":"Test4Name","id":4,"email":"[email protected]","age":21,"username":"Test4","status":"offline"},{"fname":"Test3Fname","password":"test","gender":"Female","name":"Test3Name","id":3,"email":"[email protected]","age":28,"username":"Test3","status":"offline"},
{"fname":"Test2Fname","password":"test","gender":"Male",
"name":"Test2Name","id":2,"email":"[email protected]","age":22,"username":"Test2","status":"offline"}]
return {users};
}
}
Any help would be appreciated, since I really don't know why it won't work. Tried something similar but just less json data and that works. Yes, the server for the servlet is running locally.
getUsers() gets used and displayed by this, but since it works with mock data, this should be okay?:
export class UsersComponent {
users: User[];
selectedUser: User;
constructor(
private userService: UserService,
private router: Router) { }
gotoInfo(): void {
this.router.navigate(['/info', this.selectedUser.username]);
}
onSelect(user: User): void {
this.selectedUser = user;
}
getUsers(): void {
this.userService.getUsers().then(users => this.users = users);
}
ngOnInit(): void {
this.getUsers();
}
}
Servlet (cors enabled):
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { UserDB db = new UserDB();
JSONArray array = new JSONArray();
for (User users: db.getAll()) {
try {
array.put(users.getJSONObject());
} catch (JSONException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
// setting the response type to json
response.setContentType("application/json");
// setting the CORS request
response.setHeader("Access-Control-Allow-Origin", "*");
response.getWriter().write(array.toString());
