How to integrate media.net ads in SPA(angularjs) website. I have copied and posted the given code in my website but it is not working(http://test.website.paperboy.com/).
<script id="mNCC" language="javascript">
medianet_width = "728";
medianet_height = "90";
medianet_crid = "xyz";
medianet_versionId = "xyz";
</script>
<script src="//contextual.media.net/nmedianet.js?cid=xyz"></script>
But it is working for non angular static site(https://test.website.paperboy.com/mobile-view.html).
I cannot speak for angularjs, but Angular 2 and beyond scrubs out script tags. Here is the solution for Angular 8. Note this is for the asynchronous ad code, not the synchronous code posted, but the methodology should be the same in which we are adding a DOM element:
.ts file:
convertToScript() {
var element = this.script.nativeElement;
var script = document.createElement('script');
script.id = 'mNCC';
script.lang = this.language ? this.language : 'javascript';
script.type = this.type ? this.type : 'text/javascript';
script.innerHTML = `
try {
window._mNHandle.queue.push(function (){
window._mNDetails.loadTag(${this.advertisement});
});
}
catch (error) {}`;
script['data-cfasync'] = 'false';
const parent = element.parentElement;
parent.parentElement.replaceChild(script, parent);
}
ngAfterViewInit() {
this.convertToScript();
}
.html file:
<div #script style.display="none">
<ng-content></ng-content>
</div>
Add the component where you want (inject the advertisement size and id here)
<div id="616415456">
<app-media-net-ad [type]="'text/javascript'" [advertisement]="advertisement">
</app-media-net-ad>
</div>
The advertisement variable should be formated as "ad_id,ad_size,ad_id". The header code can be added into the header section of your index.html file.
Related
How do you add components such as charts in google trends in reactjs?
componentDidUpdate() {
const that = this
const keyword = "your keyword"
conts script = document.createElement("script")
script.src = "https://ssl.gstatic.com/trends_nrtr/760_RC08/embed_loader.js"
script.async = true
ReactDOM.findDOMNode(this.refs.trendsWrapper1).appendChild(script)
script.onload = function () {
trends.embed.renderExploreWidgetTo(ReactDOM.findDOMNode(that.refs.trendsWrapper1), "TIMESERIES", {"comparisonItem":[{"keyword":keyword,"geo":"","time":"today 5-y"}],"category":0,"property":""}, {"exploreQuery":"q=%2Fm%2F0rfgxy2","guestPath":"https://www.google.co.uk:443/trends/embed/"})
}
}
I tried this and didn't work. Please try to suggest a much easier method than this as well.
You need to load the embed_loader script out side of react (like any other 3rd lib code)
At the component, run the trends.embed command.
var Trends = React.createClass({
render: function() {
trends.embed.renderWidget("US_cu_mqCQGFwBAABWOM_en",
"fe_line_chart_309e703b-7d68-4baa-8dc9-c12e2f9defc3",
{"guestPath":"https://trends.google.com:443/trends/embed/"});
return (
<div>must return something :/</div>
)}
});
Here is an example
I'm creating a Map widget in ServiceNow and am running into an Error: [$sce:insecurl].
My HTML:
<div class="fluidMedia">
<iframe ng-src="{{data.src}}" class="media"></iframe>
</div>
Server Script:
var gr = new GlideRecord('cmn_location');
gr.addQuery('sys_id', gs.getUser().getLocation());
gr.query();
if(gr.next())
{
var loc = gr.street.getHTMLValue();
}
loc1 = loc.replace(/,/g, "");
loc2 = loc1.replace(/ /g, "+");
data.src = "https://www.google.com/maps/embed/v1/place?key=AIzaSyCmoLpiJFrdXLLUYsM3PRfPD0zQ0uATAUw&q=" + loc2;
Client Controller:
function($scope,$sce) {
var c= this;
c.server.get({name: "test"}).then(function(r) {
c.data.src = $sce.trustAsResourceUrl(r.data.src);
});
}
Has anyone encountered this? How do I change the angular js to accommodate for this? Sorry if this is a silly question, I'm brand new to angular js.
Thanks!
Try to add this url to the whitelist of urls via $sceDelegateProvider. Also read this for more details.
I am trying to create the smallest possible GAE app to show the use of the channel api.
I have two handlers in the python, the first "TestPage" sends out the html shown below. The second "SendPage" tries to send a message over the channel to the test page. The code for the TestPage is
class TestPage(Handler):
def get(self):
token = channel.create_channel("1")
self.render("test.html", token = token)
It just creates the channel with an id of "1" and reders the page with the token passed back from create_channel().
The SendPage is just:
class SendPage(Handler):
def get(self):
channel.send_message("1", "hello")
self.write("sent hello to 1")
The html is as small as I could get it:
<!DOCTYPE HTML>
<html>
<body>
<br>Token is {{ token }}
<br>
<div id="debug">_</div>
<!--
<script src="https://talkgadget.google.com/talkgadget/channel.js"></script>
-->
<script src="static/channel.js"></script>
<script defer="defer">
function debug(s) {
document.getElementById("debug").innerHTML = s;
}
var channel = new goog.appengine.Channel( {{ token }} );
var socket = channel.open();
socket.onopen = function(e) {
debug("open");
}
socket.onclose = function(e) {
debug("close");
}
socket.onerror = function(e) {
debug("error");
}
socket.onmessage = function(e) {
debug("message");
}
debug("ready");
</script>
</body>
</html>
So, inside chrome I pull up TestPage and I see the "ready" message. Then I pull up the SendPage in another tab. And see the "sent message". Then when I go back to the TestPage I would expect to have "ready" replaced by "message". But this never happens. None of the socket handler functions are being called.
I'm stuck for the moment and would appreciate any help or suggestions.
Thank you.
Ok, I figured it out. There were two problems. First, the template line
var channel = new goog.appengine.Channel( {{ token }} );
should have been
var channel = new goog.appengine.Channel( "{{token}}" );
as it was token was something like "channel-2052893164-1373347311-1" which quietly evaluated to a number.
Second, the correct script for the channel.js was
<script type="text/javascript" src="/_ah/channel/jsapi"></script>
The other scripts I had referenced were from other stack overflow answers and I guess they did not properly apply to this problem.
Thanks.
I'm searching or a way to open a URL with two POST parameters. My only option now is writing a small exe which creates a form in a WebBrowser control then auto-clicks a button, which is horrible. Is there a better way I can do this?
You could create an HTML File with the following javascript:
<script type="text/javascript">
<!-- The function below does a post without requiring a form or the click of a button -->
function postwith (to,p) {
var myForm = document.createElement("form");
myForm.method="post" ;
myForm.action = to ;
for (var k in p) {
var myInput = document.createElement("input") ;
myInput.setAttribute("name", k) ;
myInput.setAttribute("value", p[k]);
myForm.appendChild(myInput) ;
}
document.body.appendChild(myForm) ;
myForm.submit() ;
document.body.removeChild(myForm) ;
}
</script>
Example Usage:
<script type="text/javascript">
function delconfirm(id){
if(confirm('Are you sure?'))
{
postwith('http://somesite.com/webpagetorecievepost.php',{KEY:VALUE,KEY:'STRING VALUE'});
}
}
</script>
You can have as many KEY:VALUE pairs as you like.
Once you have this html file you can modify and open it in internet explorer.
There are web browser automation tools that can drive IE, for instance Selenium. Selenium is scriptable, and has drivers for the major browsers. I've only used selenium for this kind of thing, driven by java code; there are alternatives.
There are also Windows GUI automation tools, for instance AutoIT, that can open a given program and manipulate GUI elements.
I got this working so you can open a standard .html file with a query string to forward the parameters to a URL.
function postFromQueryString(url) {
// grab params from query string into KVP array
var postParams = [], hash;
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for(var i = 0; i < hashes.length; i++) {
hash = hashes[i].split('=');
postParams.push(hash[0]);
postParams[hash[0]] = hash[1];
}
if(postParams.length === 0) {
alert('No parameter was passed');
window.close();
return;
}
// create a form
var formToPost = document.createElement("form");
formToPost.method="post";
formToPost.action = url;
// add params to form
for (var k in postParams) {
var postInput = document.createElement("input");
postInput.setAttribute("name", k);
postInput.setAttribute("value", postParams[k]);
formToPost.appendChild(postInput);
}
document.body.appendChild(formToPost);
formToPost.submit();
document.body.removeChild(formToPost);
}
To call it onLoad:
(function () {
// build dynamic form and post
postFromQueryString('http://yourUrlToPostTo.aspx');
})();
Im my asp.net mvc application I have a enclosing the thumb image of the file in an aspx page loaded in an iframe. I want to open the file with an Open/Save dialogbox. The file is uploaded to the database in image datatype.
My aspx page has the following html in it:
<li class="thumpimage">
<%=Html.Hidden("attachmtId", item.ILDAttachmentId) %>
<img src="<%=imgurl %>" alt="test" height="81" width="76" />
<span class="thumb_descrp">
<%=item.ILDAttachmentName %></span></li>
The jquery part is as follows
$(document).ready(function() {
$(".thumpimage").click(function() {
var attchmtId = $("#attachmtId").val();
alert(attchmtId);
$.post('/Instruction/OpenInstnDoc', { attchId: attchmtId });
});
});
And the function in the controller is
public ActionResult OpenInstnDoc(int attchId)
{
Attachment objAttach = new Attachment();
objAttach = objAttach.GetAttachmentById(attchId);
byte[] theData = objAttach.BinaryFile;
Response.AddHeader("content-length", theData.Length.ToString());
Response.AddHeader("content-disposition", "inline; filename=" + objAttach.AttachmentName + "");
return File(theData, objAttach.MineType);
}
I am not able open the file. Can anyone help me on this?
You cannot use ajax to stream file content to the browser and expect to be prompted with a file open/save dialog. Instead of the call to $.post, try
$(document).ready(function() {
$(".thumpimage").click(function() {
var attchmtId = $("#attachmtId").val();
alert(attchmtId);
//$.post('/Instruction/OpenInstnDoc', { attchId: attchmtId });
window.location.href = "/Instruction/OpenInstnDoc/" + attchmtId;
});
});