Skip to content

Instantly share code, notes, and snippets.

@mreigen

mreigen/app.js

Last active April 10, 2018 17:38
Show Gist options
  • Save mreigen/4dc8effec8186315c3aac4ce6da46c9a to your computer and use it in GitHub Desktop.
Save mreigen/4dc8effec8186315c3aac4ce6da46c9a to your computer and use it in GitHub Desktop.
Download ZIP
Goal: 1) To remove the # hash from the url. 2) Shareable on Facebook, twitter... with dynamic meta tags
Raw
app.js
//AngularJS app
.config( function myAppConfig ($locationProvider) {
$locationProvider.html5Mode(true);
...
}
Raw
index.html
<!-- AngularJS app -->
<head>
<base href="/">
</head>
Raw
nginx.conf
# NGINX location block
# this will PROXY-ly map (not 301 redirect) all the crawling requests from facebook, twitter bots... to the server that hosts
# the template for sharing. On the template, we will diplay only the meta tags in the head (See the template file in this same gist)
# This block goes first
location /kids {
if ($http_user_agent ~* "facebookexternalhit/[0-9]|Twitterbot|Pinterest|Google.*snippet") {
rewrite ^/kids/(.*) /kids/$1/share_for_proxy_passing break;
proxy_pass http://the-server-that-hosts-the-template-share-for-proxy-passing.com;
}
rewrite ^/kids/(.*)$ /#/kids/$1 last;
}
# Then this
location / {
try_files $uri /index.html;
}
Raw
server_share_for_proxy_pass_template.html.erb
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<!-- for Google -->
<meta name="description" content="BLAH" />
<meta name="keywords" content="<%= @kid.rating.tip.gsub(',', '').split(/[^\\dA-Za-z]/).join(', ') %>" />
<meta name="author" content="<%= @kid.rating.user.full_name %>" />
<link href="https://www.facebook.com/rate-your-kids" rel="publisher" />
<link rel="canonical" href="http://rate-your-kids.com/kids/<%= @kid.slug %>" />
<meta name="application-name" content="Rate your kids" />
<!-- for Facebook -->
<meta property="fb:app_id" content="<%= ENV['FACEBOOK_KEY_PROD'] %>" />
<meta property="article:publisher" content="https://www.facebook.com/rate-your-kids" />
<meta property="article:published_time" content="<%= @kid.rating.created_at %>" />
<meta property="og:updated_time" content="<%= @kid.rating.updated_at %>" />
<meta property="og:title" content="<%= @kid.name %>" />
<meta property="og:type" content="article" />
<meta property="og:image" content="<%= @kid.rating.image_url %>" />
<meta property="og:image:width" content="1280" />
<meta property="og:image:height" content="720" />
<meta property="og:url" content="http://rate-your-kids.com/kids/<%= @kid.slug %>" />
<meta property="og:description" content="<%= @kid.rating.user.full_name %>: '<%= @kid.rating.tip %>'" />
<meta property="og:author" content="<%= @kid.rating.user.full_name %>" />
<meta property="og:see_also" content="<%= Kid.where(featured: true).first.share_url %>" />
<!-- same thing for Twitter -->
</head>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment