Can't connect to api backend socket after build using https

[dgk]

Hi,

It’s all been working well with quasar dev.

I have done a quasar build and fired up a http servers for my backend api(feathers) and the dist folder and that was working fine

Now to secure things I started running a https server for both the backend api and my quasar app. The issue is that now the quasar app can not connect to the backend api (my other nodejs clients don’t have an issue, and visiting backend url in a browser gives me a “secure https page” backend alive reply)

Is there something else I need to set in the webpack production stuff or elsewhere? I just changed the proxy table and my feathers client api.js. Am I missing something here about production vs dev???..what do I need to do with settings for quasar build in order to talk to my api backend correctly

my config/index.js

var path = require('path')

module.exports = {
	// Webpack aliases
	aliases: {
		quasar: path.resolve(__dirname, '../node_modules/quasar-framework/'),
		src: path.resolve(__dirname, '../src'),
		assets: path.resolve(__dirname, '../src/assets'),
		'@': path.resolve(__dirname, '../src/components'),
		variables: path.resolve(__dirname, '../src/themes/quasar.variables.styl')
	},

	// Progress Bar Webpack plugin format
	// https://github.com/clessg/progress-bar-webpack-plugin#options
	progressFormat: ' [:bar] ' + ':percent'.bold + ' (:msg)',

	// Default theme to build with ('ios' or 'mat')
	defaultTheme: 'mat',

	build: {
		env: require('./prod.env'),
		publicPath: '',
		productionSourceMap: false,

		// Remove unused CSS
		// Disable it if it has side-effects for your specific app
		purifyCSS: true
	},
	dev: {
		env: require('./dev.env'),
		cssSourceMap: true,
		// auto open browser or not
		openBrowser: true,
		publicPath: '/',
		port: 8090,

		// If for example you are using Quasar Play
		// to generate a QR code then on each dev (re)compilation
		// you need to avoid clearing out the console, so set this
		// to "false", otherwise you can set it to "true" to always
		// have only the messages regarding your last (re)compilation.
		clearConsoleOnRebuild: false,

		// Proxy your API if using any.
		// Also see /build/script.dev.js and search for "proxy api requests"
		// https://github.com/chimurai/http-proxy-middleware
		proxyTable: {
			'/api': {
				target: 'https://lights-backend.kebler.net',   // on switches rpi
 				changeOrigin: true
			}
		}
	}
}

my feathers client api.js

import feathers from 'feathers'
import hooks from 'feathers-hooks'
import socketio from 'feathers-socketio'
import auth from 'feathers-authentication-client'
import io from 'socket.io-client'

const socket = io('https://lights-backend.kebler.net', { transports: ['websocket']  })

const api = feathers()
  .configure(hooks())
  .configure(socketio(socket))
  .configure(auth({ storage: window.localStorage }))

export default api

[dgk]

Ok, so I didn’t do anything more than I have listed above and it’s now fine and then not.

Look like maybe the app gets ahead of the connection as in the connection now takes a bit longer to establish with the ssl handshake and the app is asking for data before the connection has been made.

I can’t see where in the code the api proxy requests a connection. If so I could async delay asking for data until I know the connection has been eastablished. At the least I could set a timeout.

Where is that code that uses the proxyTable key in config/index.js