Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

Page attempting to connect to WebSocket endpoint Error


Support,
I have used Metronic 8 demo1 with no issues when viewing the site, but when I try to view Metronic 8 demo2 I am receiving the following error.

"Mixed Content: The page at 'https://localhost:7261/' was loaded over HTTPS, but attempted to connect to the insecure WebSocket endpoint 'ws://192.168.25.48:8080/ws'. This request has been blocked; this endpoint must be available over WSS."

Is there something different in web-pack between the two demo types for this error to happen?

Thanks


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (4)


Hi,

Demo1 and Demo2 differ only in style files and also with layout components, other theme parts must be the same for all demos.

If you are using Vue then on our preview page we do not have this error.
https://preview.keenthemes.com/metronic8/vue/demo2/#/dashboard

Also if there are any steps on how to reproduce this issue please describe them.

Regards,
Lauris Stepanovs,
Keenthemes Support Team



Can I get an older version of Metronic Demo2 from last year to test? I have been trying to figure out the issue and so far I believe it has to do with the versioning of the dependencies.

My project architecture has a Asp.net Core backend, Vue 3 frontend and I am using SPA services in my Asp.net Core application to utilize a ProxyToSpaDevelopmentServer. As I stated I have another application with the same architecture that uses Metronic Demo1 from Fall of 2021 that works perfect.



Hi,

You can download the older Metronic version from our Github repo.

For access fill form below.
https://keenthemes.com/metronic/?page=github

Regards,
Lauris Stepanovs,
Keenthemes Support Team



That is what exactly I got, only in Safari 15.2 or higher 16. Using the proxy devServer, points to backend asp.net core and gets this 'ws://xxx.xxx.xx.xx:8080/ws' connection failure issue on every page. The workaround I tried is to disable the NSURLSession WebSocket in Safari but our client won't like it because it is a default setting now. I actually tried to upgrade to version 8.17 but remain all vuex-module-decorators modules. Still the same so I have to try the 8.17 with Pinia storage
Let me know if you need a remote environment to replicate.

Please advise how to fix it.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(