VueJs - Настройка нескольких прокси в vue .config - PullRequest
Новая
       48

VueJs - Настройка нескольких прокси в vue .config

1 голос
/ 18 апреля 2020

Итак, я делаю вызов API с прокси, как это:

vue .config. js: 

module.exports = {
  devServer: {
    proxy: 'http://www.pathofexile.com/'
  }
}

xxx. vue: 

axios.get("http://localhost:8080/api/public-stash-tabs").then..

Это работает! Теперь, когда я хочу сделать вызов API с другого сайта, я не уверен, как это сделать. Что-то вроде этого - вот что я хочу:

vue .config. js: 

module.exports = {
  devServer: {
    proxy: {
      'http://localhost:8080/one/': {
        target: 'http://www.pathofexile.com/',
        changeOrigin: true
      },
      'http://localhost:8080/two/': {
        target: 'https://api.poe.watch/',
        changeOrigin: true
      }
    }
  }
}

xxx. vue: 

axios.get("http://localhost:8080/one/api/public-stash-tabs").then..
axios.get("http://localhost:8080/two/id").then..

Но ничего кажется, что я получаю ошибку 404, потому что она пытается получить что-то от http://localhost: 8080 / api / publi c -sta sh -tabs

Я на правильном пути с этим, и я просто что-то упустил? Или это не путь к go?

1 Ответ

1 голос
/ 18 апреля 2020

Я не видел ни одного примера использования такого полного пути. Поскольку это, очевидно, работает для вас (не для меня), я не уверен, что это поможет вам. Попробуйте настроить прокси-сервер, используя относительные пути, как в примерах Webpack : 

devServer: {
  proxy: {
    '/one': {
      target: 'http://www.pathofexile.com/',
      pathRewrite: {'^/one' : ''}
    },
    '/two': {
      target: 'https://api.poe.watch/',
      pathRewrite: {'^/two' : ''}
    }
  }
},

Цель pathRewrite - удалить соответствующую часть из целевого URL. В противном случае он будет добавлен как: "http://www.pathofexile.com/one ..."

Сейчас я проверяю эти правила на сервере, успешно используя ваши URL-адреса (см. Ответ API POE). Не забудьте перезапустить devServer, например, npm run serve

...