As per the subject, I am trying to have cheerio loop over the an elements in a htmlstring and extract the href attributes.
in the following example the .each never runs.
const cheerio = require('cheerio');
const htmlparser2 = require('htmlparser2');
var htmlstring = '<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml" lang="da" ng-app="sdk.portal"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0"><meta sdk-core-metatags-directive><title data-ng-bind="metaTagVm.titleTag"></title><link rel="stylesheet" type="text/css" href="/public/css/sdk-06a073b7f6.styleguide.css"><link rel="stylesheet" type="text/css" href="/public/css/sdk-2f8a814242.styleguide-blessed1.css"><link rel="apple-touch-icon" sizes="180x180" href="../../public/images/apple-touch-icon.png"><link rel="icon" type="image/png" href="../../public/images/favicon-32x32.png" sizes="32x32"><link rel="icon" type="image/png" href="../../public/images/favicon-16x16.png" sizes="16x16"><link rel="manifest" href="/manifest.json"><link rel="mask-icon" href="../../public/images/safari-pinned-tab.svg" color="#b20c1c"><meta name="msapplication-TileColor" content="#b20c1c"><meta name="msapplication-TileImage" content="../../public/images/mstile-144x144.png"><meta name="theme-color" content="#ffffff"><script src="/public/js/vendor-f84d227302.js"></script><script src="/public/js/sdk-a8dae725ad.bundle.js"></script><base href="/" /><sdk-core-analytics></sdk-core-analytics></head><body><div><div ui-view="coreView"><div style="width: 30%; margin-left: auto; margin-right: auto; text-align: center"><!--[if lt IE 9]><h2>Opdatér din browser for at bruge sundhed.dk</h2><p>Det ser ud til, at du bruger et browser-program af ældre dato.<br/>Sundhed.dk’s mange funktioner kræver nu en nyere browser.</p><p/>Download en opdateret browser her: <hr/>Internet Explorer<hr/>Chrome<hr/>Firefox<hr/>Opera</p><![endif]--><!--[if (gte IE 9) | (!IE)]><p>Vent et øjeblik</p><![endif]--></div></div></div><div id="includes"><div id="includePlaceholder"></div></div></body></html>';
var dom = htmlparser2.parseDOM(htmlstring);
var $ = cheerio.load(dom);
$('a').each(function(idx, el) {
console.log('in each');
var $el = $(el);
var att = $el.attr('href');
console.log(att);
});
If I try to see what $('a') gives me it is the following object:
initialize {
options:
{ withDomLvl1: true,
normalizeWhitespace: false,
xml: false,
decodeEntities: true },
_root:
initialize {
'0':
{ type: 'root',
name: 'root',
namespace: 'http://www.w3.org/1999/xhtml',
attribs: {},
'x-attribsNamespace': {},
'x-attribsPrefix': {},
children: [Object],
parent: null,
prev: null,
next: null },
options:
{ withDomLvl1: true,
normalizeWhitespace: false,
xml: false,
decodeEntities: true },
length: 1,
_root: [Circular] },
length: 0,
prevObject:
initialize {
'0':
{ type: 'root',
name: 'root',
namespace: 'http://www.w3.org/1999/xhtml',
attribs: {},
'x-attribsNamespace': {},
'x-attribsPrefix': {},
children: [Object],
parent: null,
prev: null,
next: null },
options:
{ withDomLvl1: true,
normalizeWhitespace: false,
xml: false,
decodeEntities: true },
length: 1,
_root: [Circular] } }
this looks like it is the cheerio options object, so what am I doing wrong and is it in fact a bug with cheerio as I suspect because it sure seems like I'm doing things the way I'm expected to.
I asked about this out on cheeriojs https://github.com/cheeriojs/cheerio/issues/1063 and someone pointed out all the links were inside of a conditional comment, so my code should have been
const cheerio = require('cheerio');
const htmlparser2 = require('htmlparser2');
var htmlstring = '<html lang="da"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0"><meta sdk-core-metatags-directive><title data-ng-bind="metaTagVm.titleTag"></title><link rel="stylesheet" type="text/css" href="/public/css/sdk-06a073b7f6.styleguide.css"><link rel="stylesheet" type="text/css" href="/public/css/sdk-2f8a814242.styleguide-blessed1.css"><link rel="apple-touch-icon" sizes="180x180" href="../../public/images/apple-touch-icon.png"><link rel="icon" type="image/png" href="../../public/images/favicon-32x32.png" sizes="32x32"><link rel="icon" type="image/png" href="../../public/images/favicon-16x16.png" sizes="16x16"><link rel="manifest" href="/manifest.json"><link rel="mask-icon" href="../../public/images/safari-pinned-tab.svg" color="#b20c1c"><meta name="msapplication-TileColor" content="#b20c1c"><meta name="msapplication-TileImage" content="../../public/images/mstile-144x144.png"><meta name="theme-color" content="#ffffff"><script src="/public/js/vendor-f84d227302.js"></script><script src="/public/js/sdk-a8dae725ad.bundle.js"></script><base href="/" /><sdk-core-analytics></sdk-core-analytics></head><body><div><div ui-view="coreView"><div style="width: 30%; margin-left: auto; margin-right: auto; text-align: center"><h2>Opdatér din browser for at bruge sundhed.dk</h2><p>Det ser ud til, at du bruger et browser-program af ældre dato.<br/>Sundhed.dk’s mange funktioner kræver nu en nyere browser.</p><p/>Download en opdateret browser her: <hr/>Internet Explorer<hr/>Chrome<hr/>Firefox<hr/>Opera</p><!--[if (gte IE 9) | (!IE)]><p>Vent et øjeblik</p><![endif]--></div></div></div><div id="includes"><div id="includePlaceholder"></div></div></body></html>';
var dom = htmlparser2.parseDOM(htmlstring);
var $ = cheerio.load(dom);
$('a').each(function(idx, el) {
console.log('in each');
var $el = $(el);
var att = $el.attr('href');
console.log(att);
});
Related
I ran my server with python manage.py runserver and for some reason it started displaying as plain text. When I run it as a live server it comes out normal. I have no idea what I changed that messed it up. Seems like a longshot but if anyone has encountered the same problem please let me know.
For some reason, when I run it in the django liveserver, it is all wrapped in a pre tag
Here is the full html code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
{% load static %}
<link rel="stylesheet" href="{% static 'pictures.css' %}">
<link rel="stylesheet" href="{% static 'my_albums.css' %}">
<link rel="stylesheet" href="{% static 'other.css' %}">
<link rel="stylesheet" href="{% static 'text.css' %}">
<link rel="stylesheet" href="{% static 'header_stuff2.css' %}">
<script>
let album_list = []
function display_albums(){
document.getElementById('album_table').innerHTML = ''
table_header = document.createElement('tr')
table_album_header = document.createElement('th')
table_artist_header = document.createElement('th')
table_date_header = document.createElement('th')
table_score_header = document.createElement('th')
table_album_header.innerText = 'Album'
table_artist_header.innerText = 'Artist'
table_date_header.innerText = 'Date'
table_score_header.innerText = 'Score'
let album_location = document.getElementById('album_table')
album_location.appendChild(table_header)
table_header.appendChild(table_album_header)
table_header.appendChild(table_artist_header)
table_header.appendChild(table_date_header)
table_header.appendChild(table_score_header)
album_list.forEach(function (album){
table_row = document.createElement('tr')
album_collumn = document.createElement('td')
artist_collumn = document.createElement('td')
date_collumn = document.createElement('td')
score_collumn = document.createElement('td')
delete_button_button = document.createElement('button')
delete_button_button.innerText = "Delete"
delete_button_button.id = album.id
delete_button_button.onclick = delete_album;
score_box = document.createElement('select')
score_box.innerText = "Score"
score_box.id = album.album_name + '' + '_select'
score_box.onclick = validate(album.album_name + '' + '_select')
score_option_default = document.createElement('option')
album_collumn.innerText = album.album_name
artist_collumn.innerText = album.artist
date_collumn.innerText = album.release_date
let album_location = document.getElementById('album_table')
album_location.appendChild(table_row)
table_row.appendChild(album_collumn)
table_row.appendChild(artist_collumn)
table_row.appendChild(date_collumn)
table_row.appendChild(score_collumn)
table_row.appendChild(delete_button_button)
score_collumn.appendChild(score_box)
score_box.appendChild(score_option_default)
option_counter = 0
while(option_counter != 11){
sc_o1 = document.createElement('option')
sc_o1.innerText = option_counter
sc_o1.value = option_counter
option_counter++
score_box.appendChild(sc_o1)
sc_o1.id = album.album_name + '' + option_counter.toString()
}
})
}
function validate(select_id){
var selected_select = document.getElementById(select_id)
console.log(select_id)
var selected_value = selected_select.options[selected_select.selectedIndex].value
alert(selected_value+''+'gang')
}
function update_score(){
album_list.forEach(function (album){
var select_thing = document.getElementById(album.album_name+''+'_select')
album.score = selected_select.options[selected_select.selectedIndex].value
})
}
document.addEventListener('DOMContentLoaded', () => {
document
.getElementById('flavours')
.addEventListener('input', handleSelect);
document.getElementById('thing').addEventListener('input', handleData);
});
function handleSelect(ev) {
let select = ev.target; //document.getElementById('flavours');
console.log(select.value);
let choices = [];
// for (let i = 0; i < select.selectedOptions.length; i++) {
// choices.push(select.selectedOptions[i].value);
// }
choices = [].map.call(select.selectedOptions, (option) => option.value);
console.log(choices);
}
function handleData(ev) {
let theInput = ev.target;
console.log(theInput.value, typeof theInput.value);
}
/*album_collumn = table_row.createElement('td')
artist_collumn = table_row.createElement('td')
date_collumn = table_row.createElement('td')
album_collumn.innerText = album.album_name
artist_collumn.innerText = album.artist
date_collumn.innerText = album.release_date
*/
function add_albums(){
album_name = document.getElementById('addedInput').value
album_list.push({
album_name: album_name,
artist: "Aidan Stone",
release_date: 2022,
score: NaN,
id: album_name
});
display_albums();
update_score();
}
function delete_album(event){
const delete_button = event.target
const idToDelete = delete_button.id
album_list = album_list.filter(function (album){
if (album.id === idToDelete){
return false
}
else{
return true
}
})
display_albums();
}
</script>
</head>
<body style="
height:3000px;
">
<header class="header">
<div class="search_bar_section">
<form class="search_bar" >
<div ><input class="search_bar_cool" type="text" placeholder="Search"></div>
<img class="search_bar_button" src="pictures/search_bar.jpg">
<!-- When I make it a button it fucks up the shape? -->
</form>
</div>
<div class="header_section">
<div class="nav_stuff">
<li><span>Home</span></li>
<li><span>Add Albums</span></li>
<li><span>About Me</span></li>
<li><span>Other idk</span></li>
<li><span>Other idk</span></li>
</div>
</div>
<div class="profile_section">
<img class="pfp" src="pictures/gkmc.jpg">
</div>
</header>
<body>
<div>
<table border="10" width="100" class="album_table" id="album_table">
<tr>
<th>Album</th>
<th>Artist</th>
<th>Average Score</th>
<th>Score</th>
</tr>
</table>
</div>
<div class="form">
<input type="text" placeholder="Search" id="addedInput",class = "Searchbar">
<button type="button" id="addBtn" onclick="add_albums()"></button>
</div>
<body>
You are not closing html tag. Please use the body tag once. Keep coding standard
I'm using Kanna to traverse a HTML of a website looking for <script type="application:ld+json">.
func scrapeRecipe(from data: Data) {
let html = String(data: data, encoding: .utf8)
do {
let document = try HTML(html: html!, encoding: .utf8)
let script = document.xpath("//script[#type='application/ld+json']//text()")
for recipeJSON in script {
let data = recipeJSON.text?.data(using: .utf8)
let json = try? JSONSerialization.jsonObject(with: data!, options: [])
//Handling fetched data here
}
} catch {
//Handle Error
}
}
The issue I am coming across, that on some websites, the let document = try HTML(html: html!, encoding: .utf8) step somehow removes the node notations, but doesn't on others.
The case in point: the original HTML:
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta name='robots' content='max-image-preview:large, index, follow, max-snippet:-1, max-video-preview:-1'/>
<script>
(function(w, d) {
w.adthrive = w.adthrive || {};
w.adthrive.cmd = w.adthrive.cmd || [];
w.adthrive.plugin = 'adthrive-ads-1.0.43';
w.adthrive.host = 'ads.adthrive.com';
var s = d.createElement('script');
s.async = true;
s.referrerpolicy = 'no-referrer-when-downgrade';
s.src = 'https://' + w.adthrive.host + '/sites/55cb7e3b4bc841bd0c4ea577/ads.min.js?referrer=' + w.encodeURIComponent(w.location.href);
var n = d.getElementsByTagName('script')[0];
n.parentNode.insertBefore(s, n);
})(window, document);
</script>
<!-- This site is optimized with the Yoast SEO Premium plugin v15.9.1 - https://yoast.com/wordpress/plugins/seo/ -->
<title>Apple Salad with Candied Walnuts and Cranberries | RecipeTin Eats</title>
<meta name="description" content="This Apple Salad is a celebration of textures and flavours! Crispy juicy apple, leafy salad, candied walnuts, plumped cranberries with a vinaigrette."/>
<link rel="canonical" href="https://www.recipetineats.com/apple-salad-candied-walnuts-cranberries/"/>
<meta name="twitter:label1" content="Written by">
<meta name="twitter:data1" content="Nagi">
<meta name="twitter:label2" content="Est. reading time">
<meta name="twitter:data2" content="5 minutes">
<script type="application/ld+json" class="yoast-schema-graph">{ ... }</script>
And the parsed document.text returns for the same section for the document:
(function(w, d) {
w.adthrive = w.adthrive || {};
w.adthrive.cmd = w.adthrive.cmd || [];
w.adthrive.plugin = 'adthrive-ads-1.0.43';
w.adthrive.host = 'ads.adthrive.com';
var s = d.createElement('script');
s.async = true;
s.referrerpolicy='no-referrer-when-downgrade';
s.src = 'https://' + w.adthrive.host + '/sites/55cb7e3b4bc841bd0c4ea577/ads.min.js?referrer=' + w.encodeURIComponent(w.location.href);
var n = d.getElementsByTagName('script')[0];
n.parentNode.insertBefore(s, n);
})(window, document);
Apple Salad with Candied Walnuts and Cranberries | RecipeTin Eats
{ ... }
... is what I want to extract, but with the nodes gone I cannot call on this block. I've abbreviated it for clarity of this post.
Has anyone else experienced this with only some websites when using Kanna? The above swift code works fine with 9 out of 10 websites.
I am working on connecting to the Shopify API however the way it is structured for access is apikey:password#storename.myshopify.com
Apps script however will not allow you to use a URL with the login credentials for the UrlFetchApp.fetch function 12345:67890#storename.myshopify.com and I seem unable to pass the information through successfully via the basic headers.
function shopify_connect() {
var url = "https://storename.myshopify.com/admin/products.json/GET";
var apikey = '12345';
var password = '67890';
var headers = {
"User-Agent" :"info#website.com",
"Authentication" : 'Basic ' + Utilities.base64Encode(apikey + ':' + password)
}
var options = {
"headers": headers,
}
var response = UrlFetchApp.fetch(url, options);
}
When I log the output from response, it appears that I am getting to the login HTML however never passing beyond that.
Any help in clarifying this access method would be greatly appreciated.
Logger Response:
[19-01-01 12:09:54:516 EST] <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Shopify » Please log in</title>
<meta name="referrer" content="never" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="icon" sizes="192x192" href="//cdn.shopify.com/s/assets/touch-icons/touch-icon-192x192-840b11274adbc510a1db23976759bd31ceee84ddbb36478d494a3a2cf19b5ae6.png" />
<link rel="shortcut icon" type="image/x-icon" href="//cdn.shopify.com/s/assets/favicon-4425e7970f1327bc362265f54e8c9c6a4e96385b3987760637977078e28ffe92.png" />
<link rel="apple-touch-startup-image" href="//cdn.shopify.com/s/assets/touch-icons/mobile-startup-564eed49b6c483b80796f529e05b4bf1d54e9cd9beeb0bb89b10d3c6a2282ea6.png" />
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="//cdn.shopify.com/s/assets/touch-icons/icon-114x114-precomposed-79d1c57f01b233f016319dc4048d90524e9ce252c058a306ef9db2216ab26911.png" />
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="//cdn.shopify.com/s/assets/touch-icons/icon-72x72-precomposed-584c35aa679456ab4e2f1cd971191498d7fecf7321b4ded8bae5c5a2c51176e3.png" />
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="//cdn.shopify.com/s/assets/touch-icons/icon-57x57-precomposed-49c0927bd56de30bc28439aed87097b7c8e41f2bb4f00661f01a00729c2a1b77.png" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, user-scalable=0" />
<link rel="stylesheet" media="screen" href="//cdn.shopify.com/s/assets/dialog-fresh-66526625df0ed5b32afd82a4e7ae3a843a721051c14cdf0f5add5ea1e7988b07.css" crossorigin="anonymous" data-turbolinks-track="true" integrity="sha256-ZlJmJd8O1bMq/YKk5646hDpyEFHBTN8PWt1eoeeYiwc=" />
</head>
<body class="page-auth-login fresh-ui">
<div id="container">
<noscript class="no-js">
In order to use the Shopify admin you need to enable Javascript. <a target="_blank" href="https://www.enable-javascript.com/">Learn how to enable Javascript</a>.
</noscript>
<main role="main" id="dialog-alternate">
<div class="login-form">
<h1 class="dialog-heading">Runeworks Development</h1>
<h2 class="dialog-subheading">Log in to manage your store</h2>
<form class="lookup-form" action="/admin/auth/login" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="✓" /><input type="hidden" name="authenticity_token" value="o+iwLU/BJDawX3A5Pnpa9S0MCn7CIdhzXoPqXvJoiizZp6sK4FRsLRo6IIAUUAJI5mUgIoFyOpSNqswZJfKRdg==" />
<div id="email-login">
<div class="clearfix">
<div class="login-container">
<div class="lform dialog-form">
<div class="require-cookies">
<div class="ui-banner ui-banner--status-critical ui-banner--within-page">
<div class="ui-banner__ribbon"><svg class="next-icon next-icon--size-20 next-icon--no-nudge" aria-hidden="true" focusable="false"> <use xlink:href="#error-major" /> </svg></div><div class="ui-banner__content-container"><div class="ui-banner__heading"><h2 class="ui-heading">Please enable cookies in your browser preferences to continue.</h2></div></div></div> </div>
</div>
<div id="sign-in-form" class="lform dialog-form">
<input type="hidden" name="redirect" value="" id="redirect" />
<input type="hidden" name="step" value="lookup" />
<div id="login">
<div class="input-group">
<div class="next-input-wrapper"><label class="next-label" for="Login">Email</label><input type="email" name="login" id="Login" spellcheck="false" autofocus="autofocus" required="required" class="next-input" /></div>
<div class="next-input-wrapper"><label class="next-label helper--visually-hidden" for="Password">Password</label><input type="password" name="password" id="Password" class="next-input hidden-password" tabindex="-1" placeholder="Password" spellcheck="false" /></div>
</div>
</div> <!-- /#login -->
<button class="ui-button ui-button--primary ui-button--full-width dialog-submit" type="submit" name="commit" id="EmailConfirm">Continue</button>
</div> <!-- /#sign-in-form -->
<div id="remember-me" class="remember-me">
<input type="hidden" name="remember" id="remember_checkbox_default" value="0" />
<div class="next-input-wrapper"><label class="next-label next-label--switch" for="remember_checkbox">Keep me logged in</label><input type="checkbox" name="remember" id="remember_checkbox" value="1" class="next-checkbox" checked="checked" /><span class="next-checkbox--styled"><svg class="next-icon next-icon--size-10 checkmark" aria-hidden="true" focusable="false"> <use xlink:href="#next-checkmark-thick" /> </svg></span></div>
</div>
</div>
</div>
</div>
<div id="other-login">
</div>
</form>
<script type="text/javascript">
if (typeof window.analytics !== 'undefined') {
window.analytics.trackForm($('[action="/admin/auth/login"]')[0], 'login', {
category: 'login',
subdomain: "runeworks-development.myshopify.com"
});
}
if (!navigator.cookieEnabled) {
$('.require-cookies').show();
}
var showContinueButton = document.querySelector('.email-login a');
if (showContinueButton instanceof HTMLElement) {
showContinueButton.addEventListener('click', showLoginWithEmailBox.bind(this, true));
}
function showLoginWithEmailBox(show) {
var continueButton = document.querySelector('.dialog-submit');
var display = show ? '' : 'none';
document.getElementById('login').style.display = display;
if (continueButton instanceof HTMLElement) {
continueButton.style.display = display;
}
if (showContinueButton instanceof HTMLElement) {
showContinueButton.style.display = show ? 'none' : '';
}
}
(function (){
var ssoEnabled = false;
if (ssoEnabled) {
showLoginWithEmailBox(false)
}
})();
</script>
</div>
</main>
<footer role="contentinfo" id="footer">
<a target="_blank" class="ico ico-shopify-bag" href="//www.shopify.com">
<span class="helper--visually-hidden">Shopify.com</span>
</a> </footer>
</div>
<script src="//cdn.shopify.com/s/assets/admin/admin_jquery-1f0f820501c3b7fcb70379d8fa17d2fcfdb3722abc2a5eeedac0f05bfef7705c.js" crossorigin="anonymous" integrity="sha256-Hw+CBQHDt/y3A3nY+hfS/P2zciq8Kl7u2sDwW/73cFw="></script>
<script src="//cdn.shopify.com/s/assets/admin/auth-af2f48596342908db2529c61a0cfcb59fa7feff59591946bdd8caad81b7abc64.js" crossorigin="anonymous" integrity="sha256-ry9IWWNCkI2yUpxhoM/LWfp/7/WVkZRr3Yyq2Bt6vGQ="></script>
<script>var _gaq = _gaq || [];_gaq.push(["_setAccount","UA-82702-18"]);_gaq.push(["_addDevId","o5cUG"]);_gaq.push(["_setAllowLinker",true]);_gaq.push(["_setDomainName",".myshopify.com"]);_gaq.push(["_setAllowHash",false]);_gaq.push(["_trackPageview","\/admin\/auth\/login"]);</script>
<script id="TrekkieLoader" type="text/javascript">
(function(){
var config = {"Trekkie":{"appName":"admin","development":false,"embedMode":"parent","defaultAttributes":{"shopId":16037216320,"requestIsFromShopify":false}},"Clickstream":{"appName":"admin"},"Performance":{"navigationTimingApiMeasurementsEnabled":true,"navigationTimingApiMeasurementsSampleRate":0.25},"Session Attribution":{},"LastShop":{}};
var trekkie_version = '2017.09.05.1';
var analytics = window.analytics = window.analytics || [];
if (analytics.integrations) {
return;
}
analytics.methods = [
'identify',
'page',
'ready',
'track',
'trackForm',
'trackLink'
];
analytics.factory = function(method) {
return function() {
var args = Array.prototype.slice.call(arguments);
args.unshift(method);
analytics.push(args);
return analytics;
};
};
for (var i = 0; i < analytics.methods.length; i++) {
var key = analytics.methods[i];
analytics[key] = analytics.factory(key);
}
analyt
So after working with it further, taking another look at the example Cooper referenced, I was able to get the connection to process correctly.
Here is the code in the event that someone else has the same issue in the future:
function shopify_connection_test() {
var api_key = '<enter api key here';
var api_pass = '<enter api password here>';
var store_url = 'https://storename.myshopify.com/admin/products.json';
var product = {
"product": {
"title": "Burton Custom Freestyle 151",
"body_html": "<strong>Good snowboard!</strong>",
"vendor": "Burton",
"product_type": "Snowboard",
"tags": "Barnes & Noble, John's Fav, \"Big Air\""
}
}
var payload = JSON.stringify(product);
var headers = {
"Content-Type" : "application/json",
"Authorization": "Basic " + Utilities.base64Encode(api_key + ":" + api_pass)
};
var params = {
"method" : "POST",
"headers" : headers,
"contentType" : "application/json",
"payload" : payload
}
var response = UrlFetchApp.fetch(store_url, params)
Logger.log(response.getContentText())
}
This specifically uploads a product, I didn't want to exclude any information. The references in the Shopify API documentation should be enough for anyone looking to change its overall functionality.
I had a similar problem where Shopify would return a (401) unauthorized {"errors":"[API] Invalid API key or access token (unrecognized login or wrong password)"} when using UrlFetchApp on GAS, even though the request was working perfectly with Postman.
Runeworks Gaming solution worked, the trick is to pass the authorization into a "headers" object, nested in the "params" of the url fetch app.
I have used UrlFetchApp on many other occasions by putting the "Authorization" header directly into the params, but apparently, this won't work with Shopify.
Working:
var SHOP_ID = "Your shop ID";
var API_KEY = "Your API key";
var API_PASSWORD = "Your API password";
var encoded = Utilities.base64Encode(API_KEY + ':' + API_PASSWORD);
var headers = {
"Content-Type" : "application/json",
"Authorization": "Basic " + encoded
};
var options = {
"contentType" : "application/json",
'method' : 'GET',
'headers' : headers, // This is the important part
'followRedirects' : false,
};
var response = UrlFetchApp.fetch("https://" + SHOP_ID + ".myshopify.com/admin/api/2019-04/orders.json?status=any",options);
var RESPONSE_CODE = response.getResponseCode();
var CONTENT_JSON = JSON.parse(response.getContentText());
Pagination through JSON Object Using Angular Js 1 and Bootstrap UI
May someone help me on how to paginate through json object with proper bootstrap displays and and uib-pagination paging functionality...
below is my app code
var app = angular
.module("app",[
"ngRoute",
"ngResource",
"ui.bootstrap"
])
.config(['$routeProvider', function($routeProvider)
{
$routeProvider
.when('/home',{
templateUrl: 'HTML/temp/home.html',
controller:'HomeCtrl'
})
.otherwise({redirectTo:'/home'});
}])
.controller('HomeCtrl',['$scope','myresource','$route','$routeParams',function($scope,myresource,$route,$routeParams){
// console logs when I click on pagination link ...
$scope.pageChanged = function(){
console.log("Loading Pagination ... ");
};
//fucntion to edit and save details
$scope.edit = function(myArray){
console.log("ID : ... !" + myArray.id);
console.log("NUmber ... !" + myArray.contactdetails.number );
//phone details fieds auto popution binding
$scope.phonenumber = myArray.contactdetails.number;
$scope.email = myArray.contactdetails.email;
//address part fieds auto popution binding
$scope.housenumber = myArray.addressdetails.number;
$scope.street = myArray.addressdetails.street;
$scope.suburb = myArray.addressdetails.suburb;
$scope.postalcode = myArray.addressdetails.postalcode;
$scope.data = {
userid: myArray.id,
number : myArray.contactdetails.number,
email : myArray.contactdetails.email,
streetNum : myArray.addressdetails.number,
streetName: myArray.addressdetails.street,
suburb: myArray.addressdetails.suburb,
postalcode :myArray.addressdetails.postalcode
}
/*for(var i = 0 ; i <= myArray.length ; i++ ){
if($scope.editId === myArray.id){
$scopedata.contactdetails.number = myArray.contactdetails.number;
$scope.user.contactdetails.number = data[i].number;
console.log("phone number " + $scope.user.contactdetails.number)
}else{
console.log("NOne !");
}
console.log("NOne !" + $scope.editId);
}*/
//
};
$scope.myArray=[];
//gets data from JSON file
myresource.query({},function(response){
$scope.users = response;
$scope.pagi = [];
myArray = $scope.users;
//object for pagination instead of premitives
$scope.pagi = {
currentPage:1,
pageSize:3,
objlength:myArray.length
}
//console.log("Start : " + ($scope.pagi.currentPage-1) * pagi.pageSize )
;
});
}])
//slice and filter desired number of items
.filter('PagiFilter', function(){
return function(data,start){
return data.slice(start);
}
});
//resource factory
app.factory('myresource',function($resource){
return $resource("./JSON/ScreenMockupData.json",{
update:{method:"PUT", isArray: true}
})
})
below is html :
problem 1 : pages do not link to next page
problem 2 : bootrap buttons are not displayed.
Search...
UserID NumberDate of birthAgeGenderAction
<td>{{user.user}}</td>
<td>{{user.idnumber}}</td>
<td>{{user.dob}}</td>
<td>{{user.age}}</td>
<td>{{user.gender}}</td>
<td><form method="post" ><button type="submit" id = "{{user.id}}" ng-model="editId" value="{{user.id}}" ng-value="{{user.id}}" ng-click = "edit(user)">Edit user{{user.id}}</button></td>
</form></td>
</tr>
</a>
</table>
</div>
</div>
<div class='btn btn-default'>
<ul uib-pagination total-items="users.length" items-per-page = "pagi.pageSize" ng-model="pagi.currentPage" data-ng-show="users.length" ng-change = "pageChanged()"> </ul>
</div>
******************Index.html**************************************
<!-- index.html -->
<!DOCTYPE html>
<html ng-app="app" >
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>User Management System</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class = "container">
<div ng-view></div>
</div>
<script src="./JS/node_modules/jquery/dist/jquery.js"></script>
<script src="./js/node_modules/angular/angular.js"></script>
<script src="./js/node_modules/angular-resource/angular-resource.js"></script>
<script src="./js/node_modules/angular-route/angular-route.js"></script>
<link rel="stylesheet" href="./JS/node_modules/bootstrap/dist/css/bootstrap.css">
<script src="./js/node_modules/angular-ui-bootstrap/dist/ui-bootstrap.js" ></script>
<script src="./js/node_modules/angular-ui-bootstrap/dist/ui-bootstrap-tpls.js" ></script>
<link rel="stylesheet" href="./CSS/styles.css">
<script src="./JS/application.js"></script>
</body>
</html>
Morning , hoping someone can help. I have a google map set up that opens up train times in an info window on the marker on the map. that works fine , i just need that info window to not open in the map but in a separate tag. code is as follows
<!DOCTYPE html>
<html>
<head>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,700,300,400,600,800' rel='stylesheet' type='text/css'>
<!--Force IE standards mode-->
<meta http-equiv="X-UA-Compatible" content="IE=Edge, chrome=1" />
<link rel="stylesheet" type="text/css" media="(min-width: 0px)" href="styles/desktopcore.css" />
<link rel="stylesheet" type="text/css" media="(min-width: 0px)" href="styles/desktoptrain.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<!--http://www.google.com/webfonts#ChoosePlace:select Example of Web Font Link-->
<link href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed' rel='stylesheet' type='text/css'>
<!--Jquery core-->
<script src="http://code.jquery.com/jquery-1.6.3.min.js"></script>
<script>
/*FORCE IE to see placeholder attribute within an INPUT element*/
// This adds 'placeholder' to the items listed in the jQuery .support object.
jQuery(function() {
jQuery.support.placeholder = false;
test = document.createElement('input');
if('placeholder' in test) jQuery.support.placeholder = true;
});
// This adds placeholder support to browsers that wouldn't otherwise support it.
$(function() {
if(!$.support.placeholder) {
var active = document.activeElement;
$(':text').focus(function () {
if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {
$(this).val('').removeClass('hasPlaceholder');
}
}).blur(function () {
if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) {
$(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');
}
});
$(':text').blur();
$(active).focus();
$('form:eq(0)').submit(function () {
$(':text.hasPlaceholder').val('');
});
}
});
</script>
<title>Connect Tees Valley - Live Train Information</title>
<script type="text/javascript" src="main.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="gmap_funcs.js"></script>
<script type="text/javascript" src="stations.js"></script>
<script id="api" src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAN6152UgwT1SZB77BnJFoIRQnpdVsAwV_3Y4Ls0Av3kK1zTyTjBRRnBT3FSsVW5r9XsYVmbKrObSkbg" type="text/javascript"></script>
<script src="gmap_jscoord-1.1.1.js" type="text/javascript"></script>
<script type="text/javascript">
<!--//
var container;
var map;
var marker;
function initMap(){
container = document.getElementById("map_canvas");
map = new GMap2(container);
map.setCenter(new GLatLng(54.57019583004256,-1.3190460205078125), 9);
map.addControl(new GMapTypeControl());
map.addControl(new GLargeMapControl());
map.addControl(new GScaleControl());
updateMapControls();
}
function updateControls(){
var images = map.getContainer().getElementsByTagName("img");
for(var i=0; i<images.length; i++){
images[i].src = images[i].src.replace(/mapcontrols2/,"mapcontrols3d");
}
}
function getRailStation(stationIndex){
var pt = OS2LatLonWGS84_func(stationListArr[stationIndex].east,stationListArr[stationIndex].north)
pt = new GLatLng(pt.lat, pt.lng)
map.setCenter(pt, 14);
marker = createrMarker_func(pt,'');
map.addOverlay(marker);
marker.stationIndex = stationIndex;
ajaxLoadLiveRailInfo(stationListArr[stationIndex].code) ;
}
var railwayMarker;
function createrMarker_func(latlngPt,iconSrc){
var marker = new GMarker(latlngPt, {draggable: false});
if (railwayMarker != undefined){
railwayMarker.remove();
}
railwayMarker = marker;
return marker;
}
//-->
</script>
<script type="text/javascript">
<!--//
function ajaxLoadLiveRailInfo(stationCode){
if (stationCode != ""){
var arrdep = "departures";
sendXmlHttpRequestGet("nationalrailwebservice/?stationcode="+stationCode+"&arrdep="+arrdep+"&showplat=0",ajaxLoadLiveRailInfoRes,"",null);
}
}
function ajaxLoadLiveRailInfoRes(res){
var stationIndex = marker.stationIndex;
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml("<div class='mapbubbletitle'>"+stationListArr[stationIndex].name+" Station</div><div class='raillivefeed'>"+res+"</div><div class='clear'></div><div class='mapbubblebody'><img src='images/poweredbynr.gif' alt='Railway Station' title='National Rail'><br />from / to "+stationListArr[stationIndex].name+" Station<br /><a href='http://www.nationalrail.co.uk/times_fares/' target='_blank'>Fare and timetable information</a></div>");
});
marker.openInfoWindowHtml("<div class='mapbubbletitle'>"+stationListArr[stationIndex].name+" Station</div><div class='raillivefeed'>"+res+"</div><div class='clear'></div><div class='mapbubblebody'><img src='images/poweredbynr.gif' alt='Railway Station' title='National Rail'><br />from / to "+stationListArr[stationIndex].name+" Station<br /><a href='http://www.nationalrail.co.uk/times_fares/' target='_blank'>Fare and timetable information</a></div>");
}
</script>
<script type="text/javascript">
var navImgHoverArr = ['images/button__myjourney.jpg','images/button__bus.jpg','images/button__rail.jpg','images/button__walk.jpg','images/button__cycle.jpg','images/button__air.jpg','images/button__drive.jpg','images/button__taxi.jpg'];
//-->
</script>
<!--Google Analytics Tracking Snippet - 15 November 2012-->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-11278574-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol
? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body onLoad="initNav();initMap()" class="pgrail">
<section id="mainSection">
<h2>To get live departure information from any station<br />
select from the drop-down list below.</h2>
<article id="trainLive">
<select name="stationlist" id="stationlist" onChange="getRailStation(this.value)" class="inputtxt">
<option>***Please select station***</option>
<option value="0">Allens West</option>
<option value="1">Battersby</option>
<option value="2">Billingham</option>
<option value="3">Bishop Auckland</option>
<option value="4">Castleton Moor</option>
<option value="5">Chester-le-Street</option>
<option value="6">Commondale</option>
<option value="22">Longbeck</option>
</select>
<div id="map_canvas">Map loading..</div>
</article>
<article id="infowin">
info window
</article>
</section>
</body>
</html>
working code an be found here http://www.connectteesvalley.com/traindepartures1.asp
I just need to make the information open in the info window box. any ideas ?
Thanks
In ajaxLoadLiveRailInfoRes function instead of calling marker.openInfoWindowHTML do the following:
document.getElementById("infowin").innerHTML = "<div class='mapbubbletitle'>"+stationListArr[stationIndex].name+" Station</div><div class='raillivefeed'>"+res+"</div><div class='clear'></div><div class='mapbubblebody'><img src='images/poweredbynr.gif' alt='Railway Station' title='National Rail'><br />from / to "+stationListArr[stationIndex].name+" Station<br /><a href='http://www.nationalrail.co.uk/times_fares/' target='_blank'>Fare and timetable information</a></div>";