美文网首页my ionic3我爱编程
ionic3 + angular5跨域问题的解决方案

ionic3 + angular5跨域问题的解决方案

作者: 竹子_331a | 来源:发表于2018-04-19 11:14 被阅读32次

    最近在玩ionic3 ,底层angular版本是5.2,如下

    "dependencies": {

    "@angular/animations":"5.2.9",

    "@angular/common":"5.2.9",

    "@angular/compiler":"5.2.9",

    "@angular/compiler-cli":"5.2.9",

    "@angular/core":"5.2.9",

    "@angular/forms":"5.2.9",

    "@angular/http":"5.2.9",

    "@angular/platform-browser":"5.2.9",

    "@angular/platform-browser-dynamic":"5.2.9",

    "@ionic-native/core":"4.6.0",

    "@ionic-native/splash-screen":"4.6.0",

    "@ionic-native/status-bar":"4.6.0",

    "@ionic/storage":"2.1.3",

    "ionic-angular":"3.9.2",

    "ionicons":"3.0.0",

    "rxjs":"5.5.8",

    "sw-toolbox":"3.6.0",

    "zone.js":"0.8.20"

    }

    本地有个springmvc项目,访问地址http://localhost:8088/xxx 

    ionc的地址:http://localhost:8100/

    很明显已经跨域了,如果只是简单的处理跨域问题,还是比较好处理的,但是涉及到cookie的跨域,那叫一个头痛,昨天搞了整整一天,翻遍国内外各大论坛,也没有一个真正的解决办法,最后只能自己研究了。

    下面分享我的研究成果:

    1、修改ionic访问的http请求的参数

    that.http.get(url, {

    withCredentials:true, //重点1,必须设置withCredentials:true

    headers: {

    'content-type':'application/x-www-form-urlencoded',//重点2:content-type为这个

    },

    params:params

    })

    2、安装谷歌插件Moesif CORS (安装地址 或者百度搜索Moesif Origin & CORS Changer)

    3、设置Moesif CORS,选择trun on ,然后打开show detailed options

    4、在打开的页面,拉到最下面,将Access-Control-Allow-Credentials: 设置为true,保存

    5、好了,现在试试看吧,打印下session ,你会发现,两边已经同步了

    相关文章

      网友评论

        本文标题:ionic3 + angular5跨域问题的解决方案

        本文链接:https://www.haomeiwen.com/subject/ioaikftx.html