I'm trying to run a simple example of signalr, the example that i'm trying to do is here.
I verified that $.connection.hub.start().done is working fine. The problem is chat.client.broadcastMessage is not executed as i put an alert inside it to make sure but that alert did not execute. Can any one help me to fix my problem? Here is my code:
Chatting page.aspx
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.container {
background-color: #99CCFF;
border: thick solid #808080;
padding: 20px;
margin: 20px;
}
</style>
</head>
<body>
<div class="container">
<input type="text" id="message" />
<input type="button" id="sendmessage" value="Send" />
<input type="hidden" id="displayname" />
<ul id="discussion">
</ul>
</div>
<!--Script references. -->
<!--Reference the jQuery library. -->
<script src="scripts/jquery-1.6.4.min.js"></script>
<!--Reference the SignalR library. -->
<script src="scripts/jquery.signalR-2.2.1.min.js"></script>
<!--Reference the autogenerated SignalR hub script. -->
<script src='<%: ResolveClientUrl("~/signalr/hubs") %>'></script> <!--Add script to update the page and send messages.-->
<script type="text/javascript">
$(function () {
// Declare a proxy to reference the hub.
var chat = $.connection.chatHub;
// Create a function that the hub can call to broadcast messages.
chat.client.broadcastMessage = function (name, message) {
// Html encode display name and message.
var encodedName = $('<div />').text(name).html();
var encodedMsg = $('<div />').text(message).html();
// Add the message to the page.
$('#discussion').append('<li><strong>' + encodedName
+ '</strong>: ' + encodedMsg + '</li>');
};
// Get the user name and store it to prepend to messages.
$('#displayname').val(prompt('Enter your name:', ''));
// Set initial focus to message input box.
$('#message').focus();
// Start the connection.
$.connection.hub.start().done(function () {
$('#sendmessage').click(function () {
// Call the Send method on the hub.
chat.server.send($('#displayname').val(), $('#message').val());
// Clear text box and reset focus for next comment.
$('#message').val('').focus();
});
});
});
</script>
</body>
</html>
ChatHub.cs
public class ChatHub : Hub
{
//used to send message to all clients
public void send(String name, String message)
{
Clients.All.brodcastMessage(name,message);
}
}
Startup.cs
public class Startup
{
public void Configuration(IAppBuilder app)
{
app.MapSignalR();
}
}
NOTE: I've figured out that, when i type chat. the dropdown menu does not show me client thus i can not call chat.client.broadcastMessage, why?
I solved the problem by using addMessage instead of brodcastMessage and it works.
here is the code...
chat.client.addMessage = function (name, message) //script side
Clients.All.addMessage(name,message); //inside send method in the hub class
Related
I can make the payments work for test cards NOT requiring 3DSecure authentication. For cards that require it, no modal pops up. In the dashboard the payments will show up with status "The customer must complete an additional authentication step." In these cases I don't even reach the
then(function(result) {
if (result.error) {
alert(result.error.message);
}
else {
alert('Success!');
code part. With non-3ds test cards, this part is working fine.
Debugging the javascript will show me some meaningless exceptions from stripe js script.
Given that it works for some cards, the server site initialization of the payment intent, and passing of the clientsecret, can be ruled out, that part works.
<head runat="server">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://js.stripe.com/v3/"></script>
<style type="text/css">
.auto-style1 {
width: 930px;
}
</style>
</head>
<form id="form1" runat="server">
<div>
<asp:HiddenField ID="hiddenClientSecret" runat="server" />
<input id="cardholder-name" type="text"/>
<!-- placeholder for Elements -->
<div id="card-element" class="auto-style1"></div>
<button id="card-button">
Submit Payment
</button>
</div>
</form>
<script >
var stripe = Stripe('mykey', {locale: 'en'});
var elements = stripe.elements({locale: 'en'});
var cardElement = elements.create('card', {hidePostalCode: true});
cardElement.mount('#card-element');
var cardholderName = document.getElementById('cardholder-name');
var cardButton = document.getElementById('card-button');
var clientSecret = document.getElementById('hiddenClientSecret').value;
cardButton.addEventListener('click', function(ev) {
stripe.handleCardPayment(
clientSecret, cardElement, {
payment_method_data: {
billing_details: {name: cardholderName.value}
}
}
).then(function(result) {
if (result.error) {
alert(result.error.message);
}
else {
alert('Success!');
}
});
});
</script>
OK, I needed to explicitly set button type to "button" - otherwise it does a submit roundtrip to the server: <button type="button" id="card-button">. That code part was taken directly from Stripe, seems they need to be a little more precise in their docs!
I would like to get the current logged in username and display it my frontend.
Currently I have a function called GetCurrentUser() that gets called when a button is clicked.
<button type="submit" onclick="GetCurrentUser()" style="margin-left: 15px;margin-top:10px; margin-bottom: 5px;background-color: black; "value="Submit">Save Selections</button><br>
function GetCurrentUser() {
var usrName ="#HttpContext.Current.User.Identity.Name.ToString()";
//var usrName = '<%HttpContext.Current.User.Identity.Name %>';
//document.getElementById("UserName").innerHTML = usrName;
console.log(usrName);}
I get the follwoingoutput in my console log--> #HttpContext.Current.User.Identity.Name
If you are seeing the literal output of "HttpContext.Current.User.Identity.Name " then your JS function is generated client side after you have lost server context.
Couple options for you:
Call back to your controller via ajax to get the username
Store the username in a read only field on page load (kinda like setting a form value) and retrieve the value via jquery or js on function call
Assign the username on page load to a global js element and just use that element in your function.
Here is an example of 2 and 3. I don't think you should worry about #1 until you fully understand why your issue is happening in the first place:
<div class="btn btn-info" onclick="GetCurrentUser()" style="margin-left: 15px;margin-top:10px; margin-bottom: 5px;background-color: black; " value="Submit">Save Selections</div><br>
<input type="hidden" name="method2" id="method2" value="#System.Security.Principal.WindowsIdentity.GetCurrent().Name">
#section scripts {
<script>
var globalSettingMethod = '#System.Security.Principal.WindowsIdentity.GetCurrent().Name';
function GetCurrentUser() {
alert(globalSettingMethod);
alert($('#method2').val());
}
</script>
}
I could get the user logged in by passing the script at the end of the document.
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="Example.SiteMaster" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
</head>
<body>
<form runat="server">
</form>
<script>
var loggedUser = "<%: HttpContext.Current.User.Identity.Name %>";
</script>
</body>
</html>
I hope you find it useful.
I'm trying to set up the DirectLineJS to work in a website just for testing purposes right now. I've built the DirectLineJS repo and added /built/directLine.js to my website folder following the documentation here https://github.com/Microsoft/BotFramework-DirectLineJS
In the HTML page I'm just using a button to try to send a message through the direct line
<html>
<head>
<meta charset="UTF-8" />
<title>Bot Chat</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://unpkg.com/botframework-directlinejs/directLine.js" type="javascript"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<style>
.wc-chatview-panel {
width: 320px;
height: 500px;
position: relative;
}
.h2 {
font-family: Segoe UI;
}
</style>
</head>
<body>
<h2 style="font-family:Segoe UI;">Welcome to my custom Bot!</h2>
<section class="container">
<input id="clickMe" type="button" value="clickme" onclick="connectDirectLine();" />
</section>
<textarea id="myTextarea">
342 Alvin Road
Ducksburg</textarea>
<p>Click the button to change the contents of the text area.</p>
<button type="button" onclick="myFunction()">Try it</button>
<script>
function myFunction() {
var text = document.getElementById("myTextarea").value;
console.log(text)
}
</script></body>
</html>
<script>
function connectDirectLine() {
import { DirectLine } from 'botframework-directlinejs';
var directLine = new DirectLine({
secret: "mySecret",
});
directLine.postActivity({
from: { id: 'myUserId', name: 'myUserName' }, // required (from.name is optional)
type: 'message',
text: 'a message for you, Rudy'
}).subscribe(
id => console.log("Posted activity, assigned ID ", id),
error => console.log("Error posting activity", error)
);
directLine.activity$
.filter(activity => activity.type === 'message' && activity.from.id === 'yourBotHandle')
.subscribe(
message => console.log("received message ", message)
);
}
</script>
<html
When I run the website the error I'm getting is unexpected token import from import { DirectLine } from "botframework-directlinejs";
how can I properly import the botframework-directlinejs file so that I can use the DirectLine object?
You are mixing TypeScript with JavaScript.
To use Direct Line add the following to the HTML of your page:
<script src="http://unpkg.com/botframework-directlinejs/directLine.js"/>
Then you should delete your Import statement and finally, update the code that creates the DirectLine object to be:
var directLine = new DirectLine.DirectLine({
secret: "mySecret",
});
Notice the DirectLine.DirectLine
i am trying to get html string from my site as it presented in browser
firstly i tried to use web client
using (var client = new WebClient())
{
var content = client.DownloadString("my_site_address");
}
but in my site i have some javascript code that change the view (and webClient does not run javascript)
so i use wpf WebBrowser and after nevigate to the desire site it show the page (as expected) but when i try to get the html string it show just like the webClient
dynamic doc = MainBrowser.Document;
var htmlText = doc.documentElement.InnerHtml;
this is how i get the html:
<!DOCTYPE html>
<head>
<title>Title</title>
</head>
<body>
<div class="conteiner">
<div class="matrix">
<script type="text/javascript">
// some script code
</script>
<script type="text/javascript" src="xxx"></script>
Matrix
</div>
<div class="zoom">
Zoom
</div>
</div>
<div class="test">
<script type="text/javascript">
// some script code
</script>
<script type="text/javascript" src"xxx2"></script>
</div>
</body>
</html>
and this is how i should get it after the javascript change it:
<html><head>
<title>Title</title>
</head>
<body>
<div class="conteiner">
<div class="matrix">
<script type="text/javascript">
</script>
<script type="text/javascript" src="xxx"></script><iframe ></iframe><script ></script><div ><div ><iframe >
<html><head>
<title></title>
</head>
<body>
<div >
<ul><li><ol><li <a </a></li></ol></li></ul> </div>
</body></html>
</iframe></div></div></div>
Matrix
</div>
<div class="zoom">
Zoom
</div>
</div>
<div class="test">
<script type="text/javascript">
</script>
<script type="text/javascript" src="xxx2"></script><div ><div ><div ><iframe ></iframe></div></div></div>
</div>
</body></html>
Please help :)
You can use the WebDriver framework from Selenium. It offers different web driver implementations, like for Internet Explorer or Firefox.
Here is some sample code to request a web site with Internet Explorer, let it render and finally save the final HTML markup.
public class WebSiteHtmlLoader : IDisposable
{
private readonly RemoteWebDriver _remoteWebDriver;
public WebSiteHtmlLoader(RemoteWebDriver remoteWebDriver)
{
if (remoteWebDriver == null) throw new ArgumentNullException("remoteWebDriver");
_remoteWebDriver = remoteWebDriver;
}
public string GetRenderedHtml(Uri webSiteUri)
{
if (webSiteUri == null) throw new ArgumentNullException("webSiteUri");
_remoteWebDriver.Navigate().GoToUrl(webSiteUri);
return _remoteWebDriver.PageSource;
}
public void Dispose()
{
Dispose(true);
GC.SuppressFinalize(this);
}
private void Dispose(bool disposing)
{
if (disposing)
{
if (_remoteWebDriver != null)
{
_remoteWebDriver.Quit();
}
}
}
}
Usage:
class Program
{
static void Main(string[] args)
{
if (!args.Any())
{
return;
}
var pageUrl = args.First();
var options = new InternetExplorerOptions
{
IntroduceInstabilityByIgnoringProtectedModeSettings = true,
PageLoadStrategy = InternetExplorerPageLoadStrategy.Eager
};
using (var htmlLoader = new WebSiteHtmlLoader(new InternetExplorerDriver(options)))
{
var html = htmlLoader.GetRenderedHtml(new Uri(pageUrl, UriKind.Absolute));
File.WriteAllText(#"C:\htmlloadertext.html", html);
}
}
}
You could try to use the WebBrowser.DocumentText property. Like, add a hidden WebBrowser control to your application and call Navigate() function, then call the property to get the generated HTML
More info at: http://msdn.microsoft.com/en-us/library/system.windows.forms.webbrowser.documenttext.aspx
I have put together a Cross-Document Messaging implementation between a site and an iframe. It woks great. But I desire to communicate between tabs, not iframes.
Here is the code I have, for the iframe communication in 2 parts. The first is the Master page and the other is the remote or slave page.
So, MASTER page here...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Cross-Document Messaging Receiver</title>
<!-- <script type='text/javascript' src='js/xDocMess.js'></script> -->
<link rel="stylesheet" type="text/css" href="css/xDocMess.css">
<script type="text/javascript">
function sendMessage() {
//select the iframe containing the message receiver remote script
var remoteframe = document.getElementById("remotepage");
//Get the users message from the message input box
var message = document.getElementById("message").value;
//Check that the message is not blank
if (message !== "") {
remoteframe.contentWindow.postMessage(message, 'http://localhost:8081');
}
else {
alert("You cannot send a blank message!");
}
}
</script>
</head>
<body>
<h1>Cross-Domain Messaging Example</h1>
<div id="controls">
<label>Enter your message to be sent to the iframe: </label>
<input type="text" id="message" />
<button id="sendmessage" onclick="sendMessage();">Send Message</button>
<p>(Note: Only alphanumeric characters will be printed!)</p>
</div>
<h3>Remote Script iframe</h3>
<iframe id="remotepage" src="http://localhost:8081/remote.html"></iframe>
</body>
And now, the REMOTE site here...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Remote Receiver</title>
<link rel="stylesheet" type="text/css" href="css/normalize.css">
<style type='text/css'>
body {
font-family: sans-serif;
padding: 10px;
}
h3 {
padding-bottom: 5px;
}
#messages {
font-size: small;
border-top: 1px solid #000;
padding-top: 10px;
}
</style>
<script type='text/javascript'>//<![CDATA[
window.onload=function(){
function receiver(message) {
//get the message container html element (in this case, the messages div)
var messagecontainer = document.getElementById("messages");
var trusteddomain = "http://localhost:8081";
//Get the time of message receipt
var currenttime = new Date();
//format the time into a user readable format
var formattedtime = currenttime.getHours() + ":" + currenttime.getMinutes() + ":" + currenttime.getSeconds();
var msgcontent = message.data;
//check the content of the message only contains letters and numbers to prevent xss attacks
if (msgcontent.match(/^[A-Za-z0-9]+$/)) {
messagecontainer.innerHTML += "message received # " + formattedtime + ": " + message.data + "<br />";
} else {
messagecontainer.innerHTML += "Illegal characters found in the message received # " + formattedtime + ". Message rejected<br/>";
}
}
}
</script>
</head>
<body>
<h3>Messages Received:</h3>
<div id="messages"></div>
</body>
</html>
The solution lies in how to call a window.open instead of invoking the IFRAME in the MASTER: <iframe id="remotepage" src="http://localhost:8081/remote.html"></iframe> and changing the sendmessage code line:
var remoteframe = document.getElementById("remotepage");
and be able to pass messages to the window. I have a mental block there...
Any help would be appreciated...
TIA
Dennis
If I understand your question, I believe all you need to do is name your window when you call window.open and then use this reference in your code just like you would the contentWindow of an iframe:
var myWindow = window.open('newTab.html');
myWindow.postMessage('You\'re a nice looking window', 'http://yourtargetdomain.com');
You would then put the 'message' handler inside the newTab.html document
window.addEventListener('message', function (event) {
// security check ...
console.log('message: ' + event.data);
});
It can be done only using an iFrame.
Page, loaded in an iFrame, acts as a proxy, translating message events into localStorage events, and vice-versa.
localStorage is separate for each domain, that's why it can't be implemented in two different tabs.