vueでaxiosがJavaバックエンドにアクセスするドメイン間問題の解決

3640 ワード

問題の背景:
フロントエンドはVue、バックエンドはJava、vueでコンパイルされた静的ページはngixで公開され、フロントエンドがバックエンドにアクセスする際にドメイン間の問題が発生します.
解決方法:
ドメイン間の問題解決方法はいくつかありますが、ここではサービス側によって解決され、以下はコード実装です.
 1 public class AllowOriginFilter implements Filter {
 2 
 3     @SuppressWarnings("unused")
 4     public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
 5 
 6         HttpServletResponse response = (HttpServletResponse) res;
 7         HttpServletRequest request=(HttpServletRequest)req;
 8         response.setHeader("Access-Control-Allow-Origin", "*"); //            
 9         response.setHeader("Access-Control-Allow-Methods", "POST,GET,PUT,OPTIONS,DELETE");
10         response.setHeader("Access-Control-Max-Age", "3600");
11         response.setHeader("Access-Control-Allow-Headers", "Origin,X-Requested-With,Content-Type,Accept,Authorization,token");
12         response.setHeader("Access-Control-Allow-Credentials", "true");
13         chain.doFilter(req,res);
14     }
15 
16     public void init(FilterConfig filterConfig) {}
17 
18     public void destroy() {}
19 
20 
21 }

ドメイン間で問題が発生した場合:
 
URLアドレス
説明説明
通信を許可するかどうか
http://www.a.com/a.js http://www.a.com/b.js
同じドメイン名
許可する
http://www.a.com/a/a.js http://www.a.com/b/b.js
同じドメイン名、異なるフォルダ
許可する
http://www.a.com/a.js http://www.a.com:8080/b.js
同じドメイン名、異なるポート
許可しない
http://www.a.com/a.js https://www.a.com/b.js
同じドメイン名、異なるプロトコル;一つはhttpでもう一つはhttpです
許可しない
http://www.a.com/a.js https://www.10.0.1.100.com/b.js
1つのドメイン名、1つのドメイン名に対応するIP
許可しない
http://www.a.com/a.js https://www.sub.a.com/b.js
同じプライマリドメイン名、2次ドメイン名が異なる
許可しない
http://www.a.com/a.js http://www.b.com/b.js
2つの異なるドメイン名
許可しない
 
 
 
転載先:https://www.cnblogs.com/soinve/p/9295009.html