Vue app works in browser throws "Javascript not enabled" through CURL

1.1k views Asked by At

When I open my vue app's URL in browser it loads the application. But, when I tried to call the URL with curl in terminal it returns the error

CURL https://vue-app-url.com/

OUTPUT:

<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <!--[if IE]><link rel="icon" href="/favicon.ico"><![endif]-->
    <title>VUE APP</title>
  <link href="/app.js" rel="preload" as="script"><link rel="icon" type="image/png" sizes="32x32" href="/img/icons/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="/img/icons/favicon-16x16.png"><link rel="manifest" href="/manifest.json"><meta name="theme-color" content="#4DBA87"><meta name="apple-mobile-web-app-capable" content="no"><meta name="apple-mobile-web-app-status-bar-style" content="default"><meta name="apple-mobile-web-app-title" content="app-vue"><link rel="apple-touch-icon" href="/img/icons/apple-touch-icon-152x152.png"><link rel="mask-icon" href="/img/icons/safari-pinned-tab.svg" color="#4DBA87"><meta name="msapplication-TileImage" content="/img/icons/msapplication-icon-144x144.png"><meta name="msapplication-TileColor" content="#000000"></head>
  <body>
    <noscript>
      <strong>We're sorry but app-vue doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  <script type="text/javascript" src="/app.js"></script></body>
</html>
1

There are 1 answers

0
Riad ZT On

As curl will only load the markup this seems to be the correct output. If you add a noscript to a page where the "real" content is loaded or added via Javascript then you will get the noscript via curl. As curl is not loading additional resources.

Try also this commands probably you will get a bit better output:

curl --location https://vue-app-url.com/

or

curl --user-agent "Mozilla/5.0 (X11; Linux x86_64; rv:60.0) Gecko/20100101 Firefox/81.0" https://vue-app-url.com/

Also try removing your noscript just to test it via curl.

Update (better example):

If you add a vue component to you html, lets say:

<feedback-form>Some feedback</feedback-form>

curl will render:

<div id="app"><feedback-form>Some feedback</feedback-form></div>

So everything is ok with your app just the JS is not getting parsed. Its like the source code of you page not the code in your devtools (which is parsed).