Webpack处理跨域问题

项目预计所有功能都实现啦,GitHub地址如果有什么功能问题,提出来哈。

建议先注册,如果觉得注册麻烦就直接登录哈,登录名:微笑(hhh,我也不知道为啥会注册成这样的)密码:123456

接下来几篇可能就是就项目中遇到的问题,统一记录一下。


webpack中处理跨域问题

  1. webpack代理应用的一个插件:webpack-dev-server,内置了http-procy-middleware可以解决请求url代理的问题。

原理:应用重定向的方式解决跨域问题,即就是,当后端的接口拥有独立的API,而前端想在同一个domain下访问接口的时候,可以通过设置proxy实现。

2.webpack.config.js中配置的文件:
比较好玩

3.使用
注:使用的url 必须以/开始 否则不会代理到指定地址。

 fetch('/user/login').then(res => {
        // 被代理到 http://test.xxx.com/user/login
        return res.json();
    }).then(res => {
        console.log(res);
    })

    fetch('user/login').then(res => {
        // http://localhost:8088/user/login 访问本地服务
        return res.json();
    }).then(res => {
        console.log(res);
    })

遇到的问题:

webpack-dev-server的默认服务器端口是8080,如果设定端口8088或者别的,但是出现错误,那就是没有找到webpack.config.js文件,或者webpack.config,js文件有错。

报错信息:

 ERROR in multi (webpack)-dev-server/client?http://localhost:8080 ./src
Module not found: Error: Can't resolve './src' in 'F:\HappyMmall\mall'
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./src

结束!(要去睡觉了~)

猜你喜欢

转载自blog.csdn.net/qq_39083004/article/details/80860675
今日推荐