Channel Preview Issue

[chrisjpowers]

I'm running the app locally and trying to use the "Preview" feature on the Channels page. It pulls up the preview page, but an error from the cast_receiver.js Google lib is hosing the page. It's trying to connect to a WebSocket port on 8008, but I'm not sure where that's supposed to be coming from?

It's worth noting there are not any Chromecasts on the network currently, but I assumed I could preview a channel regardless.

Have you seen this issue before?

[superhawk610]

You should be able to preview the channel (it should still display correctly). Since Previews render the page exactly as it will be displayed on the Chromecast, it's loading cast_receiver.js, which is a script that only functions correctly when accessed from a Chromecast device (I believe port 8008 is used internally by Chromecast devices, while 8009 is used externally for receiving incoming connections).

To my knowledge, this should be harmless aside from clogging up the console.

This can be rather easily fixed by adding an additional URL to the Express schema to essentially strip this script from the preview page when viewed via Preview and not on an actual device, something like

app.get('/channel/:channel_id', (req, res) => {
  res.render('channel', { ... , casting: true })
})

app.get('/channel/:channel_id/preview', (req, res) => {
  res.render('channel', { ... , casting: false })
})

and then just conditionally including cast_receiver.js on the channel page.

[chrisjpowers]

Okay, I'll try that. My channel failed to render in the preview (blank white page) which I assumed was due to the JS error.

…

On Fri, Oct 6, 2017 at 4:09 PM Aaron Ross ***@***.***> wrote: You should be able to preview the channel (it should still display correctly). Since Previews render the page exactly as it will be displayed on the Chromecast, it's loading cast_receiver.js, which is a script that only functions correctly when accessed from a Chromecast device (I believe port 8008 is used internally by Chromecast devices, while 8009 is used externally for receiving incoming connections). To my knowledge, this should be harmless aside from clogging up the console. This can be rather easily fixed by adding an additional URL to the Express schema to essentially strip this script from the preview page when viewed via Preview and not on an actual device, something like app.get('/channel/:channel_id', (req, res) => { res.render('channel', { ... , *casting: true* }) }) app.get('/channel/:channel_id*/preview*', (req, res) => { res.render('channel', { ... , *casting: false* }) }) and then just conditionally including cast_receiver.js on the channel page. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#1 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAAwKSQUZavfCM_qb6OUWf_T4jiATS95ks5sppbugaJpZM4PxBOI> .

[superhawk610]

Any chance the content you're trying to load has a header that blocks it from being loaded in an iframe? Anything like the following:

X-Frame-Options: DENY
X-Frame-Options: SAMEORIGIN
X-Frame-Options: ALLOW-FROM https://not-your-url.com/

In Firefox, it will throw an error in the console when this prevents loading. Are you trying to load your own content or someone else's page?

[Brekmister]

@superhawk610 That's what I am seeing whenever I load something that's not mine on some sites.

I don't think this is an issue, it's a security feature built into the spec. Whether if it's an good feature or not...well, that's a topic for another day.

[Brekmister]

But, there is a low possibility that we can probably catch that and put on a page saying "Sorry, this page cannot be loaded...Error xxx: X-frame denied"

[superhawk610]

I'm also fairly sure we could proxy each page and strip those headers, though I'm not sure how nefarious that is seeing as it contradicts the ideology behind that spec..

I like the idea of catching the errors, I'll try to throw that into the next release.