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

    Reference HTML file in iframe

    Help
    2
    10
    108
    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.
    • J
      Jonalxh last edited by

      Hi guys, I need to open an static HTML file inside an iframe because I need it to be printed silently, I’m trying setting the iframe src with absolete and relative paths but none of them work, I’ve tried moving my files inside public, static and assets folders with no success, I’ve seen that some people uses process.env.BASE_URL to access absole path of environment but it doesn’t work in Quasar.

      Currently I have my files in a folder called ticketTemplates inside public folder placed at root, and it has two files: template1.html and template1.css, I’m doing the following:

      <iframe src="ticketTemplates/first.html" frameborder="1"></iframe>
      

      But as I said before it does not with relative or absolute paths.
      Could you tell me how to achieve it?

      beets 1 Reply Last reply Reply Quote 0
      • beets
        beets @Jonalxh last edited by

        @Jonalxh Are you doing this during quasar dev or on a deployed site? Can you try to access the files directly first? i.e. http://localhost:8080/ticketTemplates/first.html

        Does it show? Also check the network inspector in chrome / firefox and see if any headers like x-frame-options is set on that response. It shouldn’t be there during the dev server but could be on production depending on your server settings.

        1 Reply Last reply Reply Quote 0
        • J
          Jonalxh last edited by Jonalxh

          Hi @beets I’ve tried with http://localhost:8080/ticketTemplates/first.html and result is the same:

          Cannot GET /ticketTemplates/first.html

          I’m just executing quasar dev in development, not in production.

          beets 1 Reply Last reply Reply Quote 0
          • beets
            beets @Jonalxh last edited by

            @Jonalxh Can you run quasar info to get the version you’re using?

            $ quasar info
            ...
            Important local packages
              quasar - 1.15.0 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
              @quasar/app - 2.1.14 -- Quasar Framework local CLI
              @quasar/extras - 1.9.12 -- Quasar Framework fonts, icons and animations
            ...
            

            Run the command and paste the above three lines here so we can check which version of quasar you’re on. You mention both the static and public folder, with the former on quasar/app v1 and the latter on v2.

            Assuming you are on quasar/app v2, just to make sure, the public folder is in the root of your project, next to quasar.conf.js and the ticketTemplates folder is inside that, correct?

            1 Reply Last reply Reply Quote 0
            • J
              Jonalxh last edited by

              quasar info result is:

              Important local packages quasar - 1.14.7 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time @quasar/app - 1.9.6 -- Quasar Framework local CLI @quasar/extras - 1.9.12 -- Quasar Framework fonts, icons and animations

              The answer of your question is correct, public folder is in root beside quasar.conf.js and ticketTemplates folder is inside.

              beets 1 Reply Last reply Reply Quote 0
              • beets
                beets @Jonalxh last edited by

                @Jonalxh Okay, so you’re using @quasar/app 1.9.6, which doesn’t use the public folder. Instead you would use src/statics/ticketTemplates. It sounds like you may have tried it, but perhaps the statics folder wasn’t inside the src folder. In any case, try moving it to the statics folder again and try http://localhost:8080/ticketTemplates/first.html

                Note that if you do want to upgrade to quasar/app v2, you’d have to follow this 5 minute upgrade guide: https://quasar.dev/quasar-cli/app-upgrade-guide . Make sure you work on a new git branch or otherwise save all changes before attempting to upgrade, just in case.

                beets 1 Reply Last reply Reply Quote 0
                • beets
                  beets @beets last edited by beets

                  Sorry I just had a look at the older docs, after placing the folder in src/statics/ticketTemplates I believe you’ll need to access it as http://localhost:8080/statics/ticketTemplates/first.html and

                  <iframe src="statics/ticketTemplates/first.html" frameborder="1"></iframe>
                  
                  1 Reply Last reply Reply Quote 0
                  • J
                    Jonalxh last edited by

                    You’re right, I’ve created a new project with updated resources and now it works.

                    In production it will be available in the same way (same url)?

                    Thanks a lot.

                    beets 1 Reply Last reply Reply Quote 0
                    • beets
                      beets @Jonalxh last edited by

                      @Jonalxh It will in fact be the same in production. Basically just if you are pre quasar/app v2 you had to prepend statics/ to each path, which is why v2 introduced the public folder so you could have paths like example.com/favicon.ico from the public dir.

                      1 Reply Last reply Reply Quote 1
                      • J
                        Jonalxh last edited by

                        Awesome, thanks a lot @beets .

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