跨域解决方案

愿对有缘人能有所帮助--<-<-<@

没思路时百度谷歌，有思路时尽量文档。毕竟文档才全面才标准

文章git地址：https://github.com/ShareCookies/front-end/blob/master/%E8%B7%A8%E5%9F%9F/%E8%B7%A8%E5%9F%9F.txt

 

跨域：
    同源策略（Sameoriginpolicy）浏览器最基本的安全功能。
    同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。
    注：
        1.如何算同源:具有相同的协议（protocol），主机（host）和端口号（port）
        2.非同源的请求后端是能接收到了请求并返回响应，但浏览器对会因为同源策略，而对非同源请求返回的结果进行拦截。
解决方案：
    1，2：
        https://blog.youkuaiyun.com/qq_38128179/article/details/84956552
    jsonnp：
        https://blog.youkuaiyun.com/hansexploration/article/details/80314948
    CORS：
        http://www.ruanyifeng.com/blog/2016/04/cors.html
        CORS是一个W3C标准，全称是"跨域资源共享"（Cross-origin resource sharing）。
        它允许浏览器向跨源服务器，发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制。
        解决方案：
            https://blog.youkuaiyun.com/dadiyang/article/details/80289956
            服务器拦截请求，并设置些响应头即可实现跨域资源请求。
            注：
                1.该方案前端无需任何修改，只要后端设置一下即可。
            附：
                1.如果同时设置了下面两个响应头，则Origin的值要为请求源，否则前端console会（但是不影响请求和cookie存储..）报异常。
                    response.setHeader('Access-Control-Allow-Credentials',true);
                    response.setHeader('Access-Control-Allow-Origin','http://localhost:63342');
                    https://blog.youkuaiyun.com/cowshield/article/details/80841034
        例:
            ./CorsFilter.java
            附：
                Spring MVC 注解实现 CORS 跨域：
                    https://www.jianshu.com/p/13d53acc124f
        附：
            跨域设置cookie：
                https://blog.youkuaiyun.com/cowshield/article/details/80841034
                1.（目的为表明后端允许接收跨域的cookie等身份认证，所以浏览器你就不要阻止跨域请求带上cookie的行为了）
                    response.setHeader('Access-Control-Allow-Credentials',true);
                    response.setHeader('Access-Control-Allow-Origin','http://localhost:63342');
                    response.setHeader('Set-Cookie','token=cowshield');
                    注：
                        此时cookie属于的是服务器域名的，而不是请求端域名的。
                        解决方案：
                            I.
                                域名为：a.abc.com b.abc.com
                                那么cookie.setDomain("abc.com");即可。
                            II.
                                域名为：a.com b.com
                                该情况应该是没法携带cookie，把值放header或请求参数中吧。
                2.（目的为，为跨域的请求带上本域的cookie）
                    前端跨域请求设置withCredentials：
                        axios：
                            axios.defaults.withCredentials =true;
                        注：
                            *1.通过设置withCredentials 为true获得的第三方cookies，将会依旧享受同源策略，
                            即只有用服务器域名设置的Cookie才会上传，其他域名的Cookie并不会上传。
                            http://www.ruanyifeng.com/blog/2016/04/cors.html
                            https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest/withCredentials
                            
                附：
                    前端请求的request headre 显示为：Provisional headers are shown（临时头部显示），
                    而且你在前端可能会一直看不到携带的cookie，
                    那么此时你应该去后端看下是否接收到cookie。
                        
    Nginx代理：
        hcg：
            访问代理，然后由代理再去请求数据