Open allthetime opened 3 years ago
I solved it, and it doesn't really make sense why. Looks like a disqus problem:
This does not work:
<DiscussionEmbed
shortname={'https-allthetime-github-io'}
config={
{
url: MY_URL+p.filename,
identifier: p.filename,
title: p.filename,
}
}
/>
But this does:
<DiscussionEmbed
shortname={'https-allthetime-github-io'}
config={
{
url: MY_URL+p.filename,
identifier: p.filename+"_0",
title: p.filename,
}
}
/>
All I did was add "_0" to the end of the identifier and now it works.
This doesn't make any sense to me.
@allthetime Do you have an example repo that I can use to reproduce this issue?
I had this same problem but with reactions (didn't have any comments yet)--adding a reaction on one page added it to all pages. I added the fix from @allthetime and now it works. It's kind of strange because before that fix I was setting the identifier as either ${_id}_prod
or ${_id}_dev
depending on my environment, which is kind of similar to the current "fix".
My code, without the fix, was exactly as is below, except for the shortName, obviously.
import { DiscussionEmbed } from 'disqus-react'
import PropTypes from 'prop-types'
import styles from './Disqus.module.css'
const Disqus = ({ article, url }) => {
const disqusShortname = 'myShortname'
const env = url.includes('localhost') ? 'dev' : 'prod'
const disqusConfig = {
url,
identifier: `${article._id}_${env}`,
title: article.name,
}
return (
<div className={styles.commentsSection}>
<DiscussionEmbed
shortname={disqusShortname}
config={disqusConfig}
/>
</div>
)
}
Disqus.propTypes = {
article: PropTypes.object,
url: PropTypes.string,
}
export default Disqus
Having the same issue and the "solution" isn't working for me.
This is a common issue and is usually an indication of a problem with the individual implementation, but I'm unable to help troubleshoot the issue without a sample repository to reproduce the issue. Though, I can confirm that this is not an issue on the Disqus side.
@squillen If the reactions are being shared across multiple pages then the comment threads would have the same issue. From the snippet you provided, I would advise you to try using your production URL as mentioned in the FAQ and seeing if that resolves your issue.
Clue: test_post_0
works, but test-post_0
does not. It appears these strings are character restricted.
I had the same problem using the DiscussionEmbed example. The fix mentioned earlier didn't work, but I was able to get it working by using setState and useEffect, and a loading prop.
const [disqusConfig, setDisqusConfig] = useState({});
...
setDisqusConfig({ url: "https://mywebsite.com/" + post.slug, identifier: post.id, title: post.title });
...
<DiscussionEmbed shortname="my-web-site" config={disqusConfig} />
tl;dr: Ran into something similar. My solution was to replace all dashes in the identifier with an underscore, then it magically worked.
const disqusPostId = postId.split('-').join('_');
On my page, different comment threads are loaded without refreshing/navigating (I am still providing a unique URL for each Disqus thread). So I also give the containing div
a key that includes the identifier, just to make sure it's being updated in the DOM, like so:
<div key={`disqus-container-${disqusPostId}`}>
<DiscussionEmbed ... />
</div>
Ensuring each thread had a unique key was not enough. Replacing -
with _
was the only thing that consistently worked for me.
Browsed the following Disqus resources, I don't see anything about dashes being illegal. In fact one of the examples shown in the docs actually HAS dashes. But for whatever reason, replacing the dashes in my identifier with underscores seems to "fix" it.
Still the same issue in 2023.
In my case my identifier
is a hash string 727987336aa2fbc73f39aa2584953207f4b7f4e6
. Appending _0
works for me.
Not sure if these steps help reproduce the issue without creating a new repo:
DiscussionEmbed
component once with a new url
and a new identifier
specified. Grab the identifier
value from my comment (the 4b7f4e6 one) or previous comment (test-post-1). Make sure a new thread is created in admin/discussions/
abc
to the BEGINNING of the identifier
field, and load the DiscussionEmbed
component again.Adding _0 seems to be working for me, my identifier was a string with underscores.
On my page, I render a list of posts with a "SHOW COMMENTS" button that reveals the
DiscussionEmbed
element:here is the
showComments
function, which fires when the button is pressed, reset DISQUS from its window object and setscurrentPost
which then shows theDiscussionEmbed
component that matches:Anyway, all the comment blocks are the same / have the same comments. If I click the links to the comments contained in they have:
MY_URL
instead of
`MY_URL#!filename
What am I doing wrong?