webpack-dev-server 解决跨域问题

发布于 2022-09-11 15:18:11 字数 1638 浏览 15 评论 0

前后端分离开发,用ajax访问后台接口。
第一次解决这个跨域问题,不知道错在那里了。。。
实在是无能为力了。。。。。

js代码

url:'/v1/user/login',
data:"username=" + loginUserName + "&password="+loginUserPassword,
type:'get',
dataType:'json',
success:function(data){
    location.href = "../index/index.html";
},
failure:function(){
    alert("登陆失败!");
}

webpack.config.js 配置是这样写的

    devServer: {
        historyApiFallback: true,
        hot: true,
        inline: true,
        progress: true,
        proxy: {
            '/v1/*': {
                target: 'http://192.xxx.xxx.xxx:8080',//后台接口地址
                changeOrigin: true,
                secure: false,
            }
        }
    },

代码显示:

clipboard.png

用jsonp跨域

js代码


    $.ajax({
                url:'http://192.xxx.xxx.xxx:8080/v1/user/login',
                data:"username=" + this.loginUserName + "&password="+ this.loginUserPassword,
                type:'get',
                dataType:'jsonp',
                jsonpCallback : 'loginCallback',
                success:function(data){
                    location.href = "../index/index.html";
                },
                failure:function(){
                    alert("登陆失败!");
                    console.log("error!");
                }
            });

成功

clipboard.png

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

彼岸花ソ最美的依靠 2022-09-18 15:18:11

Request Method 改为 POST,后台接口采用 REST 风格,会指定请求类型。
ajax 请求的配置修改:

type:'post',
寄居者 2022-09-18 15:18:11

先确认下要请求的接口, 如果是http://192.xxx.xxx.xxx:8080/v1/user/login
这么写

proxy: {
            '/v1/*': {
                target: 'http://192.xxx.xxx.xxx:8080',//后台接口地址
                changeOrigin: true,
                secure: false,
                pathRewrite: {  
                '^/v1': '/v1'
                }
             }
        }
请你别敷衍 2022-09-18 15:18:11

老铁把

url:'/v1/user/login',
data:"username=" + loginUserName + "&password="+loginUserPassword,
type:'get',
dataType:'json',
success:function(data){
    location.href = "../index/index.html";
},
failure:function(){
    alert("登陆失败!");
}

改为

url:'/user/login',
data:"username=" + loginUserName + "&password="+loginUserPassword,
type:'get',
dataType:'json',
success:function(data){
    location.href = "../index/index.html";
},
failure:function(){
    alert("登陆失败!");
}

试试 ;

哭泣的笑容 2022-09-18 15:18:11
            
        proxy: {
            '/v1/*': {
                target: 'http://192.xxx.xxx.xxx:8080',//后台接口地址
                changeOrigin: true,
                secure: false,
                pathRewrite: {  
                '^/v1': ''
                }
             }
        }
        改成这样其他不动

参考之前我的文章https://segmentfault.com/a/11...

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文