动态og：Facebook共享图片按钮

Question

Similar to this medium article where a custom og:image, og:title, and og:description are displayed for different articles, when the facebook share button is clicked a popup opens to let the user type a message and below is the image/title/description grabbed from meta tags (og:image, og:title, etc)

When the user clicks on the facebook share button I then dynamically change the meta tags to customized images/descriptions using javascript like so

document.head.querySelector("[property='og:image']").setAttribute("content", image_url)

the problem is that the image isn't appearing at all when the fb share button is clicked - when I enter the url into Sharing debugger it works, but on the actual website it doesn't

Answer 1

Not certain what your aim is but you won't be able to set the og:image using Javascript because facebook is getting the image url etc. from the HTML returned by the url when its own server requests that url. It's not getting that data from the client.