No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    devServer proxy doesn't work

    Help
    3
    4
    1835
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • 1
      1001v last edited by 1001v

      Hello. I’m trying to use devServer.proxy option like this:

      devServer: {
            https: false,
            port: 8081,
            open: false,
            proxy: {
              '/api': {
                target: 'http://localhost:8080',
                changeOrigin: true
              }
            }
          },
      

      localhost:8080 is my backend location and localhost:8081 is my frontend location. I expect all requests starting with /api go to localhost:8080. However, proxy doesn’t work like nothing is enabled and all requests go to frontend dev server ignoring the setting.
      I’ve also tried to set the devServer.public option to “localhost:8081”, but it didn’t help.
      How could i fix it? Thank you.

      qyloxe 1 Reply Last reply Reply Quote 0
      • qyloxe
        qyloxe @1001v last edited by qyloxe

        @1001v this is a simple working configuration, try this one:

            devServer: {
              host: options.devhost,
              https: true,
              port: options.devport, // 8084?
              open: false, // opens browser window automatically
              vueDevtools: ctx.vueDevtools,
              proxy: {
                '/api': {
                  target: options.appurl, // 'http://localhost:8085', // pathRewrite: {'^/api': ''}
                  secure: false
                }
              }
            },
        

        I have in archives also something like this, maybe also will be useful:

              proxy: [{
                context: ['/appmanager', '/img', '/media'],
                target: 'http://localhost:8085',
                secure: false,
                changeOrigin: true,
                /*
                cookieDomainRewrite: {
                  'localhost': 'localhost:8085',
                  '*': 'localhost:8085'
                },
                */
                cookiePathRewrite: {
                  '/appmanager': '/',
                  '*': '/'
                },
                headers: {
                  // 'Quasar-Proxy2': 'YYY'
                },
                pathRewrite: {
                  // '^/api': ''
                }
              }], 
        
        dobbel 1 Reply Last reply Reply Quote 0
        • dobbel
          dobbel @qyloxe last edited by

          @qyloxe Is this webpack functionality? Could you explain what it does? ( the last code sample)

          qyloxe 1 Reply Last reply Reply Quote 0
          • qyloxe
            qyloxe @dobbel last edited by

            @dobbel said in devServer proxy doesn't work:

            @qyloxe Is this webpack functionality? Could you explain what it does? ( the last code sample)

            yes, webpack. Docs here:
            https://webpack.js.org/configuration/dev-server/

            I needed something like that to test cookie/header authentication, proxyfying session cookies between xhr requests from different domain to backend servers etc. With such magic you can mimic almost exactly what is on the front at reverse proxy level (nginx/openresty/etc). I wouldn’t say it’s the best possible configuration for developer, there are more options now possible, but it is adequate and working which means - good enough.

            1 Reply Last reply Reply Quote 0
            • First post
              Last post