I am creating a project where when I type a url in my web browser it activates a gpio pin on my esp8266 and that works (192.168.2.5/gpio/1). Now I am trying to make a button on my webserver, that when it is pressed it activates that link while staying on the webserver. I dont know if I need http post or what. It doesn't send any data or anything just go to that URL and the pin is activated so I need to implement that as a button on my webserver. If someone can help that would be amazing!
Your web browser is sending a GET request to 192.168.2.5/gpio/1 so you need to mimic that with your code. Use a GET request.
It might help you in the future to get familiar with the different HTTP verbs and what they mean.
Try the below snippet with jQuery.
HTML:
<input type="button" id="getmepin" value="get me pin" name=">
JS:
$( "#getmepin" ).on( "click", function() {
$.get( "192.168.2.5/gpio/1", function( data ) {
console.log( data );
console.log( "Load was performed." );
});
});
Related
I try to add a Googla Pay button on a website. I follow the Google Pay implementation tutorial (https://developers.google.com/pay/api/web/guides/tutorial).
There is a code:
var paymentsClient = getGooglePaymentsClient();
paymentsClient.isReadyToPay(getGoogleIsReadyToPayRequest())
.then(function(response) {
//...
})
.catch(function(err) {
//...
});
I need to get some data from my server side before I call the above code so I do the http post request. Within success hanlder of my post request I call the above code. It works fine in my Android browser and my laptop browser. But it doesn't work from Safari. I get the "Unexpected developer error please try again later" error. If I call it without ajax request it works in Safari as well. Could someone suggest the solution?
Thanks for including the jsfiddle.
The reason that it's not working is because Google Pay tries to open a popup window when you call loadPaymentData in Safari. When a new window is triggered as the result of a click event (user initiated action), the popup window opens as expected. When it is triggered by a non-user initiated action, Google Pay gets loaded in the same window which ends up causing it to fail.
It looks like when you make an ajax request in the click handler and then call loadPaymentData, Safari considers it a non-user initiated action.
Check out the following example in Safari:
const ajaxButton = document.getElementById('ajax');
const nojaxButton = document.getElementById('nojax');
ajaxButton.addEventListener('click', event => {
$.get('/echo/json/', () => {
window.open('about:blank');
});
});
nojaxButton.addEventListener('click', event => {
window.open('about:blank');
});
I would recommend avoiding making any http calls on the button click event before loadPaymentData. If you can fetch the data before the button is clicked, then do so.
Out of interest, what kind of data are you fetching?
Hi I am using vscode webview api to show some webpages from local server
the key part (form) of the source code of the webpage is like this. It has a button and will launch a post request when clicked. therefore it can update its content
<form method="POST" action="">
<div class="form-group"><label for="start">Start Date:</label><input id="name" type="date" name="start" value="2019-01-01"
class="form-control"><label for="end">End Date:</label><input id="name" type="date" name="end" value="2019-01-04"
class="form-control"></div><button type="submit" class="btn btn-primary">generate report</button>
it works fine when opening with browser. But when launching it in vscode, nothing shows and vscode tells me it prevented webview navigation when using webview api
the part of code that using webview api is like this
public async showDetailedReport(){
const param: IRequestParam ={
endpoint:'localhost',
method:'GET',
port:23333,
path:'/report/detailReport'
};
try{
const html: string = await sendRequest(param);
const panel = vscode.window.createWebviewPanel(
'Report',
'Report',
vscode.ViewColumn.One,
{
enableScripts:true,
}
);
panel.webview.html = html;
} catch(e){
await vscode.window.showErrorMessage(e);
}
}
So my question is why that happen and how to solve it, which I mean, to send post or redirected to other webpages. Anything can be helpful. Thanks with grateful.
As of VS Code 1.31, webviews may only display a page of html content and may not navigate to other resources (such as making a POST request using a form).
You can still make requests using fetch or similar APIs, but standard POST submit form will not work.
I created a web app using jquery mobile 1.1.1
As part of my app I built password retrieval functionality. If a user needs to reset their password, they fill out a form and receive an e-mail with a link that includes the address of the password reset page and two other parameters as such:
www.mywebapp.com/demo.html#resetPassword?x=123&y=123
The Initial Problem:
When the user clicks on the link, they see the home page of the web app even though the URL in the address bar says: www.mywebapp.com/demo.html#resetPassword?x=123&y=123 I understand that jQuery mobile does not support passing parameters after the hash, so I came up with the following solution.
A Solution with a small inconvenience:
I put together the following code, which reads the URL, captures my two parameters and redirects the user to the password reset page:
$( document ).bind( "pagebeforeshow", function() {
//cpe("parameter") will check whether the specified URL parameter exists
if(cpe("x") && cpe("y")){
//gpv("parameter") captures the value of the specified URL parameter
recovery.username=gpv("x");
recovery.token=gpv("y");
$.mobile.changePage("#resetPassword");
}
})
The Inconvenience, and thus my current problem:
When the user clicks on the link in the e-mail the browser fires up and opens the main page of the app, and then it quickly displays the #resetPassword page. I understand that this happens because I'm changing the page
$.mobile.changePage("#resetPassword");
But, how do I modify the above code so that the user won't see the main page at all, and go straight to the #resetPassword page?
Use an empty initial page with no content. By default do a changePage to what was your initial page, but in other cases, like the resetPassword case, you changePage to that instead.
I followed Raymond Camden's suggestion and added the following to my html:
<pre>
<!--Start of blank initial page: #initPage-->
<div data-role="page" id="initPage">
<div data-role="content"></div>
</div>
<!-- /page -->
</pre>
I also added the following to my javascript:
//init page -> path control hub
$( document ).bind( "pagebeforeshow", function() {
var pageid=$.mobile.activePage.attr('id');
if(pageid=="initPage"){
if(cpe("x") && cpe("y")){
recovery.username=gpv("x");
recovery.token=gpv("y");
$.mobile.changePage("#resetPassword");
}else{
$.mobile.changePage("#info");
}
}
})
It's working now.
The send dialog is a useful piece of functionality.
Sadly it is not available on mobile devices
I call the api in the following way;
app.sendMessage = function(){
FB.ui({
app_id: app.facebook_app_id,
method: "send",
link: "http://google.com"
});
};
Right now the outcome on a mobile device is a nasty error page.
Is there a way to detect in javascript whether or not the send dialog is available?
I'd suggest something like;
function sendDialogAvailable(){
return FB.supports("senddialog");
}
I could then change my app's functionality according to this property, but right now I fear I'll have to resort to browser sniffing.
So I have an iFrame app on a fan page, which includes the comments plugin. Is there a way I/any admin can receive a notification or email every time someone adds a comment?
You can subscribe to comment.create event and send the notification to admin in any way you prefer, once comment is created. Facebook itself doesn't provide such functionality.
This may looks like this (I assume Facebook JavaScript SDK is already loaded on page before doing this, read about it in documentation on Loading, anyway if you're using Social Comments Plugin it should be loaded already):
<script type="text/javascript">
FB.subscribe('comment.create', function(response){
// Here you need to do a call to some service/script/application
// to notify your administrator about new comment.
// I'll use jQuery ajax to call server-side script to illustrate the flow
$.post('//hostnamne/path/to/script', {
"action": "comment created",
"url_of_page_comment_leaved_on": response.href,
"id_of_comment_object": response.commentID
});
});
</script>
In your script located at http(s?)://hostnamne/path/to/script you can send a notification to admin, how to do it may vary on way you want it for example if you want to send an email you can use something like this php sample (aging this is just a flow sample, not real code you should use):
<?
$admin_email = 'root#localhost';
$commentID = $_REQUEST['id_of_comment_object'];
$page_href = $_REQUEST['url_of_page_comment_leaved_on'];
$message = "comment #{$commentID} was leaved on page {$page_href}";
mail($admin_email, "You have a new comment", $message);
?>
If you need to track the deletion of comments too you can use comment.remove event with similar flow...