How to get VUEJS to work with cloudflare

Hello Community,

This is my first round of VUEJS, and I have a instance running port 80. When I route my STATIC IP into cloudflare, I get a host error.

I’d like to know what I am doing wrong.



Thank you for asking and I am sorry to hear you are experiencing an issue with your VueJS app. We are here to help! :wink:

I could just say I am running two VueJS websites, but the main difference I think is they are both working on HTTPS (port 443) and have a valid SSL certificate installed at the origin hosts/server for domain(s).

  • in my vue config file I also have set https: true

While at the Cloudflare dashboard I have set my DNS records (hostnames) are proxied and set to :orange: and under the SSL/TLS tab I selected Full (Strict) SSL option.

I am proxying it over web server, so I have set my certificate/key there. Otherwise, I should add them to my vue config file.

Otherwise, you might be using Cloudflare Pages and VueJS? If so, here is a helpful article in this case:

You stated port 80, which is HTTP (unsecured) and “host error” which I assume is some 5xx error shown from Cloudflare:

Could you reply which error do you see or a screenshot of it?

Can you make sure your VueJS would runs over a secured HTTPS connection for further, or would you rather prefer using it over an unsecured HTTP?

Furthermore, before moving to Cloudflare, was your Website working over HTTPS connection?

May I ask what SSL option have you got selected under the SSL/TLS tab at Cloudflare dashboard for your domain ( Flexible, Full, Full Strict … )?

Here is a way to re-check if you correctly setup the SSL for your domain with Cloudflare:

In case you do not have an SSL certificate, you can use Cloudflare SSL, if so, kindly make sure you follow the instructions as follows on the below article to setup an SSL certificate using Cloudflare Origin CA Certificate:

Last but not least, kindly have a look here for more information regarding correct SSL settings at the SSL/TLS tab on Cloudflare dashboard:

There also might be an issue with a firewall blocking Cloudflare to connect to your instance.
Kindly, could you re-check if Cloudflare is allowed to connect to your origin host to as follows in the below article:

Nevertheless, Cloudflare IP addresses list can be found here:

1 Like

I had SSL on flexible, as it’s a new APP it hasn’t ran before.

I can see it’s running BINDED to 80 on a static IP, I simply want a port 80 not secure site proxied through CLOUDFLARE so I can use the access control to control development to the project.

Possible issue.

I am not sure and not recommended way, but if so, you could try chosing the Off option under the SSL/TLS tab of Cloudflare dashboard.

Furthermore, make sure both Always Use HTTPS and Automatic HTTPS Rewrites options are disabled under the SSL/TLS tab → section “Edge Certificates”.

Just a quick reminder, as far as Web browsers are strongly and resonably enforcing using HTTPS-only, you might have issue while trying to access/openning your website (domain).

I did do this, and it seems to work. I will plan once the instance starts to go live to get SSL between origin and CF.

1 Like

This topic was automatically closed 3 days after the last reply. New replies are no longer allowed.