Error on clicking the LinkedIn Share Button on IE/Edge - reactjs

I am using the below Share Plugin of LinkedIn in my ReactJS app:
<script src="https://platform.linkedin.com/in.js" type="text/javascript">lang: en_US</script>
<script type="IN/Share" data-url="https://www.linkedin.com"></script>
From LinkedIn Docs: https://learn.microsoft.com/en-us/linkedin/consumer/integrations/self-serve/plugins/share-plugin
It is working completely fine on Chrome/Firefox/Safari. But, on clicking the LinkedIn Share button (generated by the above scripts), the LinkedIn Share Popup appears and I get an error in my app console which says:
[object Error]: {description: "[Messenger] Required property 'target'
was not provided", message: "[Messenger] Required property 'target'
was not provided", nr#seenError: true, stack: "Error: [Messenger]
Required property 'target' was not provided at Anonymous function
(https://platform.linkedin.com/xdoor/scripts/in.js:7:55143) at
Array.prototype.forEach (native code) at t
(https://platform.linkedin.com/xdoor/scripts/in.js:7:54936) at e
(https://platform.linkedin.com/xdoor/scripts/in.js:7:56462) at e
(https://platform.linkedin.com/xdoor/scripts/in.js:7:34661) at value
(https://platform.linkedin.com/xdoor/scripts/in.js:18:23834) at s
(https://platform.linkedin.com/xdoor/scripts/in.js:18:38221) at
nrWrapper
([MY_SITE_LINK_ADDRESS]:9:16587)"}
Note: I hid the [MY_SITE_LINK_ADDRESS].

The problem here seems to be that you're relying on the plugin's JS, CSS, and HTML to handle every browser. Take a look: Here's someone else posting in 2018 having the same exact problem, Issue on IE with LinkedIn Share plugin. And, officially from LinkedIn, if you want this plugin to work, you need to ask your users to do this:
Open Internet Explorer.
Click Tools and select Compatibility View Settings.
Uncheck the box next to "Display all websites in compatibility view".
Click Close.
Is it reasonable to ask your users to reconfigure their browser just to be able to click one, single button on your website? Answer: No.
You don't need to rely on the LinkedIn Share Plugin. All you really ought to need is...
https://www.linkedin.com/sharing/share-offsite/?url={url}
Then making sure it works cross-browser is in your hands.
Source: Microsoft LinkedIn Share URL Documentation.
Sure, everyone says: Don't Reinvent the Wheel! I totally agree! But when you find a car that has square, cubic wheels, then maybe you want to reconsider!
If you are interested in a regularly maintained GitHub project that keeps track of this so you don't have to, check it out! Social Share URLs

Related

2sxc "had an Error Talking with the Server (Status 403)"

I installed a 2sxc version 11.11.3 Inside a fresh dnn 9.3.2.
After this I created a content Module with the simple test view inside. After this I granted this module the edit permission to the Registered Users Group on dnn module Level.
If I log in as a registered user I can see the 2sxc toolbar (blue symbols when hovering the item of the module) of the Module and the items. If I press the edit icon I get the Message "had an Error Talking with the Server (Status 403)".
Has anyone an idea what I am doing wrong?
Thank you very much
Robert
Edit1
The browser console shows following content in the ERROR object:
error: "Permission denied. required permissions for this request are not given"
headers: t
lazyInit: ƒ ()
lazyUpdate: null
normalizedNames: Map(0) {}
__proto__: Object
message: "Http failure response for https://.../api/2sxc/cms/edit/load?appId=2: 403 OK"
name: "HttpErrorResponse"
ok: false
status: 403
statusText: "OK"
url: "https://.../api/2sxc/cms/edit/load?appId=2"
Edit2
After this I wanted to explore, if the behavior is 2sxc Content module related or if it is related to all apps (in my understanding the 2sxc Content module is an app too). I installed the "FAQ" app, granted the dnn "Edit" permission to the "Registered users" group and logged in as a registered user and pressed the edit icon on the 2scx toolbar - and had the same behavior like described in the origin post.
But: I got it running for the "FAQ" app, but not for the "Content" app. Here are my steps to get it running for the "FAQ" app:
click on "Apps management" (available in the dnn edit action or in the 2sxc toolbar)
"Features" - add feature - enable "Permission by Group / Role" - Activate feature
"Apps" - "FAQ" (or another except Content)
"App" - "App Permissions" (click on the icon) - "create new permission" - Identity=xx (xx=RoleId of the Group in table dbo.Roles) - Grant=Edit (in my case I want that the current registered user is able to edit an item) - Save (Ctrl+S)
After this I was able to edit the item of the "FAQ" module.
The "App Permissions" icon is disabled by default for the "Content" module on App level (and on view and data level too). Does anyone know if this is by design or is there a possibility to activate this option? Otherwise I have to migrate my content views to an app to get the permissions running.
Edit3
I ended up by migrating the content of the "Content" app to a new custom app. The effort is very less and getting the possibility to grant permissions was worth doing it.
In a conclusion I'll answer my question by myself. I suppose that the "Content" app has not the possibility granting the dedicated permissions. But the app itself has the posibility - so it could be a good idea, to create content inside an app.
Just some background: The content-app is meant for simple content and behaves differently from normal apps. Example:
when you add a content-app, the dialog asks for you to choose what content-type, and what view
when you add an app, the dialog asks you for which app, and then what view
Basically the content-app has various optimizations to make it lighter and simpler, but we wanted to prevent people from "shooting themselves in the foot" because they will usually start with content, and then make it increasingly complex (never separating different concerns) and end up with a big mess.
This is why the content-app has some forced limitations (like no app-permissions) to guide people to place more complex functionality in own apps.
Now note that this doesn't explain your original issue: apparently edit-permissions didn't work as expected. That seems to be a bug, not an intension. If you think that should be followed up, best create an issue on github.

Wagtail: How to use wagtailuserbar for moderation (approving and rejecting draft posts)

We are using the wagtailuserbar templatetag on our site and it works fine for published pages. We get the "Edit this page" and "View in admin" options etc.
The documentation says that wagtailuserbar can also be used by moderators to approve/reject drafts but I can't get this work.
Quote from the documentation:
Moderators are also given the ability to accept or reject a page being previewed as part of content moderation.
This screenshot shows the admin website with a page that has been submitted for moderation:
Clicking the preview link opens a new tab but the wagtail userbar is not visible.
If one instead uses the View Draft feature in the page explorer then again, new tab but no userbar.
Looking at the source code here these lines seem to remove the userbar for any preview view:
# Don't render if this is a preview. Since some routes can render the userbar without going through Page.serve(),
# request.is_preview might not be defined.
if getattr(request, 'is_preview', False):
return ''
My question is:
How can I use the wagtail userbar to approve or reject previews of pages submitted for moderation? The documentation suggests this is possible but experience and my understanding of the code suggests not.
It's a feature I'd really love to use.
Thanks for any help.
Thanks for this very clear description of the problem. I think this is a bug, which I've raised here:
https://github.com/wagtail/wagtail/issues/6008

DotNetNuke (DNN) and Hyperlink Manager "Track the number of times this link is clicked"

I have clients using the DNN CMS (Evoq Content 7.3.2) system and are questioning a specific area in the "Hyperlink Manager". There are two checkboxes (View image):
Track the number of times this link is clicked
Log the user, date and time for each click
If checked, where do we go to view these analytics?
I found resources online that mention we have to create an API for it, but are there any out-of-the-box solutions for this?
After some more researching, I solved my own problem and I wanted to share this with anyone who was looking for an answer to this.
For versions DNN 7.3.2 and lower, the Telerik RadTextEditor includes the feature as mentioned above. To view the analytics with an out-of-the-box method, simply return back to the link and open the "Hyperlink Manager" then navigate to the new tab called "Tracking".
Alternatively, I found developers can implement a control in a custom module called UrlControl. Refer to this link for more information: Link tracking information in html editor (DNN 7.1.2)
In DNN 8+, this feature no longer exists on the front-end UI. I'm not 100% sure if it's still usable or if this information gets migrated when upgrading from 7 to 8, though.

AngularJS application problems appearance in Google search

I have a personal project which consumes my free time and effort for about a year without significant profit. I have problems with it appearance in Google and would really appreciate to get help here.
This project (http://yuppi.com.ua - similar to craiglist in US) is WEB-based AngularJS 1.2 application that uses PHP rest API hosted on GoDaddy. And in order to make this application popular it have to be very visible in internet and very searchable in Google and users have to be able to share pages via social networks or skype.
According to Google specification, google crawlers doesn't run javascript to get content of a web page before index, so I've added _escaped_fragment_ page that displays content of web page without javascript. For example:
Page: http://yuppi.com.ua/#!/items/sub/18/_
Dirty : yuppi.com.ua/?_escaped_fragment_=/items/sub/18/_
This dirty page will be redirected here where google will see content.
http://yuppi.com.ua/server/crawler_proxy/routee.php?path=/items/sub/18/
So basically I have two versions on HTML file for that page. One version is the one that available to users, which has styles, a lot more HTML tags etc. And the second is the version for Google crawler - very light-weight without any styles. And I am expecting to see clean link to my site in Google, not dirty.
So, If to search all links to a web site in Google you will see that one of the links displays it's "dirty" state.
Another problem is sharing links in Skype.
When I send a link to someone, I am expecting that this link will be transformed to thumbnail image but it is not happens. Instead I see ungly link to my web site.
Please help me to understand how to make happy everyone: users, google crawler, GoDaddy and me.
I was encountering the same problems last year with a big project and we ended to use : https://prerender.io/.
It's a prerendering system that work with a phantomjs browser to detect bot request and render a full html template. It does also instanciate a cache service to not render again a template that haven't change.
Hope it help's.

Weird Content of Facebook share/like button preview from angular app

I have an issue with share/like button from Angular app. I finally made it working correctly with links but share/like preview if completely wrong. I tried XFBML.parse(), switching to html 5 mode, etc.
There are two complete enigmas:
1. I got "Given URL is not allowed by the Application configuration..." despite adding all possible variants to fb app setting.
When share preview appear - it has "Angular", but I never added it anywhere.
Here is the link
Would be grateful for any ideas...
Thx
The Facebook Scraper only looks at the HTML code your server delivers, it does not execute any JavaScript.
So if you want to share different articles, you need an individual URL for each article, that delivers the relevant meta data when requested from the server.
You can find some more explanation and hints on how to implement this in this article, http://www.michaelbromley.co.uk/blog/171/enable-rich-social-sharing-in-your-angularjs-app

Resources