Как сделать запрос POST внешним API с помощью Angular2?

Question

Я пытаюсь использовать CORS для отправки запроса на отправку. Я наткнулся на несколько статей/ответов, связанных с CORS, но так или иначе просто не мог заставить его работать.

Как я понимаю, access-control-allow-origin: * должен быть установлен на стороне сервера, чтобы получить эту работу, но то, что у меня есть, является проектом с угловым кли.

Мой проект полностью основан на угловом 2.1, и не задействован сервер backend. Любые предложения относительно того, как правильно настроить, будут высоко оценены.

Точная ошибка, я получаю это:

"NetworkError: 404 Not Found - https://flowxo.com/hooks/a/rbpja7r2/?usertype=User" 

и это предупреждение в консоли:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the 
remote resource at https://flowxo.com/hooks/a/rbpja7r2/?usertype=User. 
(Reason: CORS header 'Access-Control-Allow-Origin' missing). 

Update:

Вот как я пытаюсь сделать POST-запрос:

let headers = new Headers(); 
headers.append('Access-Control-Allow-Headers', 'Content-Type'); 
headers.append('Content-Type', 'application/json'); 
headers.append('Access-Control-Allow-Methods', 'POST, OPTIONS'); 
headers.append('Access-Control-Allow-Origin', '*'); 
return this.http.post(
    this.flowxoUrl, 
    JSON.stringify(formData), 
    {headers: headers} 
) 
    .map((res:Response) => res.json()) 
    .catch((error:any) => Observable.throw(error.json().error || 'Server error')); //...errors if any 

Answer 1

Это проблема на стороне сервера, а не угловая.

Ваш сервер должен отвечать заголовком Access-Control-Allow-Origin.

Java (Spring) пример:

@Component 
@Order(Ordered.HIGHEST_PRECEDENCE) 
public class SimpleCorsFilter implements Filter { 
    @Override 
    public void init(FilterConfig filterConfig) throws ServletException {} 

    @Override 
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException { 
     HttpServletResponse response = (HttpServletResponse) servletResponse; 
     HttpServletRequest request = (HttpServletRequest) servletRequest; 
     response.setHeader("Access-Control-Allow-Origin", "*"); //you can specify domains here * - is a wildcard, it will allow all origins to request 
     response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE, PUT"); 
     response.setHeader("Access-Control-Max-Age", "3600"); 
     response.setHeader("Access-Control-Allow-Headers", "x-requested-with, authorization, content-type"); 

     if("OPTIONS".equalsIgnoreCase(request.getMethod())) { 
      response.setStatus(HttpServletResponse.SC_OK); 
     } else { 
      filterChain.doFilter(servletRequest, servletResponse); 
     } 
    } 

    @Override 
    public void destroy() {} 
}