웹팩 개발의 도메인 간 문제에 대한 간략한 토론

이 글은 주로 웹팩 개발 시 크로스 도메인 문제에 대한 해결책을 소개하고 있습니다. 편집자는 꽤 괜찮다고 생각해서 지금 공유하고 참고용으로 제공하겠습니다. 편집자를 따라가서 살펴보겠습니다

이 글에서는 웹팩 개발 시 크로스 도메인 문제에 대한 솔루션을 소개하고 모든 사람과 공유합니다. 자세한 내용은 다음과 같습니다.

1.웹팩에는 내장되어 있습니다. 요청을 해결할 수 있는 http-proxy-middleware. URL 프록시

2.API

는 프록시 경로 이름에 /

module.exports = {
  devtool: 'cheap-module-source-map',
  entry: './app/js/index.js'
  output: {
    path: path.resolve(__dirname, 'dev'),
    // 所有输出文件的目标路径
    filename: 'js/bundle.js',
    publicPath: '/',
    chunkFilename: '[name].chunk.js'
  },
  devServer: {
    contentBase: path.resolve(__dirname, 'dev'),
    publicPath: '/',
    historyApiFallback: true,
    proxy: {
      // 请求到 '/device' 下 的请求都会被代理到 target： http://debug.xxx.com 中
      '/device/*': { 
        target: 'http://debug.xxx.com',
        secure: false, // 接受 运行在 https 上的服务
        changeOrigin: true
      }
    }
  }
}

를 추가해야 합니다. /로 시작해야 합니다. 그렇지 않으면 지정된 주소에 대한 프록시가 되지 않습니다

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

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

위 내용은 웹팩 개발의 도메인 간 문제에 대한 간략한 토론의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!