title: Angular 5 client for Java RESTful Web Service application (in Netbeans IDE)
body: <p>There must be thousands of pre-existing Java apps that would benefit from interacting with a web based GUIs / web apps. Thus, Java as a back end must make lots of sense to many for these Java (server end) programs.</p>
  
  <p>Netbeans offers a greatly automated approach for generating both, servlet and client skeleton code base. </p>
  
  <p>You can consume the servlet data with again an auto-generated example - see steps below. </p>
  
  <p>BUT,</p>
  
  <p>After substantial research it appears that Angular would be the best fitting design strategy for my front end web apps. So, I am starting with Angular and am getting the grasp of its core functionality (I know, still a way to go).</p>
  
  <p>I would like to use an Angular 5 client/web app solution for communicating with the Java RESTfull servlet - without additional frameworks (Spring, Hibernate, etc...) . I have tried several approaches I found, but each just adds to more confusion. </p>
  
  <p><strong><em>Would you please post a simple solution that would allow for CRUD interaction of an Angular 5 based client/web app with the given Java RESTfull servlet? I am sure many would benefit from this sample. Thank you.</em></strong></p>
  
  <hr>
  
  <p>Here is a sample of the servlet and non-Angular client, both of which work nicely without writing a single line of Java or JS code.</p>
  
  <p><strong>RESTful Servlet in NetBeans 8.2</strong></p>
  
  <p>Servlet example: <a href="http://www.oracle.com/webfolder/technetwork/tutorials/obe/java/RESTfulWebServices/RESTfulWebservices.htm" rel="nofollow noreferrer">here</a>
  and similar: <a href="https://netbeans.org/kb/docs/websvc/rest.html" rel="nofollow noreferrer">here</a></p>
  
  <h2><strong>RESTful JavaScript Client in NetBeans 8.2</strong></h2>
  
  <ol>
  <li><p>To Generate RESTful Web JavaScript client:, complete the following steps.
  a. Select: PlayerServer project - right click.
  b. Select: New - Other
  c. Select: HTML5/JavaScript
  d. Select: RESTful JavaScript Client
  e. Fill in the fields of the wizard</p>
  
  <ul>
  <li>provide coresponding file names for your js and html files.
  f. If you want an HTML table to be generated for the data table from the db,
  select: Choose resulting UI: and in it: Tablesorter UI
  (You may need to add this line to the genrated XXX.html file:
  )</li>
  </ul></li>
  <li><p>Test by selecting the generated html file in the project,
  right click and select: Run file.</p></li>
  </ol>
  
  <hr>
  
  <p>I tried using Angular with this code in: app.component.ts,
  but it does generate an error.</p>
  
  <p>"Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at <a href="http://localhost:8080/PlayerServer/webresources/com.playerentity.player" rel="nofollow noreferrer">http://localhost:8080/PlayerServer/webresources/com.playerentity.player</a>. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing)."</p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { HttpClient } from '@angular/common/http';
  
  @Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.scss']
  })
  
  export class AppComponent implements OnInit {
    title = 'app';
    results = '';
    constructor(private http: HttpClient){
    }
    ngOnInit(): void {
      this.http.get('http://localhost:8080/PlayerServer/webresources/com.playerentity.player').subscribe(data =&gt; {
        console.log(data);
      });
    }
  }
  </code></pre>