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

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;

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>

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>

Use Bootstrap on Vapor

I am new to web development and couldn't find a clear answer.
Is it possible to use Bootstrap in Vapor with Swift 3?
Yes, you can use Bootstrap. You will either:
Add the CDN links to your template files, i.e. .leaf files, which are in the Resources/Views/ folder, or
Download the Bootstrap files and add the CSS, JS, fonts, etc. to the Public/ folder which can be accessed by all the pages.
For the first suggestion, you could add the CDN links to your base.leaf, like this:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
#import("head")
</head>
<body>
#import("body")
</body>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</html>
For the second suggestion, you would place the files in here:
Then access the files like this:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/styles/{CSS-FILE-NAME}">
#import("head")
</head>
<body>
#import("body")
</body>
<script src="/{JS-FILE-NAME}"></script>
</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

Javascript SDK connect() function not working in chrome

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>