title: Cross Origin Issue in Spring Boot and Angular Application
body: <p>Well i have to integrate Spring with Angular , wrt to implement this im getting Cros Policy issue and for this regard i have already added @CrossOrigin annotation in the Rest controller.
  Below is my code</p>
  <p><strong>my Rest Controller</strong></p>
  <pre><code>@RestController
  @CrossOrigin(origins = {&quot;http://localhost:9001&quot;, &quot;http://localhost:4200&quot;},allowedHeaders = &quot;*&quot;)
  public class PatientVisitRestController {
      
      @Autowired
      PatientVisitService patientVisitService;
      
      
      @PostMapping(&quot;/patient/add&quot;)
      public String savePatientVisit(@RequestBody PatientVisit patientVisit)
      {
          
          patientVisitService.addPatientVisit(patientVisit);
          
          return &quot;Saved := &quot;+patientVisit.getPatientName()+&quot; - &quot;+patientVisit.getSlipNumber();
          
      }
  
      @GetMapping(&quot;/patient/phone/{ph}&quot;)
      public List&lt;PatientVisit&gt; getPatientbyPhone(@PathVariable long ph)
      {
          List&lt;PatientVisit&gt; list =  patientVisitService.getPatientVisitByPhoneNumber(ph);
          return list;
      }
      
      
      
  }  //end controller
  
  
  @SpringBootApplication
  public class OpdPatientConsoleApplication {
  
      public static void main(String[] args) {
          SpringApplication.run(OpdPatientConsoleApplication.class, args);
      }
  
  }
  </code></pre>
  <p><strong>and Below is my Angular Service</strong></p>
  <pre><code>import { PatientDetails } from './patient-details';
  import { Injectable } from '@angular/core';
  import { HttpClient } from '@angular/common/http';
  import { Observable } from 'rxjs';
  
  @Injectable({
    providedIn: 'root'
  })
  export class PatientService {
  
    contextPath:string= 'http://localhost:9001';
    // tomcatServerContentRoot = 'http://localhost:8081';
    endPoint_getPatientsByPhone:string =  this.contextPath+'/patient/phone/';
    
   
    http:HttpClient;
       
    constructor(http:HttpClient) {
      this.http = http;
    }
  
    getPatientsByPhone(phone:number):Observable&lt;PatientDetails[]&gt;
    {
      let endPoint_getPatientsByPhone = this.contextPath+'/patient/phone/'+phone;
      console.log(&quot;---&gt;&gt; Patient Service : searchPatientsByPhone endpoint :- &quot;+endPoint_getPatientsByPhone);
      return this.http.get&lt;PatientDetails[]&gt;(`${this.endPoint_getPatientsByPhone}`);
    }
  
  
  }
  </code></pre>
  <p><em><strong>And below is the error screen pic</strong></em></p>
  <p><a href="https://i.stack.imgur.com/UJHhE.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/UJHhE.png" alt="enter image description here" /></a></p>
  <p>Thanks in advance</p>