Javascript SDK connect() function not working in chrome - soundcloud

Am attempting to model my code after the example here: http://connect.soundcloud.com/examples/connecting.html#
It works in firefox, but not in chrome. In chrome, the soundcloud popup shows up correctly, and I can sign in (returning to sc-connect.html), but then the window won't close. Upon closer inspection, there's a javascript error because window.opener is null. I wonder if it has to do with localhost uri? The example at the link above works in both firefox and chrome. Any ideas? My code below:
SC.initialize({client_id:'my_client_id', redirect_uri:'http://localhost:3000/sc-connect.html'});
$('button').click(function(){
SC.connect(function () {
console.log('made it');
}
}
My sc-connect.html page looks like:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Connect with SoundCloud</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body onload="window.opener.setTimeout(window.opener.SC.connectCallback, 1)">
<b style="width: 100%; text-align: center;">This popup should automatically close in a few seconds</b>
</body>
</html>
Redirect URI on soundcloud for this app: http://localhost:3000/sc-connect.html

This is actually a strange bug in Chrome which is caused by installing the SoundCloud app from the Chrome App Store. Bizarre, I know.
A workaround is instead of using window.opener, push the oauth token into LocalStorage or SessionStorage and have the opener window listen to the Storage event.

It looks like you're missing a couple of closing brackets in your example code. Other than that, nothing appears obviously wrong with your example. I copied and pasted your sc-connect.html and used it with the following:
<html>
<head>
<title>Demo</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="http://connect.soundcloud.com/sdk.js"></script>
<script type="text/javascript">
$(document).ready(function() {
SC.initialize({
client_id: 'MY_CLIENT_ID',
redirect_uri: 'http://localhost:8080/connect/sc-callback.html'
});
$('button').click(function(){
SC.connect(function() {
SC.get('/me', function(data) {
$('#name').text(data.username);
});
});
});
});
</script>
</head>
<body>
<button>Connect</button>
<p>
Hello There, <span id="name"></span>
</p>
</body>
</html>
This works for me in Firefox and Chrome. Let me know if the that helps.

<!DOCTYPE html> <html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Connect with SoundCloud</title>
</head>
<body onload="window.opener.setTimeout(window.opener.SC.connectCallback, 1)">
<b style="text-align: center;">This popup should automatically close in a few seconds</b>
<script type="text/javascript">window.opener.SC.connectCallback.call(this); </script>
</body>
</html>

Related

Can the included (pasted into the body) htm code hurt me?

I received an email yesterday supposedly from the IRS. Since I was expecting to hear from the IRS, I paid attention to it and found it had an htm attachment. I didn't open it, but I'm curious how this code could hurt me if I had opened it.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Redirecting ....</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<script>
window.location.replace("https://lomkpcyzgo63bf0b69184dd.example.ru/Mrick#example.com");
</script>
</div>
</body>
</html>

How to get current url in Safari web extension popup window?

I'm writing the safari web extension and trying to get the current webpage url in the popup.js , but the code does not work . How to solve the problem ?
popup.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="popup.css">
<script type="module" src="popup.js"></script>
<script src="jquery.min.js"></script>
<script src="qrcode.js"></script>
</head>
<body>
<p id="demo">temp</p>
<strong>Hello World!----gg-</strong>
</body>
</html>
popup.js :
console.log("Hello World!", browser);
document.getElementById("demo").innerHTML = safari.application.activeBrowserWindow.activeTab.url;

Error: Target container is not a DOM element (when running Purescript Pux Program)

I've compiled this program with Purescript 0.12.5 but when I look at the index.html in Firefox 67.0.2 I get the following error in the web console:
Error: Target container is not a DOM element. app.js:5160:15
Here is the index.html file:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>PS3</title>
<script src="https://unpkg.com/react#16/umd/react.production.min.js"
crossorigin></script>
<script src="https://unpkg.com/react-dom#16/umd/react-
dom.production.min.js" crossorigin></script>
<script src='app.js'></script>
</head>
<body>
<div id="app"></div>
</body>
</html>
Any help would be appreciated!
This is because you're loading the program before the <div id="app"> element, so the element doesn't yet exist at the time the program is running and trying to find it.
Try moving the <script> tag after the <div>:
<html>
<head>
...
</head>
<body>
<div id="app"></div>
<script src='app.js'></script>
</body>
</html>

CoffeeScript from CDN above 1.4.0 cannot call JavaScript function

CoffeeScript code is not working when the 1.10.0 version coffee-script.min.js is linked.
<!DOCTYPE html>
<html lang="en">
<head> <meta charset='utf-8'> </head>
<body>
<div id="myDiv">Content</div>
</body>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js" > </script>
<!--
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/coffee-script/1.4.0/coffee-script.min.js" > </script>
-->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/coffee-script/1.10.0/coffee-script.min.js" > </script>
<script type="text/coffeescript" >
$("#myDiv").text "New Content"
alert "Hello world"
</script>
</html>
The latest working CDN coffee-script.min.js is 1.4.0. What is the problem?
Those script hosted in CDN are not for browser, I think.
I tried your code, and as you say it did not work and there was the following console log.
Uncaught ReferenceError: require is not defined
require is a specification of commonJS and it is not implemented in browser default.
If you would not like to compile and make it work easily, the code below is available.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='utf-8'>
</head>
<body>
<div id="myDiv">Content</div>
</body>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js">
</script>
<script type="text/javascript" src="http://coffeescript.org/extras/coffee-script.js"></script>
<script type="text/coffeescript">
$("#myDiv").text "New Content"
alert "Hello world"
</script>
</html>
This way is introduced at the official site.
http://coffeescript.org/
While it's not recommended for serious use, CoffeeScripts may be included directly within the browser using tags. The source includes a compressed and minified version of the compiler (Download current version here, 39k when gzipped) as extras/coffee-script.js. Include this file on a page with inline CoffeeScript tags, and it will compile and evaluate them in order.
Error in packaging on the part of the CDN provider, see here:
https://github.com/jashkenas/coffeescript/issues/3811
https://github.com/cdnjs/cdnjs/issues/4869

Minimum includes for Alfresco Share custom page?

I am creating a custom Share page that must have none of the Alfresco UI on it, but which still needs access to the Alfresco and YAHOO objects.
I have successfully created the page and caused it to open in a new tab, but I get errors that the Alfresco and YAHOO objects are undefined.
What are the minimum includes I must add to my Freemarker template to get access to those objects?
Update: I have gotten the Alfresco and YAHOO objects to load, but now am getting "Uncaught Error: extend failed, please check that all dependencies are included."
Here are the freemarker and javascript includes I've got so far, if it'll help:
<#import "import/alfresco-common.ftl" as common />
...
<script type="text/javascript" src="../scripts/ajax/yahoo/yahoo-min.js"> </script>
<script type="text/javascript" src="../scripts/ajax/yahoo/connection/connection-min.js"> </script>
<script type="text/javascript" src="../scripts/ajax/common.js"> </script>
<script type="text/javascript" src="../scripts/ajax/utilities/utilities.js"> </script>
<script type="text/javascript" src="../yui/yuiloader/yuiloader.js"> </script>
<script type="text/javascript" src="../js/alfresco.js"> </script>
Update 2: Based on the first answer, the first few lines of the template look like this and again yield Uncaught ReferenceError: YAHOO is not defined:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<region-id>head-resources</region-id>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<title></title>
<script>
var urlParams;
Update 3: I've reduced the source to the minimum necessary to demonstrate the problem. What follows next is the template component definition file, followed by the freemarker template itself. Definition:
<?xml version='1.0' encoding='UTF-8'?>
<page>
<title>iPad Viewer</title>
<title-id>page.iPad.title</title-id>
<description>iPad Viewer</description>
<description-id>page.iPad.description</description-id>
<template-instance>viewer-ipad</template-instance>
<authentication>user</authentication>
</page>
Freemarker template:
<html>
<body>
<div class="content">
<#region-id>head-resources</#region-id>
<script>
alert(YAHOO);
alert(Alfresco);
</script>
</div>
</body>
</html>
Error is:
Caused by: freemarker.core.ParseException: Parsing error in template "org/alfresco/viewer-ipad.ftl" in line 11, column 7: Unclosed #... when the end of the file was reached.
I'm not sure how you created the page, but this is not needed when you define your regions.
Probably there are all in the <region-id>head-resources</region-id> So if you include that in the page-template that should suffice.