CORS for playcanv.as build (Raygun issue)

Help & Support
1

Hello!
Is there a way for me to set CORS rules on my playcanv.as build? I have Raygun in my project, and i use an iFrame with my playcanv.as build inside the iFrame. It works fine but the Raygun error reporter doesnt work.When I try to catch errors in playcanvas, all the details are null. When its out of the iFrame Raygun works fine. Based off of my research it seems like if I have the playcanv.as build have CORS settings that match my parent domain, then all will be well. Is this an option?

Thanks,
Mitch

2

Hi @MitchMeyer1,

No, there isn’t a way to do that right now. @yak32 @yaustar may be able to comment further.

3

Hey, for the testing purposes, I used to add this link before the iframe URL https://cors-anywhere.herokuapp.com/ and it helps sort out the CORS issue. You can try that too but it doesn’t work for all the cases so you can just try and see whether it works for you or not.

1 Like
4

Unfortunately, it is not possible to change CORS configuration for playcanv.as builds. I’m not sure that we have any for those builds in general as we wanted them to be iframe able.

Have you tried using the iframe-less publish link? Add /e before the /p in the URL. eg Changing scenes

5

Right thanks maybe im not explaining well, so i have an index file hosted at web.game.bluestreakmath.com/Learning/index. IN this file there is an iframe with the src being our main build for the playcanvas project. Because the playcanvas project is in an iframe, raygun error reporter doesnt work - due to CORS issues with the iframe. I guess another solution would be maybe for me to point a url associated with my company to our build, I could possibly build another subdomain. Is it possible to point a server towards my playcanv.as build so that the URL looks like its my site?

6

Sorry, I wasn’t more clear here.

The default publish link https://playcanv.as/p/IP7FtbDj/ is an iframe of the app. So if your page iframes this, you have a double iframe which I’ve seen cause issues.

If you add a /e before /p(https://playcanv.as/e/p/IP7FtbDj/) will give you the iframeless version.

If that doesn’t work, I’m out of ideas on what you could do with a playcanv.as hosted build and would suggest hosting the build on your server

7

Okay thanks for the information - yeah i run the /e already - the issue is because i wanted it in my domain i have on my web.game.bluestreakmath.com/Learning/index.html file:

<iframe id="mainFrame" style="border: none; width: 100%; height: 100vh" src="https://playcanv.as/e/p/yHyOvmyw" title="description"></iframe>

So as you can see i manually put it in an iframe. I might just have to send my users to playcanv.as build unless i can hack a way to get raygun to report errors from within an iframe. If i figure that out i will post here, otherwise i might end up directing users to the playcanv.as build, which is not ideal because its for school students so they trust programs more if the url bar says our site.

Thanks for the help!

8

Out of interest, is it not possible to self host your builds on the same network/server?

9

I have tried for hours and hours to do that - you guys sorted out the caching in a way i could not. No matter what i do to the html and NGINX config, I cant get it to stop serving up mix matched versions of files, js from one build, html from another. Leads to constant bugs and crashing. Ive posted on the forums here and hired expert consultants and have not been able to fix it so I was trying to just use your server (which i have no caching issues).

10

Would you be able to update where the iframe points to each time you upload a build?

11

The way our publishing works is that every time a project is published, it is uploaded to a different folder on our server and our permalink just routes to it (or whatever build is selected for the permalink).

@yak32 could explain more here on how it works under the hood

12

Oh i see what you are saying -
Cool so i’m going to try to modify my build script - do you think this will work from a caching standpoint?

  1. download code via playcanvas-tools
  2. unzip
  3. move to unzipped build repository folder with a new build Id (a generated guid folder name)
  4. Modify my permalink index.html file to redirect to new build index.html
  5. push to repo
  6. SSH into server and pull code live

This way whenever permalink index.html updates and people load it, they will be redirected to a totally new build folder. Any tips or comments on that? Only issue with this plan is eventually my server will fill up since each build is 8MB. Also the Url path will keep changing from the redirect. I cant really use iframes with Raygun though so im not sure any alternatives

13

You could delete older folders on the upload.

I don’t know if the iframe will cache the old path in the HTML of the parent page?

14

alright i sorted it out. my nginx points to a folder where the game is located
Inside that folder is an index.html file (where users will be directed to via links) with this:

<!doctype html>
<html lang='en-us'>
   <head>
      <meta name='viewport' content='width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, viewport-fit=cover'>
   </head>
   <body style='margin:0; height: 100%; overflow: hidden'> <iframe id='mainFrame' style='border: none; width: 100%; height: 100vh' src='./Builds/1649706685/Build/index.html' title='description'></iframe> </body>
</html>

In parallel to the the index.html file there is a Builds folder
There is a single iframe in the index.html that points to a new playcanvas build within the builds folder. So we iframe from the permalink index page and fill it up with the index.html from the new playcanvas build. I have a build script that

  1. downloads playcanvas build via playcanvas-tools
  2. moves the new build to the Builds directory in my repository
  3. modifys the main permalink index.html file to make the iframe point to the index.html in the new build
  4. pushes all of it live

From my testing so far, both raygun (iframe and main page are same “domain” so no problems with CORS there) and caching works!

Thanks for the tips, glad i got it sorted

1 Like