Nuxt stati c созданная страница и топор ios post - PullRequest
Новая
       5

Nuxt stati c созданная страница и топор ios post

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

У меня есть проект Nuxt. Все в порядке, когда я создаю страницу c. Однако мне нужно отправить запрос POST на другой сервер.

Я пытался использовать как прокси в nuxt.config. js, так и просто прямой запрос, но после развертывания в ngnix в конце концов ничего не работает .

Пожалуйста, помогите.

ОБНОВЛЕНИЕ. Действия по воспроизведению.

  • Создание приложения Nuxt, включая ax ios и прокси
  • Настройка прокси-сервера для другого веб-сервиса:

proxy: { '/api': { target: 'http://example.com:9000', pathRewrite: { '^/api': '/', }, }, changeOrigin: true, },

  • вызовите эту службу где-нибудь в коде:

    const result = await this.$axios.post('/api/email/subscribe', {email: email})

  • запустите "Yarn Dev" и протестируйте службу. Он работает локально правильно.

  • запустите 'nuxt generate' и разверните службу размещения кода stati c, например, hosting.com
  • запустите вашу страницу, которая вызывает упомянутый сервис.

В результате вместо вызова POST к hosting.com/api/email/subscribe он вызывает localhost:3000/api/email/subscribe.

Ответы [ 2 ]

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

Обязательно установите в свой проект текстовые версии ax ios и прокси @ nuxt / ax ios и @ nuxtjs / proxy

после этого в вашем nuxt.config. js добавьте ax ios в качестве модуля плюс эти опции для ax ios и proxy: 

  modules: [
    // Doc: https://axios.nuxtjs.org/usage
    '@nuxtjs/axios',
    //more modules if you need
  ],
  /*
   ** Axios module configuration
   */
  axios: {
    proxy: true,
    // See https://github.com/nuxt-community/axios-module#options
  },

  proxy: {
    '/api/': {
      target: process.env.AXIOS_SERVER, // I use .env files for the variables
      pathRewrite: { '^/api/': '' }, //this should be your bug
    },
  },

, теперь вы можете использовать ax ios в любой части код, подобный этому 

const result = await this.$axios.post('/api/email/subscribe', {email: email})

будет внутренне разрешен до AXIOS_SERVER/email/subscribe без проблем с причинами.

ДОПОЛНИТЕЛЬНО: тестируйте среду локально, используя несколько файлов .env

you Можно настроить .env для dev и .env.prod для производства, после чего в локальном режиме вы можете использовать yarn build && yarn start для тестирования приложения с производственной средой. Вам нужно только добавить это вверху вашего nuxt.config. js file 

const fs = require('fs')
const path = require('path')

if (process.env.NODE_ENV === 'production' && fs.existsSync('.env.prod')) {
  require('dotenv').config({ path: path.join(__dirname, `.env.prod`) })
} else {
  require('dotenv').config()
}
0 голосов
/ 25 апреля 2020

По определению на странице Nuxt docs что делает nuxt generate: Создайте приложение и создайте каждый маршрут в виде файла HTML (используется для размещения c).

Следовательно, использование proxy здесь не может быть и речи. Обратите внимание, что ваш путь даже не переписывается.

И, вероятно, вы ищете не hosting.com/api/email/subscribe (с /api), а hosting.com/email/subscribe.

Тем не менее , если вы используете nginx, то я не думаю, что вы должны использовать опцию Nuxt proxy. Nginx создан именно для этого, поэтому укажите ваши вызовы API там, а в nginx файле конфигурации просто укажите, куда он должен указывать.

...