Question

我有一个应用程序A，从中创建了jQuery Ajax请求，以在应用程序A的弹出窗口中打开应用程序B。 App B在Angular 7中构建，请求转到了App B，但面临以下问题

CORS策略已阻止从来源“ http://localhost:4200/Primary”访问“ http://localhost:9090”处的XMLHttpRequest：Access-Control-Allow-不允许请求标头字段access-control-allow-origin飞行前响应中出现标题。

我已经在Angular 7应用程序中配置了proxyconfig，添加了proxy.conf.json，但是我认为这是不正确的方法，因为它用于Angular 7 UI到节点服务。

jQuery.ajax({
  url: "http://localhost:4200/Primary", //pp.vars.web + "/" + "modelbinitializerequest",
  type: "GET",
  beforeSend: function(xhr) {
    xhr.setRequestHeader('Access-Control-Allow-Headers', 'authorization,content-type,access-control-allow-origin,X-Requested-With,content-type');
    xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
    xhr.setRequestHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
    xhr.setRequestHeader('Access-Control-Allow-Credentials', true);
  },
  success: function(data) {
    console.log(data);
    var overlay = document.createElement("div"),
      mask = document.createElement("div"),
      overlayStyle = "overlayStyleCSS close_buttonCSS";
    maskStyle = "position:absolute;width:100%;height:320%;top:0;left:0;z-index:4000;background-color:#030303;opacity:0.3;filter:alpha(opacity=30);display:inline-block; *display:inline; *zoom:1;";
    overlay.setAttribute("class", overlayStyle);
    overlay.style.cssText = overlayStyle;
    overlay.id = "pluginLoadingOverlay";
    mask.setAttribute("style", maskStyle);
    mask.style.cssText = maskStyle;
    mask.id = "pluginLoadingOverlayMask";
    overlay.innerHTML = data;
    document.body.appendChild(mask);
    document.body.appendChild(overlay);
  }
});

我认为如果CORS问题解决了，那么我可以在弹出窗口中打开App B angular 7应用。

Angular 7 App B，即'http://localhost:4200/Primary'托管在NPM上，http://localhost:9090托管在码头服务器上。

我确实尝试了在Tomcat服务器上部署Angular 7 App B，并在conf文件夹中的web.xml中配置了标头，如下所示，但仍然无法解决问题。

conf / web.xml

<filter>
  <filter-name>CorsFilter</filter-name>
  <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
  <init-param>
    <param-name>cors.allowed.origins</param-name>
    <param-value>*</param-value>
  </init-param>
  <init-param>
    <param-name>cors.allowed.methods</param-name>
    <param-value>GET,POST,PUT,DELETE,HEAD,OPTIONS</param-value>
  </init-param>
  <init-param>
    <param-name>cors.allowed.headers</param-name>
    <param-value>Content-Type,X-Requested-With,Accept,Authorization,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
  </init-param>
  <init-param>
    <param-name>cors.exposed.headers</param-name>
    <param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
  </init-param>
</filter>
<filter-mapping>
  <filter-name>CorsFilter</filter-name>
  <url-pattern>/*</url-pattern>
</filter-mapping>

使用来自其他应用程序的Ajax调用来调用Angular7应用程序时出现CORS问题

conf / web.xml

0 个答案: