0

Im trying to set a html5 game to an Iframe.

<iframe src="game url"></iframe>

The problem is the game url needs authentication header (token) and I can't set token on iframe src.(as I know so far)

So I fetched the given game url using axios. and then passed em to Iframe srcdoc attribute no surprise I got errors. So what is the solution ?

here is what I get from the api on postman in which i can send http headers like authentication tokens. But how can i set it on iframe?

<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8">
   <title>Cocos Creator | FlappyTest1</title>
   <!--http://www.html5rocks.com/en/mobile/mobifying/-->
   <meta name="viewport"content="width=device-width,user-scalable=no,initial-scale=1, minimum scale=1,maximum-scale=1" />
</head>
<body>
   <canvas id="GameCanvas" oncontextmenu="event.preventDefault()" tabindex="0"></canvas>

   <script src="src/settings.718ea.js" charset="utf-8"></script>
   <script src="main.62040.js" charset="utf-8"></script>
</body>
</html>

Im using React and redux but I think it doesn't matter

Arian Shahalami
  • 1,369
  • 2
  • 13
  • 25
  • Is that the exact HTML that was returned by the API? There is a missing `<` in the first script tag. – Turnip Nov 09 '20 at 15:54
  • @Turnip No that's a huge html file. I just wanted to show that the api result contains – Arian Shahalami Nov 09 '20 at 15:59
  • Consider reading this: [mre] – tevemadar Nov 09 '20 at 20:05
  • @tevemadar although it was clear. i made some changes to make what i want clear – Arian Shahalami Nov 09 '20 at 20:25
  • Does this answer your question? [Is it possible to add Request Headers to an iframe src request?](https://stackoverflow.com/questions/13432821/is-it-possible-to-add-request-headers-to-an-iframe-src-request) – Daniel Beck Nov 09 '20 at 20:27
  • At this very moment both script tags refer to local JavaScript files, `main.62040.js` is expected to be immediately next to your HTML and `settings.718ea.js` in a folder called `src`. If those files exist, they should get loaded and then something happens or not. If those files do not exist, they obviously won't get loaded and nothing will happen. You tell about errors, but forgot describing them. If you see 404-s, that means the files do not exist, and simply get them. Repeat the same with all missing files, use the developer console to see them. – tevemadar Nov 09 '20 at 20:37
  • @tevemadar man my problem is not with the api result. My problem is first how to set http header on iframe and as i know it's kinda impossible to set header on it. so we should use fetch and GET mehod to get data with included header. Now the we got api result (which I posted em on top of post) how to show the api result in an iframe? – Arian Shahalami Nov 09 '20 at 20:50

1 Answers1

0

I didn't find any solution for this. Even making a blob from that url doesn't change anything. The solution that I found is kinda related to back-end, where we can pass authentication token as part of url paramaters on src of iframe

Arian Shahalami
  • 1,369
  • 2
  • 13
  • 25