From 6d91d1c79920d45c23a09d271cb30792899cab38 Mon Sep 17 00:00:00 2001 From: Baltazar Gomez Date: Thu, 5 Aug 2021 00:41:06 -0500 Subject: [PATCH 1/7] use resolve for og metadata --- web/src/html.js | 137 ++++++++++++++++++++++++++++-------------------- 1 file changed, 80 insertions(+), 57 deletions(-) diff --git a/web/src/html.js b/web/src/html.js index 508819834..2fb957644 100644 --- a/web/src/html.js +++ b/web/src/html.js @@ -9,11 +9,13 @@ const { SITE_DESCRIPTION, SITE_NAME, FAVICON, + LBRY_WEB_API, } = require('../../config.js'); + +const { Lbry } = require('lbry-redux'); const { generateEmbedUrl, generateStreamUrl, generateDirectUrl } = require('../../ui/util/web'); const PAGES = require('../../ui/constants/pages'); const { CATEGORY_METADATA } = require('./category-metadata'); -const { getClaim } = require('./chainquery'); const { parseURI } = require('lbry-redux'); const fs = require('fs'); const path = require('path'); @@ -21,6 +23,9 @@ const moment = require('moment'); const removeMd = require('remove-markdown'); const { getJsBundleId } = require('../bundle-id.js'); const jsBundleId = getJsBundleId(); +const SDK_API_PATH = `${LBRY_WEB_API}/api/v1`; +const PROXY_URL = `${SDK_API_PATH}/proxy`; +Lbry.setDaemonConnectionString(PROXY_URL); function insertToHead(fullHtml, htmlToInsert) { const beginStr = ''; @@ -122,20 +127,33 @@ function buildBasicOgMetadata() { function buildClaimOgMetadata(uri, claim, overrideOptions = {}) { // Initial setup for claim based og metadata const { claimName } = parseURI(uri); - const claimTitle = escapeHtmlProperty(claim.title ? claim.title : claimName); + const { meta, value, signing_channel } = claim; + const fee = value && value.fee && (Number(value.fee.amount) || 0); + const tags = value && value.tags; + const media = value && (value.video || value.audio || value.image); + const source = value && value.source; + const channel = signing_channel && signing_channel.name; + const thumbnail = value && value.thumbnail && value.thumbnail.url; + const mediaType = source && source.media_type; + const mediaDuration = media && media.duration; + const creationTimestamp = meta && (meta.creation_timestamp || 0); + const claimTitle = escapeHtmlProperty((value && value.title) || claimName); + const claimDescription = - claim.description && claim.description.length > 0 - ? escapeHtmlProperty(truncateDescription(claim.description)) + value && value.description && value.description.length > 0 + ? escapeHtmlProperty(truncateDescription(value.description)) : `View ${claimTitle} on ${SITE_NAME}`; - const claimLanguage = escapeHtmlProperty(claim.language) || 'en_US'; + + const claimLanguage = + value && value.languages && value.languages.length > 0 ? escapeHtmlProperty(value.languages[0]) : 'en_US'; let imageThumbnail; - if (Number(claim.fee) <= 0 && claim.source_media_type && claim.source_media_type.startsWith('image/')) { + if (fee <= 0 && mediaType && mediaType.startsWith('image/')) { imageThumbnail = generateStreamUrl(claim.name, claim.claim_id); } - const claimThumbnail = - escapeHtmlProperty(claim.thumbnail_url) || imageThumbnail || OG_IMAGE_URL || `${URL}/public/v2-og.png`; + + const claimThumbnail = escapeHtmlProperty(thumbnail) || imageThumbnail || OG_IMAGE_URL || `${URL}/public/v2-og.png`; // Allow for ovverriding default claim based og metadata const title = overrideOptions.title || claimTitle; @@ -148,8 +166,9 @@ function buildClaimOgMetadata(uri, claim, overrideOptions = {}) { head += ''; head += `${title}`; head += ``; - if (claim.tags) { - head += ``; + + if (tags && tags.length > 0) { + head += ``; } head += ``; @@ -165,33 +184,28 @@ function buildClaimOgMetadata(uri, claim, overrideOptions = {}) { head += ``; head += ``; - if ( - claim.source_media_type && - (claim.source_media_type.startsWith('video/') || claim.source_media_type.startsWith('audio/')) - ) { + if (mediaType && (mediaType.startsWith('video/') || mediaType.startsWith('audio/'))) { const videoUrl = generateEmbedUrl(claim.name, claim.claim_id); head += ``; head += ``; - head += ``; - if (claim.channel) { - head += ``; + head += ``; + if (channel) { + head += ``; } head += ``; head += ``; - if (claim.release_time) { - var release = new Date(claim.release_time * 1000).toISOString(); + if (creationTimestamp) { + var release = new Date(creationTimestamp * 1000).toISOString(); head += ``; } - if (claim.duration) { - head += ``; - } else if (claim.audio_duration) { - head += ``; + if (mediaDuration) { + head += ``; } - if (claim.frame_width && claim.frame_height) { - head += ``; - head += ``; - head += ``; - head += ``; + if (media && media.width && media.height) { + head += ``; + head += ``; + head += ``; + head += ``; } } else { head += ``; @@ -200,19 +214,27 @@ function buildClaimOgMetadata(uri, claim, overrideOptions = {}) { return head; } -function buildGoogleVideoMetadata(claimUri, claim) { - if (!claim.source_media_type || !claim.source_media_type.startsWith('video/')) { +function buildGoogleVideoMetadata(uri, claim) { + const { claimName } = parseURI(uri); + const { meta, value } = claim; + const media = value && (value.video || value.audio || value.image); + const source = value && value.source; + const thumbnail = value && value.thumbnail && value.thumbnail.url; + const mediaType = source && source.media_type; + const mediaDuration = media && media.duration; + const creationTimestamp = meta && (meta.creation_timestamp || 0); + const claimTitle = escapeHtmlProperty((value && value.title) || claimName); + + const claimDescription = + value && value.description && value.description.length > 0 + ? escapeHtmlProperty(truncateDescription(value.description)) + : `View ${claimTitle} on ${SITE_NAME}`; + + if (!mediaType || !mediaType.startsWith('video/')) { return ''; } - const { claimName } = parseURI(claimUri); - const claimTitle = escapeHtmlProperty(claim.title ? claim.title : claimName); - const claimDescription = - claim.description && claim.description.length > 0 - ? escapeHtmlProperty(truncateDescription(claim.description)) - : `View ${claimTitle} on ${SITE_NAME}`; - const claimThumbnail = escapeHtmlProperty(claim.thumbnail_url) || OG_IMAGE_URL || `${URL}/public/v2-og.png`; - const releaseTime = claim.release_time || 0; + const claimThumbnail = escapeHtmlProperty(thumbnail) || OG_IMAGE_URL || `${URL}/public/v2-og.png`; // https://developers.google.com/search/docs/data-types/video const googleVideoMetadata = { @@ -222,9 +244,9 @@ function buildGoogleVideoMetadata(claimUri, claim) { name: `${claimTitle}`, description: `${removeMd(claimDescription)}`, thumbnailUrl: `${claimThumbnail}`, - uploadDate: `${new Date(releaseTime * 1000).toISOString()}`, + uploadDate: `${new Date(creationTimestamp * 1000).toISOString()}`, // --- Recommended --- - duration: claim.duration ? moment.duration(claim.duration * 1000).toISOString() : undefined, + duration: mediaDuration ? moment.duration(mediaDuration * 1000).toISOString() : undefined, contentUrl: generateDirectUrl(claim.name, claim.claim_id), embedUrl: generateEmbedUrl(claim.name, claim.claim_id), }; @@ -242,24 +264,25 @@ function buildGoogleVideoMetadata(claimUri, claim) { ); } -async function getClaimFromChainqueryOrRedirect(ctx, url, ignoreRedirect = false) { +async function resolveClaimOrRedirect(ctx, url, ignoreRedirect = false) { + let claim; const { isChannel, streamName, channelName, channelClaimId, streamClaimId } = parseURI(url); const claimName = isChannel ? '@' + channelName : streamName; const claimId = isChannel ? channelClaimId : streamClaimId; - - const rows = await getClaim(claimName, claimId, channelName, channelClaimId); - if (rows && rows.length) { - const claim = rows[0]; - - if (claim.reposted_name && claim.reposted_claim_id && !ignoreRedirect) { - ctx.redirect(`/${claim.reposted_name}:${claim.reposted_claim_id}`); - return; + try { + const url = `lbry://${claimName}:${claimId}`; + const response = await Lbry.resolve({ urls: [url] }); + if (response && response[url] && !response[url].error) { + claim = response && response[url]; + if (claim.reposted_claim) { + if (claim.reposted_claim.name && claim.reposted_claim.claim_id && !ignoreRedirect) { + ctx.redirect(`/${claim.reposted_claim.name}:${claim.reposted_claim.claim_id}`); + return; + } + } } - - return claim; - } - - return undefined; + } catch {} + return claim; } let html; @@ -283,7 +306,7 @@ async function getHtml(ctx) { try { parseURI(inviteChannelUrl); - const claim = await getClaimFromChainqueryOrRedirect(ctx, inviteChannelUrl); + const claim = await resolveClaimOrRedirect(ctx, inviteChannelUrl); const invitePageMetadata = buildClaimOgMetadata(inviteChannelUrl, claim, { title: `Join ${claim.name} on ${SITE_NAME}`, description: `Join ${claim.name} on ${SITE_NAME}, a content wonderland owned by everyone (and no one).`, @@ -303,7 +326,7 @@ async function getHtml(ctx) { if (requestPath.includes(embedPath)) { const claimUri = requestPath.replace(embedPath, '').replace(/:/g, '#'); - const claim = await getClaimFromChainqueryOrRedirect(ctx, claimUri, true); + const claim = await resolveClaimOrRedirect(ctx, claimUri, true); if (claim) { const ogMetadata = buildClaimOgMetadata(claimUri, claim); @@ -326,7 +349,7 @@ async function getHtml(ctx) { if (!requestPath.includes('$')) { const claimUri = requestPath.slice(1).replace(/:/g, '#'); - const claim = await getClaimFromChainqueryOrRedirect(ctx, claimUri); + const claim = await resolveClaimOrRedirect(ctx, claimUri); if (claim) { const ogMetadata = buildClaimOgMetadata(claimUri, claim); From 45fcf0d5187ca5e706b3ed319e702ec89de902e8 Mon Sep 17 00:00:00 2001 From: btzr-io Date: Thu, 5 Aug 2021 00:56:06 -0500 Subject: [PATCH 2/7] use value.audio for google video metadata --- web/src/html.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/src/html.js b/web/src/html.js index 2fb957644..e9f6ff1ff 100644 --- a/web/src/html.js +++ b/web/src/html.js @@ -217,7 +217,7 @@ function buildClaimOgMetadata(uri, claim, overrideOptions = {}) { function buildGoogleVideoMetadata(uri, claim) { const { claimName } = parseURI(uri); const { meta, value } = claim; - const media = value && (value.video || value.audio || value.image); + const media = value && value.video; const source = value && value.source; const thumbnail = value && value.thumbnail && value.thumbnail.url; const mediaType = source && source.media_type; From 67f956f3a0571d33b5dbab43fbea1ec475216516 Mon Sep 17 00:00:00 2001 From: btzr-io Date: Thu, 5 Aug 2021 01:46:58 -0500 Subject: [PATCH 3/7] update changelog --- CHANGELOG.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 649813f47..90b588271 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -18,6 +18,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/). - Improve twitter share _community pr!_ ([#6690](https://github.com/lbryio/lbry-desktop/pull/6690)) - Update lighthouse search api _community pr!_ ([#6731](https://github.com/lbryio/lbry-desktop/pull/6731)) - Update sockety api _community pr!_ ([#6747](https://github.com/lbryio/lbry-desktop/pull/6747)) +- Use resolve for OG metadata instead of chainquery _community pr!_ ([#6787](https://github.com/lbryio/lbry-desktop/pull/6787)) ### Fixed - App now supports '#' and ':' for claimId separator ([#6496](https://github.com/lbryio/lbry-desktop/pull/6496)) @@ -29,6 +30,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/). - Fix yarn copyenv on windows _community pr!_ ([#6702](https://github.com/lbryio/lbry-desktop/pull/6702)) - Fix unnecessary livestream api calls in channel page _community pr!_ ([#6652](https://github.com/lbryio/lbry-desktop/pull/6652)) - Fix desktop app fails to resolve deep links _community pr!_ ([#6779](https://github.com/lbryio/lbry-desktop/pull/6779)) +- Fix wrong release date on GoogleVideo metadata _community pr!_ ([#6787](https://github.com/lbryio/lbry-desktop/pull/6787)) - Fix markdown line breaking mid word _community pr!_ ([#6805](https://github.com/lbryio/lbry-desktop/pull/6805)) - Added \ and = to reserved symbol warning _community pr!_ ([#6733](https://github.com/lbryio/lbry-desktop/pull/6733)) - Don't break words in chat + fix text overflow past 3 dot menu _community pr!_ ([#6602](https://github.com/lbryio/lbry-desktop/pull/6602)) From 722f9330528587c85df7e10ae795cb0537c3a6e0 Mon Sep 17 00:00:00 2001 From: btzr-io Date: Thu, 5 Aug 2021 20:28:12 -0500 Subject: [PATCH 4/7] use value.release_time --- web/src/html.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/web/src/html.js b/web/src/html.js index e9f6ff1ff..ccb6d8c91 100644 --- a/web/src/html.js +++ b/web/src/html.js @@ -136,8 +136,8 @@ function buildClaimOgMetadata(uri, claim, overrideOptions = {}) { const thumbnail = value && value.thumbnail && value.thumbnail.url; const mediaType = source && source.media_type; const mediaDuration = media && media.duration; - const creationTimestamp = meta && (meta.creation_timestamp || 0); const claimTitle = escapeHtmlProperty((value && value.title) || claimName); + const releaseTime = (value && value.release_time) || (meta && meta.creation_timestamp) || 0; const claimDescription = value && value.description && value.description.length > 0 @@ -194,8 +194,8 @@ function buildClaimOgMetadata(uri, claim, overrideOptions = {}) { } head += ``; head += ``; - if (creationTimestamp) { - var release = new Date(creationTimestamp * 1000).toISOString(); + if (releaseTime) { + var release = new Date(releaseTime * 1000).toISOString(); head += ``; } if (mediaDuration) { @@ -222,8 +222,8 @@ function buildGoogleVideoMetadata(uri, claim) { const thumbnail = value && value.thumbnail && value.thumbnail.url; const mediaType = source && source.media_type; const mediaDuration = media && media.duration; - const creationTimestamp = meta && (meta.creation_timestamp || 0); const claimTitle = escapeHtmlProperty((value && value.title) || claimName); + const releaseTime = (value && value.release_time) || (meta && meta.creation_timestamp) || 0; const claimDescription = value && value.description && value.description.length > 0 @@ -244,7 +244,7 @@ function buildGoogleVideoMetadata(uri, claim) { name: `${claimTitle}`, description: `${removeMd(claimDescription)}`, thumbnailUrl: `${claimThumbnail}`, - uploadDate: `${new Date(creationTimestamp * 1000).toISOString()}`, + uploadDate: `${new Date(releaseTime * 1000).toISOString()}`, // --- Recommended --- duration: mediaDuration ? moment.duration(mediaDuration * 1000).toISOString() : undefined, contentUrl: generateDirectUrl(claim.name, claim.claim_id), From 2c812da785caa84d8342b4b3e62ad1d486c65dc9 Mon Sep 17 00:00:00 2001 From: btzr-io Date: Thu, 5 Aug 2021 21:20:29 -0500 Subject: [PATCH 5/7] fix embed claim url --- web/src/html.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/src/html.js b/web/src/html.js index ccb6d8c91..65cf881b8 100644 --- a/web/src/html.js +++ b/web/src/html.js @@ -325,7 +325,7 @@ async function getHtml(ctx) { } if (requestPath.includes(embedPath)) { - const claimUri = requestPath.replace(embedPath, '').replace(/:/g, '#'); + const claimUri = requestPath.replace(embedPath, '').replace(/:/g, '#').replace('/', '#'); const claim = await resolveClaimOrRedirect(ctx, claimUri, true); if (claim) { From 68e4684ccd267abd572ad38272a8066f0b0d5490 Mon Sep 17 00:00:00 2001 From: btzr-io Date: Fri, 6 Aug 2021 23:10:14 -0500 Subject: [PATCH 6/7] use better resolve url --- web/src/html.js | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/web/src/html.js b/web/src/html.js index 65cf881b8..9070e9034 100644 --- a/web/src/html.js +++ b/web/src/html.js @@ -16,7 +16,7 @@ const { Lbry } = require('lbry-redux'); const { generateEmbedUrl, generateStreamUrl, generateDirectUrl } = require('../../ui/util/web'); const PAGES = require('../../ui/constants/pages'); const { CATEGORY_METADATA } = require('./category-metadata'); -const { parseURI } = require('lbry-redux'); +const { parseURI, buildURI } = require('lbry-redux'); const fs = require('fs'); const path = require('path'); const moment = require('moment'); @@ -266,11 +266,10 @@ function buildGoogleVideoMetadata(uri, claim) { async function resolveClaimOrRedirect(ctx, url, ignoreRedirect = false) { let claim; - const { isChannel, streamName, channelName, channelClaimId, streamClaimId } = parseURI(url); - const claimName = isChannel ? '@' + channelName : streamName; - const claimId = isChannel ? channelClaimId : streamClaimId; + const parsedURI = parseURI(url); + try { - const url = `lbry://${claimName}:${claimId}`; + const url = buildURI(parsedURI); const response = await Lbry.resolve({ urls: [url] }); if (response && response[url] && !response[url].error) { claim = response && response[url]; From c85e448499ed669256fd37e9a057aa071703cecf Mon Sep 17 00:00:00 2001 From: btzr-io Date: Sat, 7 Aug 2021 04:00:33 -0500 Subject: [PATCH 7/7] fix redirection and normalization of claim urls --- ui/page/show/view.jsx | 8 ++++++-- web/src/html.js | 28 +++++++++++++--------------- 2 files changed, 19 insertions(+), 17 deletions(-) diff --git a/ui/page/show/view.jsx b/ui/page/show/view.jsx index a1b807496..10fd38710 100644 --- a/ui/page/show/view.jsx +++ b/ui/page/show/view.jsx @@ -12,10 +12,13 @@ import Card from 'component/common/card'; import { formatLbryUrlForWeb } from 'util/url'; import { parseURI, COLLECTIONS_CONSTS } from 'lbry-redux'; -const AbandonedChannelPreview = lazyImport(() => import('component/abandonedChannelPreview' /* webpackChunkName: "abandonedChannelPreview" */)); +const AbandonedChannelPreview = lazyImport(() => + import('component/abandonedChannelPreview' /* webpackChunkName: "abandonedChannelPreview" */) +); const FilePage = lazyImport(() => import('page/file' /* webpackChunkName: "filePage" */)); const LivestreamPage = lazyImport(() => import('page/livestream' /* webpackChunkName: "livestream" */)); const Yrbl = lazyImport(() => import('component/yrbl' /* webpackChunkName: "yrbl" */)); +const isDev = process.env.NODE_ENV !== 'production'; type Props = { isResolvingUri: boolean, @@ -85,7 +88,8 @@ function ShowPage(props: Props) { const canonicalUrlPath = '/' + canonicalUrl.replace(/^lbry:\/\//, '').replace(/#/g, ':'); // Only redirect if we are in lbry.tv land // replaceState will fail if on a different domain (like webcache.googleusercontent.com) - if (canonicalUrlPath !== window.location.pathname && DOMAIN === window.location.hostname) { + const hostname = isDev ? 'localhost' : DOMAIN; + if (canonicalUrlPath !== window.location.pathname && hostname === window.location.hostname) { const urlParams = new URLSearchParams(search); if (urlParams.get(COLLECTIONS_CONSTS.COLLECTION_ID)) { const listId = urlParams.get(COLLECTIONS_CONSTS.COLLECTION_ID) || ''; diff --git a/web/src/html.js b/web/src/html.js index 9070e9034..724bcc4f4 100644 --- a/web/src/html.js +++ b/web/src/html.js @@ -16,7 +16,7 @@ const { Lbry } = require('lbry-redux'); const { generateEmbedUrl, generateStreamUrl, generateDirectUrl } = require('../../ui/util/web'); const PAGES = require('../../ui/constants/pages'); const { CATEGORY_METADATA } = require('./category-metadata'); -const { parseURI, buildURI } = require('lbry-redux'); +const { parseURI, normalizeURI } = require('lbry-redux'); const fs = require('fs'); const path = require('path'); const moment = require('moment'); @@ -45,6 +45,10 @@ function truncateDescription(description) { return description.length > 200 ? description.substr(0, 200) + '...' : description; } +function normalizeClaimUrl(url) { + return normalizeURI(url.replace(/:/g, '#')); +} + function escapeHtmlProperty(property) { return property ? String(property) @@ -266,18 +270,14 @@ function buildGoogleVideoMetadata(uri, claim) { async function resolveClaimOrRedirect(ctx, url, ignoreRedirect = false) { let claim; - const parsedURI = parseURI(url); - try { - const url = buildURI(parsedURI); const response = await Lbry.resolve({ urls: [url] }); if (response && response[url] && !response[url].error) { claim = response && response[url]; - if (claim.reposted_claim) { - if (claim.reposted_claim.name && claim.reposted_claim.claim_id && !ignoreRedirect) { - ctx.redirect(`/${claim.reposted_claim.name}:${claim.reposted_claim.claim_id}`); - return; - } + const isRepost = claim.reposted_claim && claim.reposted_claim.name && claim.reposted_claim.claim_id; + if (isRepost && !ignoreRedirect) { + ctx.redirect(`/${claim.reposted_claim.name}:${claim.reposted_claim.claim_id}`); + return; } } } catch {} @@ -300,11 +300,9 @@ async function getHtml(ctx) { const embedPath = `/$/${PAGES.EMBED}/`; if (requestPath.includes(invitePath)) { - const inviteChannel = requestPath.slice(invitePath.length).replace(/:/g, '#'); - const inviteChannelUrl = `lbry://${inviteChannel}`; - try { - parseURI(inviteChannelUrl); + const inviteChannel = requestPath.slice(invitePath.length); + const inviteChannelUrl = normalizeClaimUrl(inviteChannel); const claim = await resolveClaimOrRedirect(ctx, inviteChannelUrl); const invitePageMetadata = buildClaimOgMetadata(inviteChannelUrl, claim, { title: `Join ${claim.name} on ${SITE_NAME}`, @@ -324,7 +322,7 @@ async function getHtml(ctx) { } if (requestPath.includes(embedPath)) { - const claimUri = requestPath.replace(embedPath, '').replace(/:/g, '#').replace('/', '#'); + const claimUri = normalizeClaimUrl(requestPath.replace(embedPath, '')); const claim = await resolveClaimOrRedirect(ctx, claimUri, true); if (claim) { @@ -347,7 +345,7 @@ async function getHtml(ctx) { } if (!requestPath.includes('$')) { - const claimUri = requestPath.slice(1).replace(/:/g, '#'); + const claimUri = normalizeClaimUrl(requestPath.slice(1)); const claim = await resolveClaimOrRedirect(ctx, claimUri); if (claim) {