Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to use vue-meta with ssr? #114

Closed
xrei opened this issue Jul 29, 2017 · 10 comments
Closed

How to use vue-meta with ssr? #114

xrei opened this issue Jul 29, 2017 · 10 comments

Comments

@xrei
Copy link

xrei commented Jul 29, 2017

Is there any way to use it with createBundleRenderer ? this function outputs the ssr bundle with html and then i'm using this html in .renderToString() function.
So when i'm adding ${meta.text()} to the res.send() my rendered html file becoming weird and not semantic. I mean meta tags are not in < head> and etc.

Thanks.

@xrei
Copy link
Author

xrei commented Jul 30, 2017

I found a solution. if anyone interested just add {{{ meta.inject().title.text() }}} and other meta props in template.html

@Atinux Atinux closed this as completed Aug 2, 2017
@andreasvirkus
Copy link

This works, however, the Vue SSR docs discourage the usage of {{{ }}} and warn us of potential XSS attacks:

Use double-mustache (HTML-escaped interpolation) to avoid XSS attacks.

https://ssr.vuejs.org/en/head.html (See "Notes" at the bottom)

@xrei
Copy link
Author

xrei commented Aug 5, 2017

I know this, but for now i don't know how to inject it to html. double mustaches just output it as text..

@newenegue
Copy link

Is there an alternative approach than using {{{ }}}?

@andreasvirkus
Copy link

andreasvirkus commented Aug 10, 2017

@Atinux @declandewet ping

@geekguy
Copy link
Contributor

geekguy commented Nov 6, 2017

@Atinux - any update on @newenegue's previous comment?

@Atinux
Copy link
Member

Atinux commented Nov 7, 2017

Actually, meta.inject().title.text() render escaped HTML so you can have to use {{{ }}}.

Example: title: '<b>Coucou</b>'

$meta().inject().title.text() => <title data-vue-meta="true">&lt;b&gt;Coucou&lt;/b&gt;</title>

@geekguy
Copy link
Contributor

geekguy commented Nov 7, 2017

Oh, perfect.

Should we update this in doc?

@Atinux
Copy link
Member

Atinux commented Nov 7, 2017

A PR would be awesome :)

geekguy pushed a commit to geekguy/vue-meta that referenced this issue Nov 7, 2017
@geekguy
Copy link
Contributor

geekguy commented Nov 7, 2017

@Atinux - here you go - #156

geekguy pushed a commit to geekguy/vue-meta that referenced this issue Nov 8, 2017
Atinux added a commit that referenced this issue Nov 10, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants